{"id":8,"date":"2026-07-15T15:23:13","date_gmt":"2026-07-15T15:23:13","guid":{"rendered":"https:\/\/kli-mat.eu\/?page_id=8"},"modified":"2026-07-15T15:24:42","modified_gmt":"2026-07-15T15:24:42","slug":"strona-glowna","status":"publish","type":"page","link":"https:\/\/kli-mat.eu\/","title":{"rendered":"Strona g\u0142\u00f3wna"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"8\" class=\"elementor elementor-8\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-fc48621 e-con-full e-flex e-con e-parent\" data-id=\"fc48621\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-92c2283 elementor-widget elementor-widget-html\" data-id=\"92c2283\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- ============================================================\r\n     KLI-MAT \u2014 Klimatyzacja i Ch\u0142odnictwo\r\n     Strona typu one-page przygotowana do wklejenia w widget HTML\r\n     Elementora. Wszystko (HTML + CSS + JS) w jednym pliku, bez\r\n     zewn\u0119trznych bibliotek i bez FontAwesome \u2014 ikony to czyste SVG.\r\n     ============================================================ -->\r\n<meta name=\"description\" content=\"KLI-MAT \u2014 profesjonalna sprzeda\u017c, monta\u017c i serwis klimatyzacji oraz ch\u0142odnictwo w Gniewie i okolicach. Zadzwo\u0144: 789 153 062.\">\r\n\r\n<style>\r\n  \/* ==========================================================\r\n     0. RESET I ZMIENNE\r\n     ========================================================== *\/\r\n  .klimat-root, .klimat-root * , .klimat-root *::before, .klimat-root *::after{\r\n    box-sizing:border-box;\r\n    margin:0; padding:0;\r\n  }\r\n  .klimat-root{\r\n    --c-primary:#11B5E4;\r\n    --c-primary-light:#4FD4F5;\r\n    --c-white:#FFFFFF;\r\n    --c-dark:#1D1D1D;\r\n    --c-accent:#FF3131;\r\n    --c-grey:#6b7480;\r\n    --c-bg-soft:#f4fbfd;\r\n    --c-glass:rgba(255,255,255,0.55);\r\n    --c-glass-dark:rgba(20,26,30,0.55);\r\n    --shadow-sm:0 4px 14px rgba(17,181,228,0.12);\r\n    --shadow-md:0 12px 32px rgba(17,181,228,0.18);\r\n    --shadow-lg:0 24px 60px rgba(17,181,228,0.22);\r\n    --radius-sm:12px;\r\n    --radius-md:20px;\r\n    --radius-lg:32px;\r\n    --ease:cubic-bezier(.4,0,.2,1);\r\n    font-family:'Segoe UI', -apple-system, BlinkMacSystemFont, Roboto, Arial, sans-serif;\r\n    color:var(--c-dark);\r\n    background:var(--c-white);\r\n    overflow-x:hidden;\r\n    position:relative;\r\n    -webkit-font-smoothing:antialiased;\r\n  }\r\n  .klimat-root h1,.klimat-root h2,.klimat-root h3{\r\n    font-family:'Segoe UI', Arial, sans-serif;\r\n    font-weight:800;\r\n    line-height:1.15;\r\n    letter-spacing:-0.02em;\r\n  }\r\n  .klimat-root a{text-decoration:none; color:inherit;}\r\n  .klimat-root ul{list-style:none;}\r\n  .klimat-root img{max-width:100%; display:block;}\r\n  .klimat-root button{font-family:inherit; cursor:pointer;}\r\n  .klimat-root section{position:relative; padding:100px 6vw;}\r\n  @media(max-width:900px){ .klimat-root section{padding:70px 6vw;} }\r\n  @media(max-width:520px){ .klimat-root section{padding:56px 5vw;} }\r\n\r\n  .k-eyebrow{\r\n    display:inline-flex; align-items:center; gap:8px;\r\n    font-size:13px; font-weight:700; letter-spacing:.14em; text-transform:uppercase;\r\n    color:var(--c-primary); margin-bottom:14px;\r\n  }\r\n  .k-eyebrow::before{\r\n    content:''; width:26px; height:2px; background:linear-gradient(90deg,var(--c-primary),var(--c-primary-light));\r\n    border-radius:2px;\r\n  }\r\n  .k-section-title{ font-size:clamp(28px,4vw,42px); margin-bottom:14px; }\r\n  .k-section-sub{ color:var(--c-grey); font-size:17px; max-width:560px; line-height:1.6; }\r\n  .k-section-head{ text-align:center; max-width:680px; margin:0 auto 56px; }\r\n  .k-section-head .k-eyebrow{justify-content:center;}\r\n  .k-section-head .k-section-sub{margin:0 auto;}\r\n\r\n  \/* ==========================================================\r\n     1. T\u0141O \u2014 P\u0141ATKI \u015aNIEGU (canvas, subtelne, ca\u0142o\u015bciowe)\r\n     ========================================================== *\/\r\n  #klimat-snow-canvas{\r\n    position:fixed; inset:0; width:100%; height:100%;\r\n    pointer-events:none; z-index:2; opacity:.55;\r\n  }\r\n\r\n  \/* ==========================================================\r\n     2. STICKY MENU\r\n     ========================================================== *\/\r\n  .k-nav{\r\n    position:sticky; top:0; z-index:1000;\r\n    display:flex; align-items:center; justify-content:space-between;\r\n    padding:14px 6vw;\r\n    background:rgba(255,255,255,.7);\r\n    backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);\r\n    border-bottom:1px solid rgba(17,181,228,.12);\r\n    transition:box-shadow .3s var(--ease), padding .3s var(--ease);\r\n  }\r\n  .k-nav.k-scrolled{ box-shadow:0 8px 30px rgba(17,181,228,.12); padding:10px 6vw; }\r\n\r\n  .k-logo{ display:flex; align-items:center; gap:10px; font-weight:800; font-size:20px; color:var(--c-dark); }\r\n  .k-logo-fan{ width:38px; height:38px; flex-shrink:0; }\r\n  .k-logo-fan svg{ width:100%; height:100%; animation:klimat-spin 6s linear infinite; }\r\n  .k-logo-text b{ color:var(--c-primary); }\r\n  .k-logo-sub{ display:block; font-size:10.5px; font-weight:600; letter-spacing:.06em; color:var(--c-grey); text-transform:uppercase; }\r\n\r\n  .k-nav-links{ display:flex; align-items:center; gap:34px; }\r\n  .k-nav-links a{\r\n    font-weight:600; font-size:15px; color:var(--c-dark);\r\n    position:relative; padding:6px 0;\r\n  }\r\n  .k-nav-links a::after{\r\n    content:''; position:absolute; left:0; bottom:0; width:0; height:2px;\r\n    background:linear-gradient(90deg,var(--c-primary),var(--c-primary-light));\r\n    transition:width .3s var(--ease); border-radius:2px;\r\n  }\r\n  .k-nav-links a:hover::after{ width:100%; }\r\n\r\n  .k-btn{\r\n    display:inline-flex; align-items:center; gap:8px;\r\n    padding:13px 26px; border-radius:100px; border:none;\r\n    font-weight:700; font-size:14.5px; letter-spacing:.01em;\r\n    position:relative; overflow:hidden; isolation:isolate;\r\n    transition:transform .25s var(--ease), box-shadow .25s var(--ease);\r\n  }\r\n  .k-btn svg{ width:18px; height:18px; }\r\n  .k-btn-primary,\r\n  .k-btn-primary:visited{\r\n    background:linear-gradient(135deg,var(--c-primary),var(--c-primary-light));\r\n    color:#fff !important; box-shadow:var(--shadow-sm);\r\n  }\r\n  .k-btn-primary:hover{ transform:translateY(-3px); box-shadow:var(--shadow-md); color:#fff !important; }\r\n  .k-btn-accent,\r\n  .k-btn-accent:visited{\r\n    background:var(--c-accent); color:#fff !important; box-shadow:0 10px 26px rgba(255,49,49,.3);\r\n  }\r\n  .k-btn-accent:hover{ transform:translateY(-3px); box-shadow:0 16px 34px rgba(255,49,49,.4); color:#fff !important; }\r\n  .k-btn-outline,\r\n  .k-btn-outline:visited{\r\n    background:transparent; color:var(--c-primary) !important; border:2px solid rgba(17,181,228,.35);\r\n  }\r\n  .k-btn-outline:hover{ border-color:var(--c-primary); background:rgba(17,181,228,.06); color:var(--c-primary) !important; transform:translateY(-3px); }\r\n\r\n  \/* efekt \"ripple\" na przyciskach *\/\r\n  .k-btn .k-ripple{\r\n    position:absolute; border-radius:50%; background:rgba(255,255,255,.55);\r\n    transform:scale(0); animation:klimat-ripple .6s var(--ease) forwards;\r\n    pointer-events:none;\r\n  }\r\n  @keyframes klimat-ripple{ to{ transform:scale(3); opacity:0; } }\r\n\r\n  .k-nav-cta{ display:flex; align-items:center; gap:14px; }\r\n  .k-burger{ display:none; width:26px; height:20px; position:relative; }\r\n  .k-burger span{\r\n    position:absolute; left:0; width:100%; height:2.5px; background:var(--c-dark); border-radius:2px;\r\n    transition:all .3s var(--ease);\r\n  }\r\n  .k-burger span:nth-child(1){ top:0; }\r\n  .k-burger span:nth-child(2){ top:8.5px; }\r\n  .k-burger span:nth-child(3){ top:17px; }\r\n  .k-burger.open span:nth-child(1){ transform:translateY(8.5px) rotate(45deg); }\r\n  .k-burger.open span:nth-child(2){ opacity:0; }\r\n  .k-burger.open span:nth-child(3){ transform:translateY(-8.5px) rotate(-45deg); }\r\n\r\n  @media(max-width:900px){\r\n    .k-nav-links{\r\n      position:fixed; top:64px; left:0; right:0;\r\n      flex-direction:column; align-items:flex-start; gap:0;\r\n      background:rgba(255,255,255,.98); backdrop-filter:blur(14px);\r\n      padding:10px 6vw 20px; border-bottom:1px solid rgba(17,181,228,.12);\r\n      transform:translateY(-130%); opacity:0; transition:all .35s var(--ease);\r\n      pointer-events:none;\r\n    }\r\n    .k-nav-links.k-open{ transform:translateY(0); opacity:1; pointer-events:auto; }\r\n    .k-nav-links a{ width:100%; padding:14px 0; border-bottom:1px solid rgba(29,29,29,.06); }\r\n    .k-nav .k-nav-cta .k-btn-primary{ display:none; }\r\n    .k-burger{ display:block; }\r\n  }\r\n\r\n  \/* ==========================================================\r\n     3. HERO\r\n     ========================================================== *\/\r\n  .k-hero{\r\n    position:relative; padding:70px 6vw 110px; overflow:hidden;\r\n    display:grid; grid-template-columns:1.15fr .85fr; gap:50px; align-items:center;\r\n    min-height:88vh;\r\n  }\r\n  .k-hero-bg{\r\n    position:absolute; inset:0; z-index:-2;\r\n    background:\r\n      radial-gradient(ellipse at 15% 20%, rgba(79,212,245,.16), transparent 55%),\r\n      radial-gradient(ellipse at 85% 80%, rgba(17,181,228,.14), transparent 55%),\r\n      linear-gradient(180deg,#ffffff 0%, #f4fbfd 100%);\r\n  }\r\n  .k-hero-shape{\r\n    position:absolute; border-radius:50%; z-index:-1; filter:blur(2px);\r\n    background:linear-gradient(135deg,rgba(17,181,228,.18),rgba(79,212,245,.05));\r\n    animation:klimat-float 9s ease-in-out infinite;\r\n  }\r\n  .k-hero-shape.s1{ width:180px; height:180px; top:8%; left:2%; animation-delay:0s; }\r\n  .k-hero-shape.s2{ width:110px; height:110px; bottom:12%; left:38%; animation-delay:2s; }\r\n  .k-hero-shape.s3{ width:70px; height:70px; top:20%; right:6%; animation-delay:1s; }\r\n  @keyframes klimat-float{\r\n    0%,100%{ transform:translateY(0) translateX(0); }\r\n    50%{ transform:translateY(-22px) translateX(10px); }\r\n  }\r\n\r\n  .k-hero-eyebrow{\r\n    display:inline-flex; align-items:center; gap:8px;\r\n    background:var(--c-glass); backdrop-filter:blur(8px);\r\n    border:1px solid rgba(17,181,228,.25);\r\n    padding:8px 16px; border-radius:100px;\r\n    font-size:13px; font-weight:700; color:var(--c-primary);\r\n    letter-spacing:.03em; margin-bottom:22px;\r\n  }\r\n  .k-hero-eyebrow .k-dot{ width:8px; height:8px; border-radius:50%; background:var(--c-accent); animation:klimat-pulse 1.8s ease-in-out infinite; }\r\n  @keyframes klimat-pulse{ 0%,100%{ transform:scale(1); opacity:1;} 50%{ transform:scale(1.4); opacity:.5; } }\r\n\r\n  .k-hero h1{\r\n    font-size:clamp(34px,5vw,58px);\r\n    margin-bottom:20px;\r\n  }\r\n  .k-hero h1 span{\r\n    background:linear-gradient(120deg,var(--c-primary),var(--c-primary-light));\r\n    -webkit-background-clip:text; background-clip:text; color:transparent;\r\n  }\r\n  .k-hero p.k-lead{\r\n    font-size:18px; color:var(--c-grey); line-height:1.7; max-width:520px; margin-bottom:34px;\r\n  }\r\n  .k-hero p.k-lead b{ color:var(--c-dark); }\r\n  .k-hero-actions{ display:flex; gap:16px; flex-wrap:wrap; margin-bottom:48px; }\r\n\r\n  .k-hero-stats{ display:flex; gap:38px; flex-wrap:wrap; }\r\n  .k-stat{ }\r\n  .k-stat-num{\r\n    font-size:32px; font-weight:800; color:var(--c-dark); display:flex; align-items:baseline; gap:2px;\r\n  }\r\n  .k-stat-num small{ color:var(--c-primary); font-size:22px; }\r\n  .k-stat-label{ font-size:13.5px; color:var(--c-grey); font-weight:600; margin-top:2px; }\r\n\r\n  \/* karta w hero *\/\r\n  .k-hero-card-wrap{ position:relative; display:flex; justify-content:center; }\r\n  .k-hero-card{\r\n    position:relative; width:100%; max-width:400px; border-radius:var(--radius-lg);\r\n    padding:36px 30px; overflow:hidden;\r\n    background:linear-gradient(160deg, rgba(17,181,228,.94), rgba(23,52,71,.96));\r\n    box-shadow:var(--shadow-lg);\r\n    color:#fff;\r\n    animation:klimat-cardfloat 6s ease-in-out infinite;\r\n  }\r\n  @keyframes klimat-cardfloat{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-14px);} }\r\n  .k-hero-card::before{\r\n    content:''; position:absolute; inset:0;\r\n    background:radial-gradient(circle at 80% 0%, rgba(255,255,255,.22), transparent 60%);\r\n  }\r\n  .k-hero-card-fan{\r\n    width:64px; height:64px; margin-bottom:20px; position:relative; z-index:1;\r\n  }\r\n  .k-hero-card-fan svg{ width:100%; height:100%; animation:klimat-spin 5s linear infinite; }\r\n  .k-hero-card h3{ font-size:20px; margin-bottom:6px; position:relative; z-index:1; }\r\n  .k-hero-card p{ font-size:14px; opacity:.85; margin-bottom:22px; position:relative; z-index:1; }\r\n  .k-hero-card-list{ position:relative; z-index:1; display:flex; flex-direction:column; gap:14px; }\r\n  .k-hero-card-list li{\r\n    display:flex; align-items:center; gap:12px; font-size:15px; font-weight:600;\r\n    background:rgba(255,255,255,.1); padding:12px 14px; border-radius:var(--radius-sm);\r\n    backdrop-filter:blur(6px);\r\n    transition:transform .3s var(--ease), background .3s var(--ease);\r\n  }\r\n  .k-hero-card-list li:hover{ transform:translateX(6px); background:rgba(255,255,255,.18); }\r\n  .k-hero-card-list .k-check{\r\n    width:22px; height:22px; border-radius:50%; background:var(--c-accent);\r\n    display:flex; align-items:center; justify-content:center; flex-shrink:0;\r\n  }\r\n  .k-hero-card-list .k-check svg{ width:12px; height:12px; }\r\n\r\n  @media(max-width:1000px){\r\n    .k-hero{ grid-template-columns:1fr; text-align:left; padding-top:40px; }\r\n    .k-hero-card-wrap{ margin-top:10px; }\r\n  }\r\n\r\n  \/* ==========================================================\r\n     4. SCROLL REVEAL \u2014 klasy generyczne\r\n     ========================================================== *\/\r\n  .k-reveal{ opacity:0; transition:opacity .8s var(--ease), transform .8s var(--ease); }\r\n  .k-reveal.k-up{ transform:translateY(40px); }\r\n  .k-reveal.k-left{ transform:translateX(-50px); }\r\n  .k-reveal.k-right{ transform:translateX(50px); }\r\n  .k-reveal.k-scale{ transform:scale(.9); }\r\n  .k-reveal.k-visible{ opacity:1; transform:translate(0,0) scale(1); }\r\n\r\n  \/* ==========================================================\r\n     5. SEKCJA OFERTA\r\n     ========================================================== *\/\r\n  .k-offer-grid{\r\n    display:grid; grid-template-columns:repeat(4,1fr); gap:26px;\r\n  }\r\n  @media(max-width:1000px){ .k-offer-grid{ grid-template-columns:1fr 1fr; } }\r\n  @media(max-width:560px){ .k-offer-grid{ grid-template-columns:1fr; } }\r\n\r\n  .k-offer-card{\r\n    background:#fff; border-radius:var(--radius-md); padding:34px 26px;\r\n    border:1px solid rgba(17,181,228,.1);\r\n    box-shadow:var(--shadow-sm);\r\n    transition:transform .4s var(--ease), box-shadow .4s var(--ease), border-color .4s var(--ease);\r\n    position:relative; overflow:hidden;\r\n  }\r\n  .k-offer-card::after{\r\n    content:''; position:absolute; top:0; left:0; right:0; height:4px;\r\n    background:linear-gradient(90deg,var(--c-primary),var(--c-primary-light));\r\n    transform:scaleX(0); transform-origin:left; transition:transform .4s var(--ease);\r\n  }\r\n  .k-offer-card:hover{\r\n    transform:translateY(-10px); box-shadow:var(--shadow-lg); border-color:transparent;\r\n  }\r\n  .k-offer-card:hover::after{ transform:scaleX(1); }\r\n  .k-offer-icon{\r\n    width:60px; height:60px; border-radius:16px; margin-bottom:20px;\r\n    background:linear-gradient(135deg, rgba(17,181,228,.12), rgba(79,212,245,.16));\r\n    display:flex; align-items:center; justify-content:center;\r\n    transition:transform .5s var(--ease), background .4s var(--ease);\r\n  }\r\n  .k-offer-card:hover .k-offer-icon{ transform:rotate(-8deg) scale(1.08); background:linear-gradient(135deg,var(--c-primary),var(--c-primary-light)); }\r\n  .k-offer-icon svg{ width:28px; height:28px; stroke:var(--c-primary); transition:stroke .4s var(--ease); }\r\n  .k-offer-card:hover .k-offer-icon svg{ stroke:#fff; }\r\n  .k-offer-card h3{ font-size:19px; margin-bottom:10px; }\r\n  .k-offer-card p{ font-size:14.5px; color:var(--c-grey); line-height:1.6; }\r\n\r\n  \/* ==========================================================\r\n     6. DLACZEGO MY\r\n     ========================================================== *\/\r\n  .k-why{ background:var(--c-bg-soft); }\r\n  .k-why-grid{\r\n    display:grid; grid-template-columns:repeat(3,1fr); gap:22px;\r\n  }\r\n  @media(max-width:900px){ .k-why-grid{ grid-template-columns:1fr 1fr; } }\r\n  @media(max-width:560px){ .k-why-grid{ grid-template-columns:1fr; } }\r\n\r\n  .k-why-tile{\r\n    background:#fff; border-radius:var(--radius-md); padding:28px 24px;\r\n    display:flex; gap:16px; align-items:flex-start;\r\n    box-shadow:var(--shadow-sm);\r\n    transition:transform .35s var(--ease), box-shadow .35s var(--ease);\r\n  }\r\n  .k-why-tile:hover{ transform:translateY(-6px); box-shadow:var(--shadow-md); }\r\n  .k-why-icon{\r\n    width:46px; height:46px; border-radius:12px; flex-shrink:0;\r\n    background:linear-gradient(135deg,var(--c-primary),var(--c-primary-light));\r\n    display:flex; align-items:center; justify-content:center;\r\n  }\r\n  .k-why-icon svg{ width:22px; height:22px; stroke:#fff; }\r\n  .k-why-tile h3{ font-size:16.5px; margin-bottom:6px; }\r\n  .k-why-tile p{ font-size:13.8px; color:var(--c-grey); line-height:1.55; }\r\n\r\n  \/* ==========================================================\r\n     7. TIMELINE \u2014 WSP\u00d3\u0141PRACA\r\n     ========================================================== *\/\r\n  .k-timeline{\r\n    display:flex; justify-content:space-between; align-items:flex-start;\r\n    position:relative; max-width:980px; margin:0 auto; gap:10px;\r\n  }\r\n  .k-timeline::before{\r\n    content:''; position:absolute; top:34px; left:6%; right:6%; height:2px;\r\n    background:repeating-linear-gradient(90deg, rgba(17,181,228,.35) 0 10px, transparent 10px 20px);\r\n    z-index:0;\r\n  }\r\n  .k-tl-step{ position:relative; z-index:1; flex:1; text-align:center; display:flex; flex-direction:column; align-items:center; }\r\n  .k-tl-num{\r\n    width:68px; height:68px; border-radius:50%; background:#fff;\r\n    border:2px solid var(--c-primary);\r\n    display:flex; align-items:center; justify-content:center;\r\n    font-size:24px; font-weight:800; color:var(--c-primary);\r\n    margin-bottom:18px; box-shadow:var(--shadow-sm);\r\n    transition:transform .35s var(--ease), background .35s var(--ease), color .35s var(--ease);\r\n  }\r\n  .k-tl-step:hover .k-tl-num{ transform:scale(1.1); background:linear-gradient(135deg,var(--c-primary),var(--c-primary-light)); color:#fff; }\r\n  .k-tl-step h3{ font-size:16.5px; margin-bottom:8px; }\r\n  .k-tl-step p{ font-size:13.5px; color:var(--c-grey); max-width:190px; line-height:1.55; }\r\n\r\n  @media(max-width:800px){\r\n    .k-timeline{ flex-direction:column; align-items:stretch; gap:34px; }\r\n    .k-timeline::before{ display:none; }\r\n    .k-tl-step{ flex-direction:row; text-align:left; gap:18px; }\r\n    .k-tl-num{ margin-bottom:0; flex-shrink:0; }\r\n    .k-tl-step p{ max-width:none; }\r\n  }\r\n\r\n  \/* ==========================================================\r\n     8. REALIZACJE (galeria placeholder)\r\n     ========================================================== *\/\r\n  .k-gallery{ display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }\r\n  @media(max-width:800px){ .k-gallery{ grid-template-columns:1fr 1fr; } }\r\n  @media(max-width:520px){ .k-gallery{ grid-template-columns:1fr; } }\r\n  .k-gallery-item{\r\n    position:relative; border-radius:var(--radius-md); overflow:hidden; aspect-ratio:4\/3;\r\n    background:linear-gradient(135deg,#dff6fc,#eaf9fd);\r\n    display:flex; align-items:center; justify-content:center;\r\n    box-shadow:var(--shadow-sm);\r\n    transition:transform .4s var(--ease), box-shadow .4s var(--ease);\r\n  }\r\n  .k-gallery-item:hover{ transform:scale(1.03); box-shadow:var(--shadow-md); }\r\n  .k-gallery-item svg{ width:52px; height:52px; stroke:var(--c-primary); opacity:.55; }\r\n  .k-gallery-cap{\r\n    position:absolute; left:0; right:0; bottom:0; padding:14px 16px;\r\n    background:linear-gradient(0deg, rgba(17,181,228,.92), transparent);\r\n    color:#fff; font-weight:700; font-size:14px;\r\n    transform:translateY(100%); transition:transform .35s var(--ease);\r\n  }\r\n  .k-gallery-item:hover .k-gallery-cap{ transform:translateY(0); }\r\n\r\n  \/* ==========================================================\r\n     9. CTA\r\n     ========================================================== *\/\r\n  .k-cta{\r\n    position:relative; overflow:hidden; text-align:center;\r\n    background:linear-gradient(135deg,#0d2a3a,#123a52 45%,var(--c-primary));\r\n    border-radius:var(--radius-lg); margin:0 6vw; padding:80px 6vw;\r\n    color:#fff;\r\n  }\r\n  .k-cta::before{\r\n    content:''; position:absolute; inset:0;\r\n    background:radial-gradient(circle at 20% 20%, rgba(79,212,245,.28), transparent 55%),\r\n               radial-gradient(circle at 85% 80%, rgba(255,49,49,.16), transparent 50%);\r\n  }\r\n  .k-cta-fan{\r\n    position:absolute; width:280px; height:280px; right:-60px; top:-60px; opacity:.12;\r\n  }\r\n  .k-cta-fan svg{ width:100%; height:100%; animation:klimat-spin 14s linear infinite; }\r\n  .k-cta h2{ font-size:clamp(26px,4vw,40px); margin-bottom:14px; position:relative; }\r\n  .k-cta p{ font-size:17px; opacity:.85; margin-bottom:34px; position:relative; }\r\n  .k-cta .k-btn{ position:relative; font-size:16px; padding:16px 36px; }\r\n\r\n  \/* ==========================================================\r\n     10. FORMULARZ KONTAKTOWY\r\n     ========================================================== *\/\r\n  .k-contact{ display:grid; grid-template-columns:.9fr 1.1fr; gap:50px; align-items:flex-start; }\r\n  @media(max-width:900px){ .k-contact{ grid-template-columns:1fr; } }\r\n\r\n  .k-contact-info-card{\r\n    background:linear-gradient(160deg, rgba(17,181,228,.06), rgba(79,212,245,.1));\r\n    border:1px solid rgba(17,181,228,.15);\r\n    border-radius:var(--radius-lg); padding:36px 30px;\r\n  }\r\n  .k-contact-info-card h3{ font-size:22px; margin-bottom:8px; }\r\n  .k-contact-info-card > p{ color:var(--c-grey); font-size:14.5px; margin-bottom:26px; line-height:1.6; }\r\n  .k-contact-row{\r\n    display:flex; align-items:center; gap:14px; padding:14px 0;\r\n    border-top:1px solid rgba(29,29,29,.08);\r\n  }\r\n  .k-contact-row:first-of-type{ border-top:none; }\r\n  .k-contact-icon{\r\n    width:44px; height:44px; border-radius:12px; flex-shrink:0;\r\n    background:#fff; box-shadow:var(--shadow-sm);\r\n    display:flex; align-items:center; justify-content:center;\r\n  }\r\n  .k-contact-icon svg{ width:20px; height:20px; stroke:var(--c-primary); }\r\n  .k-contact-row a, .k-contact-row span{ font-weight:700; font-size:15px; }\r\n  .k-contact-row small{ display:block; color:var(--c-grey); font-weight:500; font-size:12.5px; }\r\n  .k-contact-row a:hover{ color:var(--c-primary); }\r\n\r\n  .k-form{\r\n    background:#fff; border-radius:var(--radius-lg); padding:36px 30px;\r\n    box-shadow:var(--shadow-md); border:1px solid rgba(17,181,228,.08);\r\n  }\r\n  .k-form-row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }\r\n  @media(max-width:520px){ .k-form-row{ grid-template-columns:1fr; } }\r\n  .k-field{ margin-bottom:18px; position:relative; }\r\n  .k-field label{ display:block; font-size:13px; font-weight:700; margin-bottom:7px; color:var(--c-dark); }\r\n  .k-field input, .k-field textarea{\r\n    width:100%; padding:13px 16px; border-radius:12px; border:1.5px solid rgba(29,29,29,.12);\r\n    font-size:14.5px; font-family:inherit; color:var(--c-dark);\r\n    background:#fafdfe; transition:border-color .25s var(--ease), box-shadow .25s var(--ease);\r\n  }\r\n  .k-field textarea{ min-height:110px; resize:vertical; }\r\n  .k-field input:focus, .k-field textarea:focus{\r\n    outline:none; border-color:var(--c-primary); box-shadow:0 0 0 4px rgba(17,181,228,.14);\r\n  }\r\n  .k-form-submit{ width:100%; justify-content:center; font-size:16px; padding:15px; }\r\n  .k-form-note{ font-size:12.5px; color:var(--c-grey); margin-top:12px; text-align:center; }\r\n  .k-form-success{\r\n    display:none; text-align:center; padding:30px 10px;\r\n  }\r\n  .k-form-success.k-show{ display:block; animation:klimat-fadeup .5s var(--ease); }\r\n  .k-form-success svg{ width:52px; height:52px; stroke:var(--c-primary); margin-bottom:14px; }\r\n  .k-form-success h4{ font-size:19px; margin-bottom:6px; }\r\n  .k-form-success p{ color:var(--c-grey); font-size:14px; }\r\n  @keyframes klimat-fadeup{ from{ opacity:0; transform:translateY(14px);} to{ opacity:1; transform:translateY(0);} }\r\n\r\n  \/* ==========================================================\r\n     11. STOPKA\r\n     ========================================================== *\/\r\n  .k-footer{\r\n    background:var(--c-dark); color:#fff; padding:64px 6vw 26px;\r\n  }\r\n  .k-footer-grid{\r\n    display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; margin-bottom:40px;\r\n  }\r\n  @media(max-width:800px){ .k-footer-grid{ grid-template-columns:1fr; gap:30px; } }\r\n  .k-footer-logo{ display:flex; align-items:center; gap:10px; font-size:20px; font-weight:800; margin-bottom:14px; }\r\n  .k-footer-logo .k-logo-fan svg{ animation:klimat-spin 8s linear infinite; }\r\n  .k-footer p{ color:rgba(255,255,255,.6); font-size:14px; line-height:1.7; max-width:340px; }\r\n  .k-footer h4{ font-size:15px; margin-bottom:18px; letter-spacing:.03em; text-transform:uppercase; color:rgba(255,255,255,.85); }\r\n  .k-footer-links li{ margin-bottom:11px; }\r\n  .k-footer-links a{ color:rgba(255,255,255,.65); font-size:14.5px; transition:color .25s var(--ease), padding-left .25s var(--ease); }\r\n  .k-footer-links a:hover{ color:var(--c-primary-light); padding-left:4px; }\r\n  .k-footer-contact li{ display:flex; align-items:center; gap:10px; margin-bottom:14px; color:rgba(255,255,255,.75); font-size:14.5px; }\r\n  .k-footer-contact svg{ width:17px; height:17px; stroke:var(--c-primary-light); flex-shrink:0; }\r\n  .k-footer-bottom{\r\n    border-top:1px solid rgba(255,255,255,.1); padding-top:22px;\r\n    display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;\r\n    font-size:13px; color:rgba(255,255,255,.45);\r\n  }\r\n\r\n  \/* ==========================================================\r\n     12. STICKY CTA MOBILE + BACK TO TOP\r\n     ========================================================== *\/\r\n  .k-mobile-cta{\r\n    position:fixed; left:0; right:0; bottom:0; z-index:1200;\r\n    display:none; padding:12px 16px; gap:10px;\r\n    background:rgba(255,255,255,.9); backdrop-filter:blur(14px);\r\n    border-top:1px solid rgba(17,181,228,.15);\r\n    box-shadow:0 -8px 24px rgba(17,181,228,.12);\r\n  }\r\n  @media(max-width:900px){ .k-mobile-cta{ display:flex; } }\r\n  .k-mobile-cta .k-btn{ flex:1; justify-content:center; }\r\n\r\n  .k-totop{\r\n    position:fixed; right:26px; bottom:26px; z-index:1200;\r\n    width:50px; height:50px; border-radius:50%; border:none;\r\n    background:linear-gradient(135deg,var(--c-primary),var(--c-primary-light));\r\n    box-shadow:var(--shadow-md);\r\n    display:flex; align-items:center; justify-content:center;\r\n    opacity:0; visibility:hidden; transform:translateY(16px);\r\n    transition:all .35s var(--ease);\r\n  }\r\n  .k-totop.k-show{ opacity:1; visibility:visible; transform:translateY(0); }\r\n  .k-totop svg{ width:20px; height:20px; stroke:#fff; }\r\n  .k-totop:hover{ transform:translateY(-4px); }\r\n  @media(max-width:900px){ .k-totop{ bottom:86px; right:16px; width:44px; height:44px; } }\r\n\r\n  \/* ==========================================================\r\n     13. UTIL\r\n     ========================================================== *\/\r\n  @keyframes klimat-spin{ from{ transform:rotate(0);} to{ transform:rotate(360deg);} }\r\n  .k-visually-center{ display:flex; align-items:center; justify-content:center; }\r\n\r\n  @media(prefers-reduced-motion: reduce){\r\n    .klimat-root *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }\r\n  }\r\n\r\n  \/* ==========================================================\r\n     14. DODATKOWE POPRAWKI RESPONSYWNO\u015aCI (mobile fine-tuning)\r\n     ========================================================== *\/\r\n  @media(max-width:900px){\r\n    .k-hero{ min-height:auto; padding-bottom:70px; }\r\n    .k-hero-actions .k-btn{ flex:1 1 auto; justify-content:center; }\r\n    .k-timeline{ margin-top:6px; }\r\n    section{ scroll-margin-top:70px; }\r\n  }\r\n\r\n  @media(max-width:640px){\r\n    .k-logo{ font-size:17px; gap:8px; }\r\n    .k-logo-fan{ width:32px; height:32px; }\r\n    .k-logo-sub{ font-size:9.5px; }\r\n    .k-nav{ padding:12px 5vw; gap:10px; }\r\n    .k-hero{ padding-top:26px; gap:36px; }\r\n    .k-hero-stats{ gap:24px 30px; }\r\n    .k-stat-num{ font-size:26px; }\r\n    .k-hero-card{ padding:28px 22px; max-width:none; }\r\n    .k-offer-card{ padding:28px 22px; }\r\n    .k-why-tile{ padding:22px 18px; flex-direction:column; }\r\n    .k-why-icon{ margin-bottom:2px; }\r\n    .k-cta{ margin:0 4vw; padding:56px 6vw; border-radius:var(--radius-md); }\r\n    .k-contact-info-card, .k-form{ padding:26px 20px; }\r\n    .k-footer{ padding:48px 6vw 22px; }\r\n    .k-footer-bottom{ flex-direction:column; text-align:center; }\r\n    .k-mobile-cta{ padding:10px 12px; }\r\n  }\r\n\r\n  @media(max-width:400px){\r\n    .k-hero h1{ font-size:28px; }\r\n    .k-hero-actions{ flex-direction:column; }\r\n    .k-hero-actions .k-btn{ width:100%; }\r\n    .k-btn{ padding:12px 20px; font-size:14px; }\r\n    .k-section-title{ font-size:24px; }\r\n    .k-cta h2{ font-size:22px; }\r\n  }\r\n<\/style>\r\n\r\n<!-- ============================================================\r\n     MARKUP\r\n     ============================================================ -->\r\n<div class=\"klimat-root\" id=\"klimatRoot\">\r\n\r\n  <!-- p\u0142atki \u015bniegu w tle ca\u0142ej strony -->\r\n  <canvas id=\"klimat-snow-canvas\"><\/canvas>\r\n\r\n  <!-- ============ MENU ============ -->\r\n  <header>\r\n    <nav class=\"k-nav\" id=\"klimatNav\">\r\n      <a href=\"#klimat-start\" class=\"k-logo\" aria-label=\"KLI-MAT \u2014 strona g\u0142\u00f3wna\">\r\n        <span class=\"k-logo-fan\">\r\n          <svg viewBox=\"0 0 48 48\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n            <circle cx=\"24\" cy=\"24\" r=\"22\" stroke=\"#11B5E4\" stroke-width=\"2\"\/>\r\n            <path d=\"M24 24C24 24 22 12 14 12C10 12 8 15 8 18C8 22 14 24 24 24Z\" fill=\"#11B5E4\"\/>\r\n            <path d=\"M24 24C24 24 36 22 36 14C36 10 33 8 30 8C26 8 24 14 24 24Z\" fill=\"#4FD4F5\"\/>\r\n            <path d=\"M24 24C24 24 26 36 34 36C38 36 40 33 40 30C40 26 34 24 24 24Z\" fill=\"#11B5E4\"\/>\r\n            <path d=\"M24 24C24 24 12 26 12 34C12 38 15 40 18 40C22 40 24 34 24 24Z\" fill=\"#4FD4F5\"\/>\r\n            <circle cx=\"24\" cy=\"24\" r=\"4.5\" fill=\"#1D1D1D\"\/>\r\n          <\/svg>\r\n        <\/span>\r\n        <span class=\"k-logo-text\">\r\n          <b>KLI-MAT<\/b>\r\n          <span class=\"k-logo-sub\">Klimatyzacja i ch\u0142odnictwo<\/span>\r\n        <\/span>\r\n      <\/a>\r\n\r\n      <ul class=\"k-nav-links\" id=\"klimatNavLinks\">\r\n        <li><a href=\"#klimat-start\">Start<\/a><\/li>\r\n        <li><a href=\"#klimat-oferta\">Oferta<\/a><\/li>\r\n        <li><a href=\"#klimat-dlaczego\">Dlaczego My<\/a><\/li>\r\n        <li><a href=\"#klimat-realizacje\">Realizacje<\/a><\/li>\r\n        <li><a href=\"#klimat-kontakt\">Kontakt<\/a><\/li>\r\n      <\/ul>\r\n\r\n      <div class=\"k-nav-cta\">\r\n        <a href=\"tel:789153062\" class=\"k-btn k-btn-primary\" data-ripple>\r\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z\"\/><\/svg>\r\n          Zadzwo\u0144\r\n        <\/a>\r\n        <button class=\"k-burger\" id=\"klimatBurger\" aria-label=\"Otw\u00f3rz menu\"><span><\/span><span><\/span><span><\/span><\/button>\r\n      <\/div>\r\n    <\/nav>\r\n  <\/header>\r\n\r\n  <main>\r\n    <!-- ============ HERO ============ -->\r\n    <section id=\"klimat-start\" class=\"k-hero\">\r\n      <div class=\"k-hero-bg\"><\/div>\r\n      <div class=\"k-hero-shape s1\"><\/div>\r\n      <div class=\"k-hero-shape s2\"><\/div>\r\n      <div class=\"k-hero-shape s3\"><\/div>\r\n\r\n      <div class=\"k-hero-content k-reveal k-up\">\r\n        <span class=\"k-hero-eyebrow\"><span class=\"k-dot\"><\/span> Gniew i okolice \u00b7 dost\u0119pni 24h<\/span>\r\n        <h1>Profesjonalna <span>klimatyzacja<\/span> dla domu i firmy<\/h1>\r\n        <p class=\"k-lead\">\r\n          <b>Sprzeda\u017c \u2022 Monta\u017c \u2022 Serwis klimatyzacji<\/b><br>\r\n          Dzia\u0142amy na terenie Gniewa i okolic \u2014 szybko, solidnie i z gwarancj\u0105 na wykonane us\u0142ugi.\r\n        <\/p>\r\n        <div class=\"k-hero-actions\">\r\n          <a href=\"tel:789153062\" class=\"k-btn k-btn-accent\" data-ripple>\r\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z\"\/><\/svg>\r\n            Zadzwo\u0144\r\n          <\/a>\r\n          <a href=\"#klimat-kontakt\" class=\"k-btn k-btn-outline\" data-ripple>\r\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M4 4h16v16H4z\" opacity=\"0\"\/><path d=\"M22 6l-10 7L2 6\"\/><rect x=\"2\" y=\"4\" width=\"20\" height=\"16\" rx=\"2\"\/><\/svg>\r\n            Wy\u015blij wiadomo\u015b\u0107\r\n          <\/a>\r\n        <\/div>\r\n\r\n        <div class=\"k-hero-stats\">\r\n          <div class=\"k-stat\">\r\n            <div class=\"k-stat-num\"><span class=\"k-count\" data-target=\"500\">0<\/span><small>+<\/small><\/div>\r\n            <div class=\"k-stat-label\">Monta\u017cy<\/div>\r\n          <\/div>\r\n          <div class=\"k-stat\">\r\n            <div class=\"k-stat-num\"><span class=\"k-count\" data-target=\"5\">0<\/span><small>\u2605<\/small><\/div>\r\n            <div class=\"k-stat-label\">Opinie klient\u00f3w<\/div>\r\n          <\/div>\r\n          <div class=\"k-stat\">\r\n            <div class=\"k-stat-num\">24<small>h<\/small><\/div>\r\n            <div class=\"k-stat-label\">Szybki kontakt<\/div>\r\n          <\/div>\r\n        <\/div>\r\n      <\/div>\r\n\r\n      <div class=\"k-hero-card-wrap k-reveal k-right\">\r\n        <div class=\"k-hero-card\">\r\n          <span class=\"k-hero-card-fan\">\r\n            <svg viewBox=\"0 0 48 48\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n              <path d=\"M24 24C24 24 22 12 14 12C10 12 8 15 8 18C8 22 14 24 24 24Z\" fill=\"#fff\" opacity=\".9\"\/>\r\n              <path d=\"M24 24C24 24 36 22 36 14C36 10 33 8 30 8C26 8 24 14 24 24Z\" fill=\"#fff\" opacity=\".7\"\/>\r\n              <path d=\"M24 24C24 24 26 36 34 36C38 36 40 33 40 30C40 26 34 24 24 24Z\" fill=\"#fff\" opacity=\".9\"\/>\r\n              <path d=\"M24 24C24 24 12 26 12 34C12 38 15 40 18 40C22 40 24 34 24 24Z\" fill=\"#fff\" opacity=\".7\"\/>\r\n              <circle cx=\"24\" cy=\"24\" r=\"4.5\" fill=\"#fff\"\/>\r\n            <\/svg>\r\n          <\/span>\r\n          <h3>Kompleksowa obs\u0142uga<\/h3>\r\n          <p>Od doboru urz\u0105dzenia po serwis gwarancyjny i pogwarancyjny.<\/p>\r\n          <ul class=\"k-hero-card-list\">\r\n            <li><span class=\"k-check\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#fff\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"\/><\/svg><\/span> Monta\u017c<\/li>\r\n            <li><span class=\"k-check\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#fff\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"\/><\/svg><\/span> Serwis<\/li>\r\n            <li><span class=\"k-check\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#fff\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"\/><\/svg><\/span> Sprzeda\u017c<\/li>\r\n            <li><span class=\"k-check\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"#fff\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\"\/><\/svg><\/span> Ch\u0142odnictwo<\/li>\r\n          <\/ul>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- ============ OFERTA ============ -->\r\n    <section id=\"klimat-oferta\">\r\n      <div class=\"k-section-head k-reveal k-up\">\r\n        <span class=\"k-eyebrow\">Nasza oferta<\/span>\r\n        <h2 class=\"k-section-title\">Wszystko, czego potrzebujesz w jednym miejscu<\/h2>\r\n        <p class=\"k-section-sub\">Kompleksowe us\u0142ugi klimatyzacyjne i ch\u0142odnicze \u2014 od doboru urz\u0105dzenia po serwis.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"k-offer-grid\">\r\n        <article class=\"k-offer-card k-reveal k-up\">\r\n          <div class=\"k-offer-icon\">\r\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"2\" y=\"7\" width=\"20\" height=\"14\" rx=\"2\"\/><path d=\"M16 7V5a4 4 0 0 0-8 0v2\"\/><\/svg>\r\n          <\/div>\r\n          <h3>Sprzeda\u017c klimatyzacji<\/h3>\r\n          <p>Dobierzemy urz\u0105dzenie idealnie dopasowane do wielko\u015bci i charakteru pomieszczenia.<\/p>\r\n        <\/article>\r\n\r\n        <article class=\"k-offer-card k-reveal k-up\" style=\"transition-delay:.08s\">\r\n          <div class=\"k-offer-icon\">\r\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z\"\/><\/svg>\r\n          <\/div>\r\n          <h3>Profesjonalny monta\u017c<\/h3>\r\n          <p>Szybka i staranna instalacja zgodna ze sztuk\u0105, z pe\u0142nym uruchomieniem i testami.<\/p>\r\n        <\/article>\r\n\r\n        <article class=\"k-offer-card k-reveal k-up\" style=\"transition-delay:.16s\">\r\n          <div class=\"k-offer-icon\">\r\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"12\" cy=\"12\" r=\"3\"\/><path d=\"M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-4 0v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1 0-4h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 4 0v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z\"\/><\/svg>\r\n          <\/div>\r\n          <h3>Serwis i konserwacja<\/h3>\r\n          <p>Regularne przegl\u0105dy, czyszczenie i naprawy przed\u0142u\u017caj\u0105 \u017cywotno\u015b\u0107 urz\u0105dzenia.<\/p>\r\n        <\/article>\r\n\r\n        <article class=\"k-offer-card k-reveal k-up\" style=\"transition-delay:.24s\">\r\n          <div class=\"k-offer-icon\">\r\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 2v20M2 12h20M4.93 4.93l14.14 14.14M19.07 4.93 4.93 19.07\"\/><\/svg>\r\n          <\/div>\r\n          <h3>Ch\u0142odnictwo<\/h3>\r\n          <p>Instalacje i serwis urz\u0105dze\u0144 ch\u0142odniczych dla gastronomii, sklep\u00f3w i magazyn\u00f3w.<\/p>\r\n        <\/article>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- ============ DLACZEGO MY ============ -->\r\n    <section id=\"klimat-dlaczego\" class=\"k-why\">\r\n      <div class=\"k-section-head k-reveal k-up\">\r\n        <span class=\"k-eyebrow\">Dlaczego warto<\/span>\r\n        <h2 class=\"k-section-title\">Dlaczego warto nas wybra\u0107?<\/h2>\r\n        <p class=\"k-section-sub\">Sze\u015b\u0107 powod\u00f3w, dla kt\u00f3rych klienci wracaj\u0105 do nas przy kolejnych realizacjach.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"k-why-grid\">\r\n        <div class=\"k-why-tile k-reveal k-up\">\r\n          <div class=\"k-why-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 20V10M18 20V4M6 20v-4\"\/><\/svg><\/div>\r\n          <div><h3>Do\u015bwiadczenie<\/h3><p>Setki zrealizowanych monta\u017cy w domach i firmach.<\/p><\/div>\r\n        <\/div>\r\n        <div class=\"k-why-tile k-reveal k-up\" style=\"transition-delay:.06s\">\r\n          <div class=\"k-why-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><circle cx=\"12\" cy=\"12\" r=\"10\"\/><polyline points=\"12 6 12 12 16 14\"\/><\/svg><\/div>\r\n          <div><h3>Terminowo\u015b\u0107<\/h3><p>Um\u00f3wiony termin to termin, na kt\u00f3rym mo\u017cesz polega\u0107.<\/p><\/div>\r\n        <\/div>\r\n        <div class=\"k-why-tile k-reveal k-up\" style=\"transition-delay:.12s\">\r\n          <div class=\"k-why-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z\"\/><\/svg><\/div>\r\n          <div><h3>Gwarancja<\/h3><p>Pe\u0142na gwarancja na sprz\u0119t oraz wykonane us\u0142ugi monta\u017cowe.<\/p><\/div>\r\n        <\/div>\r\n        <div class=\"k-why-tile k-reveal k-up\" style=\"transition-delay:.18s\">\r\n          <div class=\"k-why-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z\"\/><\/svg><\/div>\r\n          <div><h3>Profesjonalny sprz\u0119t<\/h3><p>Sprawdzone, markowe urz\u0105dzenia i narz\u0119dzia monta\u017cowe.<\/p><\/div>\r\n        <\/div>\r\n        <div class=\"k-why-tile k-reveal k-up\" style=\"transition-delay:.24s\">\r\n          <div class=\"k-why-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z\"\/><\/svg><\/div>\r\n          <div><h3>Szybki kontakt<\/h3><p>Odpowiadamy szybko telefonicznie i mailowo, bez zb\u0119dnej zw\u0142oki.<\/p><\/div>\r\n        <\/div>\r\n        <div class=\"k-why-tile k-reveal k-up\" style=\"transition-delay:.3s\">\r\n          <div class=\"k-why-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M9 11l3 3L22 4\"\/><path d=\"M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11\"\/><\/svg><\/div>\r\n          <div><h3>Indywidualna wycena<\/h3><p>Bezp\u0142atna wycena dopasowana do Twoich realnych potrzeb.<\/p><\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- ============ WSP\u00d3\u0141PRACA ============ -->\r\n    <section id=\"klimat-wspolpraca\">\r\n      <div class=\"k-section-head k-reveal k-up\">\r\n        <span class=\"k-eyebrow\">Proces<\/span>\r\n        <h2 class=\"k-section-title\">Jak wygl\u0105da wsp\u00f3\u0142praca?<\/h2>\r\n        <p class=\"k-section-sub\">Cztery proste kroki od pierwszego kontaktu do gotowej, serwisowanej instalacji.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"k-timeline\">\r\n        <div class=\"k-tl-step k-reveal k-scale\">\r\n          <div class=\"k-tl-num\">1<\/div>\r\n          <h3>Kontakt<\/h3>\r\n          <p>Dzwonisz lub piszesz \u2014 ustalamy szczeg\u00f3\u0142y i termin wizyty.<\/p>\r\n        <\/div>\r\n        <div class=\"k-tl-step k-reveal k-scale\" style=\"transition-delay:.1s\">\r\n          <div class=\"k-tl-num\">2<\/div>\r\n          <h3>Darmowa wycena<\/h3>\r\n          <p>Ogl\u0105damy miejsce monta\u017cu i przygotowujemy bezp\u0142atn\u0105 wycen\u0119.<\/p>\r\n        <\/div>\r\n        <div class=\"k-tl-step k-reveal k-scale\" style=\"transition-delay:.2s\">\r\n          <div class=\"k-tl-num\">3<\/div>\r\n          <h3>Monta\u017c<\/h3>\r\n          <p>Instalujemy urz\u0105dzenie sprawnie, czysto i zgodnie z terminem.<\/p>\r\n        <\/div>\r\n        <div class=\"k-tl-step k-reveal k-scale\" style=\"transition-delay:.3s\">\r\n          <div class=\"k-tl-num\">4<\/div>\r\n          <h3>Serwis<\/h3>\r\n          <p>Zapewniamy opiek\u0119 gwarancyjn\u0105 i pogwarancyjn\u0105 na lata.<\/p>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- ============ REALIZACJE ============ -->\r\n    <section id=\"klimat-realizacje\">\r\n      <div class=\"k-section-head k-reveal k-up\">\r\n        <span class=\"k-eyebrow\">Portfolio<\/span>\r\n        <h2 class=\"k-section-title\">Nasze realizacje<\/h2>\r\n        <p class=\"k-section-sub\">Wybrane monta\u017ce klimatyzacji i instalacji ch\u0142odniczych w Gniewie i okolicach.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"k-gallery\">\r\n        <div class=\"k-gallery-item k-reveal k-scale\">\r\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\"><rect x=\"2\" y=\"7\" width=\"20\" height=\"14\" rx=\"2\"\/><path d=\"M16 7V5a4 4 0 0 0-8 0v2\"\/><\/svg>\r\n          <span class=\"k-gallery-cap\">Monta\u017c w domu jednorodzinnym<\/span>\r\n        <\/div>\r\n        <div class=\"k-gallery-item k-reveal k-scale\" style=\"transition-delay:.08s\">\r\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\"><path d=\"M3 21h18M5 21V7l7-4 7 4v14M9 9h1M9 13h1M14 9h1M14 13h1\"\/><\/svg>\r\n          <span class=\"k-gallery-cap\">Instalacja biurowa<\/span>\r\n        <\/div>\r\n        <div class=\"k-gallery-item k-reveal k-scale\" style=\"transition-delay:.16s\">\r\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.5\"><path d=\"M12 2v20M2 12h20M4.93 4.93l14.14 14.14M19.07 4.93 4.93 19.07\"\/><\/svg>\r\n          <span class=\"k-gallery-cap\">Ch\u0142odnictwo gastronomiczne<\/span>\r\n        <\/div>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- ============ CTA ============ -->\r\n    <section>\r\n      <div class=\"k-cta k-reveal k-scale\">\r\n        <div class=\"k-cta-fan\">\r\n          <svg viewBox=\"0 0 48 48\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n            <path d=\"M24 24C24 24 22 12 14 12C10 12 8 15 8 18C8 22 14 24 24 24Z\" fill=\"#fff\"\/>\r\n            <path d=\"M24 24C24 24 36 22 36 14C36 10 33 8 30 8C26 8 24 14 24 24Z\" fill=\"#fff\"\/>\r\n            <path d=\"M24 24C24 24 26 36 34 36C38 36 40 33 40 30C40 26 34 24 24 24Z\" fill=\"#fff\"\/>\r\n            <path d=\"M24 24C24 24 12 26 12 34C12 38 15 40 18 40C22 40 24 34 24 24Z\" fill=\"#fff\"\/>\r\n          <\/svg>\r\n        <\/div>\r\n        <h2>Potrzebujesz klimatyzacji?<\/h2>\r\n        <p>Skontaktuj si\u0119 z nami ju\u017c dzi\u015b \u2014 doradzimy i wycenimy monta\u017c bezp\u0142atnie.<\/p>\r\n        <a href=\"tel:789153062\" class=\"k-btn k-btn-accent\" data-ripple>\r\n          <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z\"\/><\/svg>\r\n          Zadzwo\u0144 teraz\r\n        <\/a>\r\n      <\/div>\r\n    <\/section>\r\n\r\n    <!-- ============ KONTAKT ============ -->\r\n    <section id=\"klimat-kontakt\">\r\n      <div class=\"k-section-head k-reveal k-up\">\r\n        <span class=\"k-eyebrow\">Kontakt<\/span>\r\n        <h2 class=\"k-section-title\">Porozmawiajmy o Twojej klimatyzacji<\/h2>\r\n        <p class=\"k-section-sub\">Zadzwo\u0144, napisz lub wype\u0142nij formularz \u2014 odezwiemy si\u0119 najszybciej jak to mo\u017cliwe.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"k-contact\">\r\n        <div class=\"k-contact-info-card k-reveal k-left\">\r\n          <h3>KLI-MAT<\/h3>\r\n          <p>Klimatyzacja i ch\u0142odnictwo \u2014 sprzeda\u017c, monta\u017c i serwis w Gniewie i okolicach.<\/p>\r\n\r\n          <div class=\"k-contact-row\">\r\n            <div class=\"k-contact-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z\"\/><\/svg><\/div>\r\n            <div><a href=\"tel:789153062\">789 153 062<\/a><small>Zadzwo\u0144 bezpo\u015brednio<\/small><\/div>\r\n          <\/div>\r\n          <div class=\"k-contact-row\">\r\n            <div class=\"k-contact-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M22 6l-10 7L2 6\"\/><rect x=\"2\" y=\"4\" width=\"20\" height=\"16\" rx=\"2\"\/><\/svg><\/div>\r\n            <div><a href=\"mailto:kli-mat@op.pl\">kli-mat@op.pl<\/a><small>Napisz do nas<\/small><\/div>\r\n          <\/div>\r\n          <div class=\"k-contact-row\">\r\n            <div class=\"k-contact-icon\"><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z\"\/><circle cx=\"12\" cy=\"10\" r=\"3\"\/><\/svg><\/div>\r\n            <div><span>Gniew, 83-140<\/span><small>Polska<\/small><\/div>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <form class=\"k-form\" id=\"klimatForm\">\r\n          <div id=\"klimatFormFields\">\r\n            <div class=\"k-form-row\">\r\n              <div class=\"k-field\">\r\n                <label for=\"klimatName\">Imi\u0119<\/label>\r\n                <input type=\"text\" id=\"klimatName\" name=\"imie\" placeholder=\"Twoje imi\u0119\" required>\r\n              <\/div>\r\n              <div class=\"k-field\">\r\n                <label for=\"klimatPhone\">Telefon<\/label>\r\n                <input type=\"tel\" id=\"klimatPhone\" name=\"telefon\" placeholder=\"Numer telefonu\" required>\r\n              <\/div>\r\n            <\/div>\r\n            <div class=\"k-field\">\r\n              <label for=\"klimatEmail\">Email<\/label>\r\n              <input type=\"email\" id=\"klimatEmail\" name=\"email\" placeholder=\"adres@email.pl\" required>\r\n            <\/div>\r\n            <div class=\"k-field\">\r\n              <label for=\"klimatMessage\">Wiadomo\u015b\u0107<\/label>\r\n              <textarea id=\"klimatMessage\" name=\"wiadomosc\" placeholder=\"Opisz kr\u00f3tko, czego potrzebujesz...\" required><\/textarea>\r\n            <\/div>\r\n            <button type=\"submit\" class=\"k-btn k-btn-primary k-form-submit\" data-ripple>Wy\u015blij<\/button>\r\n            <p class=\"k-form-note\">Wysy\u0142aj\u0105c formularz zgadzasz si\u0119 na kontakt w sprawie zapytania.<\/p>\r\n          <\/div>\r\n\r\n          <div class=\"k-form-success\" id=\"klimatFormSuccess\">\r\n            <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M22 11.08V12a10 10 0 1 1-5.93-9.14\"\/><polyline points=\"22 4 12 14.01 9 11.01\"\/><\/svg>\r\n            <h4>Dzi\u0119kujemy!<\/h4>\r\n            <p>Twoja wiadomo\u015b\u0107 zosta\u0142a wys\u0142ana. Odezwiemy si\u0119 najszybciej jak to mo\u017cliwe.<\/p>\r\n          <\/div>\r\n        <\/form>\r\n      <\/div>\r\n    <\/section>\r\n  <\/main>\r\n\r\n  <!-- ============ STOPKA ============ -->\r\n  <footer class=\"k-footer\">\r\n    <div class=\"k-footer-grid\">\r\n      <div>\r\n        <div class=\"k-footer-logo\">\r\n          <span class=\"k-logo-fan\">\r\n            <svg viewBox=\"0 0 48 48\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n              <path d=\"M24 24C24 24 22 12 14 12C10 12 8 15 8 18C8 22 14 24 24 24Z\" fill=\"#11B5E4\"\/>\r\n              <path d=\"M24 24C24 24 36 22 36 14C36 10 33 8 30 8C26 8 24 14 24 24Z\" fill=\"#4FD4F5\"\/>\r\n              <path d=\"M24 24C24 24 26 36 34 36C38 36 40 33 40 30C40 26 34 24 24 24Z\" fill=\"#11B5E4\"\/>\r\n              <path d=\"M24 24C24 24 12 26 12 34C12 38 15 40 18 40C22 40 24 34 24 24Z\" fill=\"#4FD4F5\"\/>\r\n              <circle cx=\"24\" cy=\"24\" r=\"4.5\" fill=\"#fff\"\/>\r\n            <\/svg>\r\n          <\/span>\r\n          KLI-MAT\r\n        <\/div>\r\n        <p>Profesjonalna sprzeda\u017c, monta\u017c i serwis klimatyzacji oraz us\u0142ugi ch\u0142odnicze na terenie Gniewa i okolic.<\/p>\r\n      <\/div>\r\n\r\n      <div>\r\n        <h4>Nawigacja<\/h4>\r\n        <ul class=\"k-footer-links\">\r\n          <li><a href=\"#klimat-start\">Start<\/a><\/li>\r\n          <li><a href=\"#klimat-oferta\">Oferta<\/a><\/li>\r\n          <li><a href=\"#klimat-dlaczego\">Dlaczego My<\/a><\/li>\r\n          <li><a href=\"#klimat-realizacje\">Realizacje<\/a><\/li>\r\n          <li><a href=\"#klimat-kontakt\">Kontakt<\/a><\/li>\r\n        <\/ul>\r\n      <\/div>\r\n\r\n      <div>\r\n        <h4>Kontakt<\/h4>\r\n        <ul class=\"k-footer-contact\">\r\n          <li><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z\"\/><\/svg> <a href=\"tel:789153062\">789 153 062<\/a><\/li>\r\n          <li><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M22 6l-10 7L2 6\"\/><rect x=\"2\" y=\"4\" width=\"20\" height=\"16\" rx=\"2\"\/><\/svg> <a href=\"mailto:kli-mat@op.pl\">kli-mat@op.pl<\/a><\/li>\r\n          <li><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z\"\/><circle cx=\"12\" cy=\"10\" r=\"3\"\/><\/svg> Gniew, 83-140<\/li>\r\n        <\/ul>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <div class=\"k-footer-bottom\">\r\n      <span>&copy; <span id=\"klimatYear\"><\/span> KLI-MAT \u2014 Klimatyzacja i Ch\u0142odnictwo. Wszelkie prawa zastrze\u017cone.<\/span>\r\n      <span>Gniew, Polska<\/span>\r\n    <\/div>\r\n  <\/footer>\r\n\r\n  <!-- ============ STICKY MOBILE CTA ============ -->\r\n  <div class=\"k-mobile-cta\">\r\n    <a href=\"tel:789153062\" class=\"k-btn k-btn-accent\" data-ripple>\r\n      <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.127.96.361 1.903.7 2.81a2 2 0 0 1-.45 2.11L8.09 9.91a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.907.339 1.85.573 2.81.7A2 2 0 0 1 22 16.92z\"\/><\/svg>\r\n      789 153 062\r\n    <\/a>\r\n  <\/div>\r\n\r\n  <!-- ============ BACK TO TOP ============ -->\r\n  <button class=\"k-totop\" id=\"klimatToTop\" aria-label=\"Powr\u00f3t do g\u00f3ry\">\r\n    <svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.4\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><line x1=\"12\" y1=\"19\" x2=\"12\" y2=\"5\"\/><polyline points=\"5 12 12 5 19 12\"\/><\/svg>\r\n  <\/button>\r\n<\/div>\r\n\r\n<script>\r\n(function(){\r\n  \"use strict\";\r\n  var root = document.getElementById('klimatRoot');\r\n  if(!root) return;\r\n\r\n  \/* ---------- ROK W STOPCE ---------- *\/\r\n  var yearEl = document.getElementById('klimatYear');\r\n  if(yearEl) yearEl.textContent = new Date().getFullYear();\r\n\r\n  \/* ---------- STICKY NAV: cie\u0144 po scrollu ---------- *\/\r\n  var nav = document.getElementById('klimatNav');\r\n  function onScrollNav(){\r\n    if(window.scrollY > 12){ nav.classList.add('k-scrolled'); }\r\n    else{ nav.classList.remove('k-scrolled'); }\r\n  }\r\n  window.addEventListener('scroll', onScrollNav, {passive:true});\r\n  onScrollNav();\r\n\r\n  \/* ---------- MENU MOBILNE ---------- *\/\r\n  var burger = document.getElementById('klimatBurger');\r\n  var navLinks = document.getElementById('klimatNavLinks');\r\n  if(burger && navLinks){\r\n    burger.addEventListener('click', function(){\r\n      burger.classList.toggle('open');\r\n      navLinks.classList.toggle('k-open');\r\n    });\r\n    navLinks.querySelectorAll('a').forEach(function(a){\r\n      a.addEventListener('click', function(){\r\n        burger.classList.remove('open');\r\n        navLinks.classList.remove('k-open');\r\n      });\r\n    });\r\n  }\r\n\r\n  \/* ---------- P\u0141YNNY SCROLL DO SEKCJI ---------- *\/\r\n  root.querySelectorAll('a[href^=\"#klimat-\"]').forEach(function(link){\r\n    link.addEventListener('click', function(e){\r\n      var id = this.getAttribute('href');\r\n      var target = document.querySelector(id);\r\n      if(target){\r\n        e.preventDefault();\r\n        var offset = 74;\r\n        var top = target.getBoundingClientRect().top + window.pageYOffset - offset;\r\n        window.scrollTo({ top: top, behavior:'smooth' });\r\n      }\r\n    });\r\n  });\r\n\r\n  \/* ---------- SCROLL REVEAL (Intersection Observer) ---------- *\/\r\n  var revealEls = root.querySelectorAll('.k-reveal');\r\n  if('IntersectionObserver' in window){\r\n    var io = new IntersectionObserver(function(entries){\r\n      entries.forEach(function(entry){\r\n        if(entry.isIntersecting){\r\n          entry.target.classList.add('k-visible');\r\n          io.unobserve(entry.target);\r\n        }\r\n      });\r\n    }, { threshold:0.15, rootMargin:'0px 0px -60px 0px' });\r\n    revealEls.forEach(function(el){ io.observe(el); });\r\n  } else {\r\n    revealEls.forEach(function(el){ el.classList.add('k-visible'); });\r\n  }\r\n\r\n  \/* ---------- ANIMOWANE LICZNIKI ---------- *\/\r\n  var counters = root.querySelectorAll('.k-count');\r\n  var countersDone = false;\r\n  function animateCounters(){\r\n    if(countersDone) return;\r\n    countersDone = true;\r\n    counters.forEach(function(el){\r\n      var target = parseInt(el.getAttribute('data-target'), 10) || 0;\r\n      var duration = 1400;\r\n      var startTime = null;\r\n      function step(ts){\r\n        if(!startTime) startTime = ts;\r\n        var progress = Math.min((ts - startTime) \/ duration, 1);\r\n        var eased = 1 - Math.pow(1 - progress, 3);\r\n        el.textContent = Math.floor(eased * target);\r\n        if(progress < 1){ requestAnimationFrame(step); }\r\n        else{ el.textContent = target; }\r\n      }\r\n      requestAnimationFrame(step);\r\n    });\r\n  }\r\n  var statBlock = root.querySelector('.k-hero-stats');\r\n  if(statBlock && 'IntersectionObserver' in window){\r\n    var statObserver = new IntersectionObserver(function(entries){\r\n      entries.forEach(function(entry){\r\n        if(entry.isIntersecting){ animateCounters(); statObserver.disconnect(); }\r\n      });\r\n    }, { threshold:0.4 });\r\n    statObserver.observe(statBlock);\r\n  } else {\r\n    animateCounters();\r\n  }\r\n\r\n  \/* ---------- EFEKT RIPPLE NA PRZYCISKACH ---------- *\/\r\n  root.querySelectorAll('[data-ripple]').forEach(function(btn){\r\n    btn.addEventListener('click', function(e){\r\n      var rect = btn.getBoundingClientRect();\r\n      var ripple = document.createElement('span');\r\n      var size = Math.max(rect.width, rect.height);\r\n      ripple.className = 'k-ripple';\r\n      ripple.style.width = ripple.style.height = size + 'px';\r\n      ripple.style.left = (e.clientX - rect.left - size\/2) + 'px';\r\n      ripple.style.top = (e.clientY - rect.top - size\/2) + 'px';\r\n      btn.appendChild(ripple);\r\n      setTimeout(function(){ ripple.remove(); }, 650);\r\n    });\r\n  });\r\n\r\n  \/* ---------- PRZYCISK \"POWR\u00d3T DO G\u00d3RY\" ---------- *\/\r\n  var toTop = document.getElementById('klimatToTop');\r\n  if(toTop){\r\n    window.addEventListener('scroll', function(){\r\n      if(window.scrollY > 500){ toTop.classList.add('k-show'); }\r\n      else{ toTop.classList.remove('k-show'); }\r\n    }, {passive:true});\r\n    toTop.addEventListener('click', function(){\r\n      window.scrollTo({ top:0, behavior:'smooth' });\r\n    });\r\n  }\r\n\r\n  \/* ---------- FORMULARZ KONTAKTOWY (walidacja + potwierdzenie) ---------- *\/\r\n  var form = document.getElementById('klimatForm');\r\n  if(form){\r\n    form.addEventListener('submit', function(e){\r\n      e.preventDefault();\r\n      var fields = document.getElementById('klimatFormFields');\r\n      var success = document.getElementById('klimatFormSuccess');\r\n      if(fields && success){\r\n        fields.style.display = 'none';\r\n        success.classList.add('k-show');\r\n      }\r\n      \/\/ Uwaga: pod\u0142\u0105cz tutaj docelow\u0105 akcj\u0119 wysy\u0142ki (np. fetch do endpointu \/\r\n      \/\/ integracj\u0119 z Elementor Pro Forms \/ zewn\u0119trznym API), je\u015bli jest wymagana.\r\n    });\r\n  }\r\n\r\n  \/* ---------- ANIMOWANE T\u0141O: PADAJ\u0104CE P\u0141ATKI \u015aNIEGU ---------- *\/\r\n  var canvas = document.getElementById('klimat-snow-canvas');\r\n  if(canvas && canvas.getContext){\r\n    var ctx = canvas.getContext('2d');\r\n    var flakes = [];\r\n    var flakeCount = window.innerWidth < 700 ? 26 : 46;\r\n    var w, h;\r\n\r\n    function resize(){\r\n      w = canvas.width = window.innerWidth;\r\n      h = canvas.height = window.innerHeight;\r\n    }\r\n    window.addEventListener('resize', resize, {passive:true});\r\n    resize();\r\n\r\n    function makeFlake(){\r\n      return {\r\n        x: Math.random() * w,\r\n        y: Math.random() * h,\r\n        r: 1 + Math.random() * 2.6,\r\n        speedY: 0.25 + Math.random() * 0.6,\r\n        speedX: (Math.random() - 0.5) * 0.4,\r\n        rotation: Math.random() * Math.PI * 2,\r\n        rotSpeed: (Math.random() - 0.5) * 0.01,\r\n        opacity: 0.25 + Math.random() * 0.45\r\n      };\r\n    }\r\n    for(var i=0;i<flakeCount;i++){ flakes.push(makeFlake()); }\r\n\r\n    function drawSnowflake(f){\r\n      ctx.save();\r\n      ctx.translate(f.x, f.y);\r\n      ctx.rotate(f.rotation);\r\n      ctx.globalAlpha = f.opacity;\r\n      ctx.fillStyle = '#11B5E4';\r\n      ctx.beginPath();\r\n      ctx.arc(0, 0, f.r, 0, Math.PI*2);\r\n      ctx.fill();\r\n      ctx.restore();\r\n    }\r\n\r\n    var lastTime = 0;\r\n    function loop(ts){\r\n      if(ts - lastTime < 33){ requestAnimationFrame(loop); return; } \/\/ ~30fps, lekko dla wydajno\u015bci\r\n      lastTime = ts;\r\n      ctx.clearRect(0,0,w,h);\r\n      for(var i=0;i<flakes.length;i++){\r\n        var f = flakes[i];\r\n        f.y += f.speedY;\r\n        f.x += f.speedX;\r\n        f.rotation += f.rotSpeed;\r\n        if(f.y > h + 10){ f.y = -10; f.x = Math.random() * w; }\r\n        if(f.x > w + 10) f.x = -10;\r\n        if(f.x < -10) f.x = w + 10;\r\n        drawSnowflake(f);\r\n      }\r\n      requestAnimationFrame(loop);\r\n    }\r\n    requestAnimationFrame(loop);\r\n  }\r\n\r\n})();\r\n<\/script>\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>KLI-MAT Klimatyzacja i ch\u0142odnictwo Start Oferta Dlaczego My Realizacje Kontakt Zadzwo\u0144 Gniew i okolice \u00b7 dost\u0119pni 24h Profesjonalna klimatyzacja dla domu i firmy Sprzeda\u017c \u2022 Monta\u017c \u2022 Serwis klimatyzacji Dzia\u0142amy na terenie Gniewa i okolic \u2014 szybko, solidnie i z gwarancj\u0105 na wykonane us\u0142ugi. Zadzwo\u0144 Wy\u015blij wiadomo\u015b\u0107 0+ Monta\u017cy 0\u2605 Opinie klient\u00f3w 24h Szybki kontakt [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-8","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/kli-mat.eu\/index.php?rest_route=\/wp\/v2\/pages\/8","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kli-mat.eu\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/kli-mat.eu\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/kli-mat.eu\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/kli-mat.eu\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=8"}],"version-history":[{"count":4,"href":"https:\/\/kli-mat.eu\/index.php?rest_route=\/wp\/v2\/pages\/8\/revisions"}],"predecessor-version":[{"id":14,"href":"https:\/\/kli-mat.eu\/index.php?rest_route=\/wp\/v2\/pages\/8\/revisions\/14"}],"wp:attachment":[{"href":"https:\/\/kli-mat.eu\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=8"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}