{"id":10,"date":"2026-05-06T09:04:48","date_gmt":"2026-05-06T09:04:48","guid":{"rendered":"https:\/\/ogarnji.pl\/?page_id=10"},"modified":"2026-06-09T14:54:50","modified_gmt":"2026-06-09T14:54:50","slug":"elementor-10","status":"publish","type":"page","link":"https:\/\/ogarnji.pl\/","title":{"rendered":"Elementor #10"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"10\" class=\"elementor elementor-10\">\n\t\t\t\t<div class=\"elementor-element elementor-element-11adb76 e-con-full e-flex e-con e-parent\" data-id=\"11adb76\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-08c1f06 elementor-widget elementor-widget-html\" data-id=\"08c1f06\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!DOCTYPE html>\r\n<html lang=\"pl\">\r\n<head>\r\n<meta charset=\"UTF-8\">\r\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\r\n<title>ZielonyOgr\u00f3d \u2013 Profesjonalna Piel\u0119gnacja Ogrod\u00f3w<\/title>\r\n<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\">\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Playfair+Display:wght@400;700;900&family=Inter:wght@300;400;500;600&display=swap\" rel=\"stylesheet\">\r\n<style>\r\n*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }\r\nhtml { scroll-behavior:smooth; }\r\n\r\n\/* FORCE full bleed \u2013 neutralise Elementor container padding *\/\r\nbody, .elementor-section, .elementor-container, .elementor-widget-wrap {\r\n  max-width:100% !important;\r\n  padding-left:0 !important;\r\n  padding-right:0 !important;\r\n}\r\n\r\n:root {\r\n  --gd: #1a3a2a;\r\n  --gf: #2d5a3d;\r\n  --gm: #7cb87a;\r\n  --gl: #b8d9b0;\r\n  --cr: #f7f5f0;\r\n  --ea: #c8a96e;\r\n  --ed: #8b6914;\r\n  --td: #1a1a1a;\r\n  --tm: #4a4a4a;\r\n  --wh: #ffffff;\r\n}\r\n\r\nbody { font-family:'Inter',sans-serif; background:var(--cr); color:var(--td); overflow-x:hidden; width:100%; }\r\n\r\n\/* \u2500\u2500 NAV \u2500\u2500 *\/\r\nnav {\r\n  position:fixed; top:0; left:0; right:0; z-index:200;\r\n  padding:1.1rem 2.5rem;\r\n  display:flex; align-items:center; justify-content:space-between;\r\n  transition:background .4s;\r\n}\r\nnav.scrolled { background:rgba(26,58,42,.97); backdrop-filter:blur(14px); box-shadow:0 2px 24px rgba(0,0,0,.3); }\r\n.nav-logo { font-family:'Playfair Display',serif; font-size:1.4rem; font-weight:700; color:var(--wh); text-decoration:none; }\r\n.nav-logo span { color:var(--gm); }\r\n.nav-links { display:flex; gap:2rem; list-style:none; }\r\n.nav-links a { color:rgba(255,255,255,.85); text-decoration:none; font-size:.88rem; font-weight:500; letter-spacing:.05em; text-transform:uppercase; transition:color .2s; }\r\n.nav-links a:hover { color:var(--gm); }\r\n.nav-cta { background:var(--ea) !important; color:var(--wh) !important; padding:.5rem 1.3rem; border-radius:30px; font-weight:600 !important; transition:background .2s !important; }\r\n.nav-cta:hover { background:var(--ed) !important; }\r\n.hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; background:none; border:none; padding:4px; }\r\n.hamburger span { display:block; width:26px; height:2px; background:var(--wh); border-radius:2px; transition:.3s; }\r\n\r\n\/* \u2500\u2500 HERO \u2500\u2500 *\/\r\n.hero { position:relative; width:100%; height:100vh; min-height:600px; overflow:hidden; display:flex; align-items:center; justify-content:center; }\r\n.hero-media { position:absolute; inset:-10%; z-index:0; will-change:transform; }\r\n.hero-media video { width:100%; height:100%; object-fit:cover; display:block; }\r\n.hero-overlay { position:absolute; inset:0; z-index:1; background:linear-gradient(to bottom, rgba(26,58,42,.55) 0%, rgba(26,58,42,.35) 50%, rgba(26,58,42,.78) 100%); }\r\n.hero-content { position:relative; z-index:2; text-align:center; padding:2rem; max-width:820px; }\r\n.hero-eyebrow {\r\n  display:inline-block; font-size:.78rem; font-weight:600; letter-spacing:.22em; text-transform:uppercase;\r\n  color:var(--gm); margin-bottom:1.5rem; padding:.4rem 1.2rem;\r\n  border:1px solid rgba(124,184,122,.5); border-radius:30px; backdrop-filter:blur(6px); background:rgba(124,184,122,.08);\r\n}\r\n.hero-title { font-family:'Playfair Display',serif; font-size:clamp(2.8rem,7vw,5.5rem); font-weight:900; color:var(--wh); line-height:1.08; margin-bottom:1.4rem; text-shadow:0 2px 30px rgba(0,0,0,.45); }\r\n.hero-title em { font-style:normal; color:var(--gm); }\r\n.hero-sub { font-size:1.1rem; color:rgba(255,255,255,.85); font-weight:300; line-height:1.75; max-width:520px; margin:0 auto 2.5rem; }\r\n.hero-btns { display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; }\r\n.btn-primary { background:var(--ea); color:var(--wh); padding:.9rem 2.2rem; border-radius:40px; font-weight:600; font-size:.95rem; text-decoration:none; letter-spacing:.04em; transition:all .2s; box-shadow:0 4px 20px rgba(200,169,110,.4); }\r\n.btn-primary:hover { background:var(--ed); transform:translateY(-2px); box-shadow:0 6px 28px rgba(200,169,110,.5); }\r\n.btn-outline { background:transparent; color:var(--wh); padding:.9rem 2.2rem; border-radius:40px; font-weight:500; font-size:.95rem; text-decoration:none; letter-spacing:.04em; border:1.5px solid rgba(255,255,255,.5); transition:all .2s; }\r\n.btn-outline:hover { border-color:var(--wh); background:rgba(255,255,255,.1); }\r\n.scroll-hint { position:absolute; bottom:2rem; left:50%; transform:translateX(-50%); z-index:2; display:flex; flex-direction:column; align-items:center; gap:.5rem; color:rgba(255,255,255,.6); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; }\r\n.scroll-line { width:1px; height:48px; background:linear-gradient(to bottom,rgba(255,255,255,.6),transparent); animation:sla 2s ease-in-out infinite; }\r\n@keyframes sla { 0%,100%{opacity:1;transform:scaleY(1)} 50%{opacity:.4;transform:scaleY(.6)} }\r\n\r\n\/* \u2500\u2500 STATS BAR \u2500\u2500 *\/\r\n.stats-bar { background:var(--gd); padding:2rem 2.5rem; display:flex; justify-content:center; gap:4rem; flex-wrap:wrap; width:100%; }\r\n.stat-item { text-align:center; color:var(--wh); }\r\n.stat-number { font-family:'Playfair Display',serif; font-size:2.1rem; font-weight:700; color:var(--gm); line-height:1; }\r\n.stat-label { font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color:rgba(255,255,255,.6); margin-top:.3rem; }\r\n\r\n\/* \u2500\u2500 GENERIC SECTION \u2500\u2500 *\/\r\nsection { padding:6rem 2.5rem; width:100%; }\r\n.inner { max-width:1100px; margin:0 auto; }\r\n.inner-sm { max-width:900px; margin:0 auto; }\r\n.section-tag { display:inline-block; font-size:.73rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color:var(--gf); margin-bottom:1rem; padding:.3rem 1rem; background:rgba(45,90,61,.1); border-radius:20px; }\r\n.section-title { font-family:'Playfair Display',serif; font-size:clamp(1.9rem,4vw,3rem); font-weight:700; color:var(--gd); line-height:1.2; margin-bottom:1rem; }\r\n.section-sub { font-size:1.02rem; color:var(--tm); line-height:1.8; max-width:560px; }\r\n\r\n\/* \u2500\u2500 ABOUT \u2500\u2500 *\/\r\n.about { background:var(--wh); }\r\n.about-grid { display:grid; grid-template-columns:1fr 1fr; gap:5rem; align-items:center; }\r\n.about-visual { position:relative; }\r\n.about-img { width:100%; aspect-ratio:4\/5; background:linear-gradient(135deg,#2d5a3d,#7cb87a); border-radius:4px 60px 4px 60px; display:flex; align-items:center; justify-content:center; overflow:hidden; font-size:8rem; opacity:.9; }\r\n.about-badge { position:absolute; bottom:-1.5rem; right:-1.5rem; background:var(--ea); color:var(--wh); padding:1.5rem; border-radius:50%; width:110px; height:110px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; box-shadow:0 8px 30px rgba(200,169,110,.4); }\r\n.about-badge strong { font-family:'Playfair Display',serif; font-size:1.8rem; line-height:1; }\r\n.about-badge small { font-size:.62rem; letter-spacing:.05em; text-transform:uppercase; opacity:.9; }\r\n.about-values { display:grid; grid-template-columns:1fr 1fr; gap:.9rem; margin-top:2.5rem; }\r\n.value-chip { display:flex; align-items:center; gap:.6rem; font-size:.88rem; font-weight:500; color:var(--gf); }\r\n.value-chip::before { content:'\u2713'; display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; background:rgba(124,184,122,.2); border-radius:50%; font-size:.68rem; color:var(--gf); flex-shrink:0; }\r\n\r\n\/* \u2500\u2500 SERVICES \u2500\u2500 *\/\r\n.services { background:var(--cr); }\r\n.services-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(310px,1fr)); gap:1.4rem; margin-top:3.5rem; }\r\n.service-card { background:var(--wh); border-radius:16px; overflow:hidden; cursor:pointer; transition:transform .3s,box-shadow .3s; text-decoration:none; color:inherit; display:block; border:1px solid rgba(26,58,42,.07); }\r\n.service-card:hover { transform:translateY(-6px); box-shadow:0 20px 50px rgba(26,58,42,.12); }\r\n.sc-img { height:176px; display:flex; align-items:center; justify-content:center; font-size:3.4rem; }\r\n.cg1{background:linear-gradient(135deg,#2d5a3d,#4a8a5a)} .cg2{background:linear-gradient(135deg,#4a8a5a,#7cb87a)} .cg3{background:linear-gradient(135deg,#5a7a60,#b8d9b0)} .cg4{background:linear-gradient(135deg,#6b4c2a,#c8a96e)} .cg5{background:linear-gradient(135deg,#1a3a2a,#2d5a3d)} .cg6{background:linear-gradient(135deg,#2a4a6b,#4a7a9b)}\r\n.sc-body { padding:1.4rem; }\r\n.sc-title { font-family:'Playfair Display',serif; font-size:1.18rem; font-weight:700; color:var(--gd); margin-bottom:.45rem; }\r\n.sc-desc { font-size:.86rem; color:var(--tm); line-height:1.6; margin-bottom:1.1rem; }\r\n.sc-footer { display:flex; align-items:center; justify-content:space-between; }\r\n.price-tag { font-size:1.02rem; font-weight:700; color:var(--gf); }\r\n.price-tag small { font-size:.73rem; font-weight:400; color:var(--tm); }\r\n.book-btn { background:var(--gd); color:var(--wh); padding:.48rem 1.1rem; border-radius:20px; font-size:.8rem; font-weight:600; border:none; cursor:pointer; text-decoration:none; display:inline-block; transition:background .2s; }\r\n.book-btn:hover { background:var(--gf); }\r\n\r\n\/* \u2500\u2500 MODAL \u2500\u2500 *\/\r\n.modal-overlay { position:fixed; inset:0; background:rgba(26,58,42,.72); backdrop-filter:blur(7px); z-index:500; display:flex; align-items:center; justify-content:center; padding:1rem; opacity:0; pointer-events:none; transition:opacity .3s; }\r\n.modal-overlay.active { opacity:1; pointer-events:all; }\r\n.modal { background:var(--wh); border-radius:20px; max-width:520px; width:100%; padding:2.5rem; position:relative; transform:translateY(30px); transition:transform .3s; max-height:90vh; overflow-y:auto; }\r\n.modal-overlay.active .modal { transform:translateY(0); }\r\n.modal-close { position:absolute; top:1.2rem; right:1.2rem; background:rgba(26,58,42,.08); border:none; width:32px; height:32px; border-radius:50%; cursor:pointer; font-size:1rem; display:flex; align-items:center; justify-content:center; }\r\n.modal-close:hover { background:rgba(26,58,42,.18); }\r\n.modal-icon { font-size:2.8rem; margin-bottom:.8rem; }\r\n.modal-title { font-family:'Playfair Display',serif; font-size:1.55rem; font-weight:700; color:var(--gd); margin-bottom:.4rem; }\r\n.modal-price { font-size:1.7rem; font-weight:700; color:var(--ea); margin-bottom:1rem; }\r\n.modal-desc { font-size:.93rem; color:var(--tm); line-height:1.7; margin-bottom:1.4rem; }\r\n.modal-includes { background:rgba(45,90,61,.06); border-radius:12px; padding:1.2rem; margin-bottom:1.4rem; }\r\n.modal-includes h4 { font-size:.78rem; text-transform:uppercase; letter-spacing:.1em; color:var(--gf); margin-bottom:.7rem; font-weight:600; }\r\n.modal-includes li { list-style:none; font-size:.88rem; color:var(--tm); padding:.22rem 0 .22rem 1.2rem; position:relative; }\r\n.modal-includes li::before { content:'\u2192'; position:absolute; left:0; color:var(--gm); }\r\n.modal-actions { display:flex; gap:1rem; flex-wrap:wrap; }\r\n.btn-bm { flex:1; background:var(--gd); color:var(--wh); padding:.85rem; border-radius:30px; font-weight:600; font-size:.93rem; border:none; cursor:pointer; text-align:center; text-decoration:none; display:block; min-width:130px; transition:background .2s; }\r\n.btn-bm:hover { background:var(--gf); }\r\n.btn-cm { flex:1; background:transparent; color:var(--gd); padding:.85rem; border-radius:30px; font-weight:600; font-size:.93rem; border:2px solid var(--gd); cursor:pointer; text-align:center; text-decoration:none; display:block; min-width:130px; transition:all .2s; }\r\n.btn-cm:hover { background:var(--gd); color:var(--wh); }\r\n\r\n\/* \u2500\u2500 PROCESS \u2500\u2500 *\/\r\n.process { background:var(--gd); }\r\n.process .section-title,.process .section-sub-center { color:var(--wh); }\r\n.process .section-sub-center { font-size:1rem; color:rgba(255,255,255,.7); line-height:1.8; margin:0 auto 4rem; max-width:500px; text-align:center; }\r\n.process-steps { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; position:relative; }\r\n.process-steps::before { content:''; position:absolute; top:2rem; left:12.5%; right:12.5%; height:1px; background:linear-gradient(to right,transparent,rgba(124,184,122,.45),transparent); }\r\n.process-step { position:relative; z-index:1; padding:1rem .5rem; text-align:center; }\r\n.step-num { width:4rem; height:4rem; border-radius:50%; background:rgba(124,184,122,.12); border:1.5px solid rgba(124,184,122,.4); display:flex; align-items:center; justify-content:center; font-family:'Playfair Display',serif; font-size:1.4rem; font-weight:700; color:var(--gm); margin:0 auto 1.1rem; }\r\n.step-title { font-weight:600; font-size:.93rem; margin-bottom:.45rem; color:var(--wh); }\r\n.step-desc { font-size:.8rem; color:rgba(255,255,255,.6); line-height:1.6; }\r\n\r\n\/* \u2500\u2500 CALENDAR \u2500\u2500 *\/\r\n.calendar-section { background:var(--cr); }\r\n.cal-widget { background:var(--wh); border-radius:20px; padding:2rem; box-shadow:0 8px 40px rgba(26,58,42,.1); }\r\n.cal-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:1.4rem; }\r\n.cal-nav { background:rgba(26,58,42,.08); border:none; width:36px; height:36px; border-radius:50%; cursor:pointer; font-size:1rem; display:flex; align-items:center; justify-content:center; transition:background .2s; }\r\n.cal-nav:hover { background:rgba(26,58,42,.16); }\r\n.cal-month { font-family:'Playfair Display',serif; font-size:1.25rem; font-weight:700; color:var(--gd); }\r\n.cal-grid { display:grid; grid-template-columns:repeat(7,1fr); gap:3px; margin-bottom:1.2rem; }\r\n.cal-day-name { text-align:center; font-size:.72rem; font-weight:600; color:var(--tm); text-transform:uppercase; letter-spacing:.05em; padding:.45rem 0; }\r\n.cal-day { aspect-ratio:1; display:flex; align-items:center; justify-content:center; border-radius:50%; font-size:.86rem; cursor:pointer; transition:all .15s; position:relative; border:none; background:none; color:var(--td); }\r\n.cal-day:hover:not(.disabled):not(.empty) { background:rgba(45,90,61,.1); color:var(--gf); }\r\n.cal-day.available { color:var(--gf); font-weight:500; }\r\n.cal-day.available::after { content:''; position:absolute; bottom:4px; left:50%; transform:translateX(-50%); width:4px; height:4px; border-radius:50%; background:var(--gm); }\r\n.cal-day.selected { background:var(--gd) !important; color:var(--wh) !important; font-weight:600; }\r\n.cal-day.selected::after { display:none; }\r\n.cal-day.disabled { color:rgba(0,0,0,.2); cursor:default; }\r\n.cal-day.today { border:2px solid var(--gm); color:var(--gf); font-weight:600; }\r\n\r\n\/* booking form *\/\r\n.booking-form { display:none; flex-direction:column; gap:1rem; margin-top:1rem; }\r\n.booking-form.visible { display:flex; }\r\n.cal-chosen { display:none; font-size:.9rem; font-weight:500; color:var(--gf); margin-bottom:.5rem; padding:.75rem 1rem; background:rgba(45,90,61,.08); border-radius:10px; }\r\n.cal-chosen.visible { display:block; }\r\n.form-row { display:flex; gap:1rem; flex-wrap:wrap; }\r\n.form-group { flex:1; min-width:180px; }\r\n.form-group label { display:block; font-size:.8rem; font-weight:600; color:var(--gd); margin-bottom:.38rem; letter-spacing:.04em; }\r\n.form-group input, .form-group select, .form-group textarea {\r\n  width:100%; padding:.72rem 1rem; border:1.5px solid rgba(26,58,42,.15); border-radius:10px;\r\n  font-family:'Inter',sans-serif; font-size:.88rem; color:var(--td); background:var(--cr); outline:none; transition:border-color .2s;\r\n}\r\n.form-group input:focus, .form-group select:focus, .form-group textarea:focus { border-color:var(--gf); }\r\n.time-slots { display:flex; flex-wrap:wrap; gap:.5rem; }\r\n.time-slot { padding:.4rem .9rem; border-radius:20px; font-size:.82rem; font-weight:500; border:1.5px solid rgba(26,58,42,.18); background:none; cursor:pointer; color:var(--gf); transition:all .2s; }\r\n.time-slot:hover { background:rgba(45,90,61,.08); }\r\n.time-slot.selected { background:var(--gd); color:var(--wh); border-color:var(--gd); }\r\n.time-slot.busy { opacity:.35; cursor:not-allowed; text-decoration:line-through; }\r\n.form-error { color:#c0392b; font-size:.8rem; display:none; }\r\n.form-error.visible { display:block; }\r\n.btn-submit { width:100%; background:var(--ea); color:var(--wh); padding:1rem; border-radius:30px; font-weight:600; font-size:.97rem; border:none; cursor:pointer; transition:background .2s; margin-top:.3rem; }\r\n.btn-submit:hover { background:var(--ed); }\r\n\r\n\/* \u2500\u2500 ADMIN PANEL \u2500\u2500 *\/\r\n.admin-section { background:#f0f5f2; border-top:3px solid var(--gm); }\r\n.admin-inner { max-width:900px; margin:0 auto; }\r\n.admin-header { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1rem; margin-bottom:2rem; }\r\n.admin-title { font-family:'Playfair Display',serif; font-size:1.6rem; font-weight:700; color:var(--gd); }\r\n.admin-lock { display:flex; gap:.8rem; align-items:center; flex-wrap:wrap; }\r\n.admin-pin { padding:.55rem 1rem; border:1.5px solid rgba(26,58,42,.2); border-radius:10px; font-family:'Inter',sans-serif; font-size:.88rem; width:150px; outline:none; }\r\n.btn-admin { background:var(--gd); color:var(--wh); padding:.55rem 1.3rem; border-radius:20px; font-size:.85rem; font-weight:600; border:none; cursor:pointer; transition:background .2s; }\r\n.btn-admin:hover { background:var(--gf); }\r\n.admin-body { display:none; }\r\n.admin-body.open { display:block; }\r\n.bookings-table { width:100%; border-collapse:collapse; font-size:.88rem; }\r\n.bookings-table th { text-align:left; padding:.7rem 1rem; background:var(--gd); color:var(--wh); font-size:.78rem; letter-spacing:.06em; text-transform:uppercase; }\r\n.bookings-table td { padding:.7rem 1rem; border-bottom:1px solid rgba(26,58,42,.08); vertical-align:top; }\r\n.bookings-table tr:hover td { background:rgba(45,90,61,.05); }\r\n.badge-new { background:rgba(124,184,122,.25); color:var(--gf); padding:.2rem .6rem; border-radius:10px; font-size:.75rem; font-weight:600; }\r\n.btn-del { background:none; border:1px solid #c0392b; color:#c0392b; border-radius:10px; padding:.2rem .6rem; font-size:.75rem; cursor:pointer; transition:all .2s; }\r\n.btn-del:hover { background:#c0392b; color:var(--wh); }\r\n.admin-empty { text-align:center; padding:2.5rem; color:var(--tm); font-size:.95rem; }\r\n.admin-stats { display:flex; gap:1rem; flex-wrap:wrap; margin-bottom:1.5rem; }\r\n.admin-stat { flex:1; min-width:120px; background:var(--wh); border-radius:12px; padding:1rem 1.2rem; border-left:3px solid var(--gm); }\r\n.admin-stat .n { font-family:'Playfair Display',serif; font-size:1.6rem; font-weight:700; color:var(--gd); }\r\n.admin-stat .l { font-size:.75rem; color:var(--tm); text-transform:uppercase; letter-spacing:.06em; margin-top:.2rem; }\r\n\r\n\/* \u2500\u2500 CONTACT \u2500\u2500 *\/\r\n.contact { background:var(--gf); }\r\n.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center; }\r\n.contact .section-title { color:var(--wh); }\r\n.contact .section-sub { color:rgba(255,255,255,.75); }\r\n.contact-items { margin-top:2rem; display:flex; flex-direction:column; gap:1.1rem; }\r\n.contact-item { display:flex; align-items:center; gap:1rem; color:rgba(255,255,255,.85); font-size:.93rem; }\r\n.contact-icon { width:42px; height:42px; border-radius:50%; background:rgba(255,255,255,.1); display:flex; align-items:center; justify-content:center; font-size:1.05rem; flex-shrink:0; }\r\n.cform { background:rgba(255,255,255,.08); border-radius:16px; padding:2rem; }\r\n.cform h3 { font-family:'Playfair Display',serif; font-size:1.25rem; margin-bottom:1.4rem; color:var(--wh); }\r\n.cform .form-group input, .cform .form-group textarea {\r\n  background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.2); color:var(--wh);\r\n}\r\n.cform .form-group input::placeholder, .cform .form-group textarea::placeholder { color:rgba(255,255,255,.45); }\r\n.cform .form-group label { color:rgba(255,255,255,.85); }\r\n.cform .form-group textarea { width:100%; padding:.72rem 1rem; border:1.5px solid rgba(255,255,255,.2); border-radius:10px; font-family:'Inter',sans-serif; font-size:.88rem; color:var(--wh); background:rgba(255,255,255,.1); outline:none; resize:vertical; min-height:96px; }\r\n.btn-sl { width:100%; background:var(--ea); color:var(--wh); padding:.9rem; border-radius:30px; font-weight:600; font-size:.93rem; border:none; cursor:pointer; margin-top:1rem; transition:background .2s; }\r\n.btn-sl:hover { background:var(--ed); }\r\n\r\n\/* \u2500\u2500 FOOTER \u2500\u2500 *\/\r\nfooter { background:var(--gd); color:rgba(255,255,255,.6); text-align:center; padding:2rem 2.5rem; font-size:.83rem; width:100%; }\r\nfooter strong { color:var(--gm); font-family:'Playfair Display',serif; }\r\n\r\n\/* \u2500\u2500 REVEAL ANIMATIONS \u2500\u2500 *\/\r\n.reveal { opacity:0; transform:translateY(28px); transition:opacity .7s ease,transform .7s ease; }\r\n.reveal.visible { opacity:1; transform:translateY(0); }\r\n.rd1{transition-delay:.1s} .rd2{transition-delay:.2s} .rd3{transition-delay:.3s} .rd4{transition-delay:.4s} .rd5{transition-delay:.5s}\r\n\r\n\/* \u2500\u2500 MOBILE MENU \u2500\u2500 *\/\r\n.mob-menu { display:none; position:fixed; inset:0; z-index:300; background:var(--gd); flex-direction:column; align-items:center; justify-content:center; gap:2rem; }\r\n.mob-menu.open { display:flex; }\r\n.mob-menu a { font-size:1.5rem; font-family:'Playfair Display',serif; color:var(--wh); text-decoration:none; }\r\n.mob-menu a:hover { color:var(--gm); }\r\n.mob-close { position:absolute; top:1.5rem; right:1.5rem; background:none; border:none; color:var(--wh); font-size:1.5rem; cursor:pointer; }\r\n\r\n\/* \u2500\u2500 RESPONSIVE \u2500\u2500 *\/\r\n@media(max-width:768px){\r\n  .nav-links{display:none} .hamburger{display:flex}\r\n  .about-grid{grid-template-columns:1fr;gap:3rem}\r\n  .about-visual{max-width:320px;margin:0 auto}\r\n  .process-steps{grid-template-columns:repeat(2,1fr);gap:1.4rem}\r\n  .process-steps::before{display:none}\r\n  .contact-grid{grid-template-columns:1fr;gap:2.5rem}\r\n  .stats-bar{gap:1.8rem}\r\n  section{padding:4rem 1.4rem}\r\n  .services-grid{grid-template-columns:1fr}\r\n  .modal{padding:1.8rem}\r\n  .form-row{flex-direction:column}\r\n}\r\n@media(max-width:480px){\r\n  .hero-btns{flex-direction:column;align-items:center}\r\n  .process-steps{grid-template-columns:1fr}\r\n  .about-values{grid-template-columns:1fr}\r\n  .admin-stats{flex-direction:column}\r\n  .bookings-table{font-size:.78rem}\r\n  .bookings-table td,.bookings-table th{padding:.5rem .6rem}\r\n}\r\n@media(prefers-reduced-motion:reduce){ .reveal{transition:none} .hero-media{transform:none !important} }\r\n<\/style>\r\n<\/head>\r\n<body>\r\n\r\n<!-- NAV -->\r\n<nav id=\"mainNav\">\r\n  <a href=\"#\" class=\"nav-logo\">Zielony<span>Ogr\u00f3d<\/span><\/a>\r\n  <ul class=\"nav-links\">\r\n    <li><a href=\"#o-nas\">O nas<\/a><\/li>\r\n    <li><a href=\"#uslugi\">Us\u0142ugi<\/a><\/li>\r\n    <li><a href=\"#jak-dzialamy\">Jak dzia\u0142amy<\/a><\/li>\r\n    <li><a href=\"#rezerwacja\">Rezerwacja<\/a><\/li>\r\n    <li><a href=\"#kontakt\" class=\"nav-cta\">Um\u00f3w wizyt\u0119<\/a><\/li>\r\n  <\/ul>\r\n  <button class=\"hamburger\" onclick=\"openMenu()\" aria-label=\"Menu\"><span><\/span><span><\/span><span><\/span><\/button>\r\n<\/nav>\r\n\r\n<!-- MOBILE MENU -->\r\n<div class=\"mob-menu\" id=\"mobMenu\">\r\n  <button class=\"mob-close\" onclick=\"closeMenu()\">\u2715<\/button>\r\n  <a href=\"#o-nas\" onclick=\"closeMenu()\">O nas<\/a>\r\n  <a href=\"#uslugi\" onclick=\"closeMenu()\">Us\u0142ugi<\/a>\r\n  <a href=\"#jak-dzialamy\" onclick=\"closeMenu()\">Jak dzia\u0142amy<\/a>\r\n  <a href=\"#rezerwacja\" onclick=\"closeMenu()\">Rezerwacja<\/a>\r\n  <a href=\"#kontakt\" onclick=\"closeMenu()\">Kontakt<\/a>\r\n<\/div>\r\n\r\n<!-- HERO -->\r\n<section class=\"hero\" id=\"top\">\r\n  <div class=\"hero-media\" id=\"heroMedia\">\r\n    <video autoplay muted loop playsinline\r\n      src=\"https:\/\/d8j0ntlcm91z4.cloudfront.net\/user_3DznGLHQpWiFME3K2Y8Tsa8YvdG\/hf_20260609_081514_290ae25d-4d96-429f-b36f-dd02e262dd35.mp4\">\r\n    <\/video>\r\n  <\/div>\r\n  <div class=\"hero-overlay\"><\/div>\r\n  <div class=\"hero-content\">\r\n    <div class=\"hero-eyebrow\">Profesjonalna piel\u0119gnacja ogrod\u00f3w<\/div>\r\n    <h1 class=\"hero-title\">Tw\u00f3j ogr\u00f3d<br>w <em>najlepszych<\/em><br>r\u0119kach<\/h1>\r\n    <p class=\"hero-sub\">Kompleksowa piel\u0119gnacja, projektowanie i renowacja ogrod\u00f3w. Przyje\u017cd\u017camy tam, gdzie jest Tw\u00f3j ogr\u00f3d.<\/p>\r\n    <div class=\"hero-btns\">\r\n      <a href=\"#rezerwacja\" class=\"btn-primary\">\ud83d\udcc5 Um\u00f3w termin<\/a>\r\n      <a href=\"#uslugi\" class=\"btn-outline\">Zobacz us\u0142ugi<\/a>\r\n    <\/div>\r\n  <\/div>\r\n  <div class=\"scroll-hint\"><span>Przewi\u0144<\/span><div class=\"scroll-line\"><\/div><\/div>\r\n<\/section>\r\n\r\n<!-- STATS -->\r\n<div class=\"stats-bar\">\r\n  <div class=\"stat-item reveal\"><div class=\"stat-number\">150+<\/div><div class=\"stat-label\">Zadowolonych klient\u00f3w<\/div><\/div>\r\n  <div class=\"stat-item reveal rd1\"><div class=\"stat-number\">8<\/div><div class=\"stat-label\">Us\u0142ug w ofercie<\/div><\/div>\r\n  <div class=\"stat-item reveal rd2\"><div class=\"stat-number\">5\u2605<\/div><div class=\"stat-label\">\u015arednia ocena<\/div><\/div>\r\n  <div class=\"stat-item reveal rd3\"><div class=\"stat-number\">24h<\/div><div class=\"stat-label\">Czas odpowiedzi<\/div><\/div>\r\n<\/div>\r\n\r\n<!-- ABOUT -->\r\n<section class=\"about\" id=\"o-nas\">\r\n  <div class=\"inner\">\r\n    <div class=\"about-grid\">\r\n      <div class=\"about-visual reveal\">\r\n        <div class=\"about-img\">\ud83c\udf3f<\/div>\r\n        <div class=\"about-badge\"><strong>5+<\/strong><small>lat do\u015bwiadczenia<\/small><\/div>\r\n      <\/div>\r\n      <div>\r\n        <span class=\"section-tag reveal\">Kim jeste\u015bmy<\/span>\r\n        <h2 class=\"section-title reveal rd1\">Pasja do ogrod\u00f3w,<br>troska o ka\u017cdy szczeg\u00f3\u0142<\/h2>\r\n        <p class=\"section-sub reveal rd2\">Jeste\u015bmy lokalnym zespo\u0142em ogrodnik\u00f3w z pasj\u0105 do zieleni. Oferujemy kompleksow\u0105 opiek\u0119 nad Twoim ogrodem \u2013 od regularnego koszenia po ca\u0142kowite projekty od zera. Ka\u017cdy ogr\u00f3d traktujemy indywidualnie.<\/p>\r\n        <div class=\"about-values reveal rd3\">\r\n          <div class=\"value-chip\">Terminowo\u015b\u0107<\/div>\r\n          <div class=\"value-chip\">Profesjonalizm<\/div>\r\n          <div class=\"value-chip\">Nowoczesny sprz\u0119t<\/div>\r\n          <div class=\"value-chip\">Uczciwe ceny<\/div>\r\n          <div class=\"value-chip\">Gwarancja jako\u015bci<\/div>\r\n          <div class=\"value-chip\">Ekologia<\/div>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<!-- SERVICES -->\r\n<section class=\"services\" id=\"uslugi\">\r\n  <div class=\"inner\">\r\n    <span class=\"section-tag reveal\">Nasza oferta<\/span>\r\n    <h2 class=\"section-title reveal rd1\">Us\u0142ugi ogrodnicze<\/h2>\r\n    <p class=\"section-sub reveal rd2\">Kliknij w us\u0142ug\u0119 aby zobaczy\u0107 szczeg\u00f3\u0142y i um\u00f3wi\u0107 termin realizacji.<\/p>\r\n    <div class=\"services-grid\">\r\n      <a class=\"service-card reveal\" onclick=\"openModal('koszenie');return false;\" href=\"#\">\r\n        <div class=\"sc-img cg1\">\ud83c\udf3e<\/div>\r\n        <div class=\"sc-body\">\r\n          <div class=\"sc-title\">Koszenie trawy<\/div>\r\n          <div class=\"sc-desc\">Regularne koszenie trawnika z wywozem trawy lub mulczowaniem. R\u00f3wne kraw\u0119dzie, estetyczny efekt.<\/div>\r\n          <div class=\"sc-footer\"><div class=\"price-tag\">od 80 z\u0142<small> \/wizyta<\/small><\/div><span class=\"book-btn\">Um\u00f3w \u2192<\/span><\/div>\r\n        <\/div>\r\n      <\/a>\r\n      <a class=\"service-card reveal rd1\" onclick=\"openModal('werty');return false;\" href=\"#\">\r\n        <div class=\"sc-img cg2\">\ud83c\udf31<\/div>\r\n        <div class=\"sc-body\">\r\n          <div class=\"sc-title\">Wertykulacja trawy<\/div>\r\n          <div class=\"sc-desc\">Usuwanie filcu i aeracja gleby. Trawnik oddycha, lepiej przyjmuje wod\u0119 i nawozy.<\/div>\r\n          <div class=\"sc-footer\"><div class=\"price-tag\">od 150 z\u0142<small> \/ar<\/small><\/div><span class=\"book-btn\">Um\u00f3w \u2192<\/span><\/div>\r\n        <\/div>\r\n      <\/a>\r\n      <a class=\"service-card reveal rd2\" onclick=\"openModal('pielegn');return false;\" href=\"#\">\r\n        <div class=\"sc-img cg3\">\ud83c\udf43<\/div>\r\n        <div class=\"sc-body\">\r\n          <div class=\"sc-title\">Piel\u0119gnacja trawnika<\/div>\r\n          <div class=\"sc-desc\">Kompleksowy pakiet piel\u0119gnacyjny: nawo\u017cenie, dosiewanie, odchwaszczanie i podlewanie.<\/div>\r\n          <div class=\"sc-footer\"><div class=\"price-tag\">od 200 z\u0142<small> \/sezon<\/small><\/div><span class=\"book-btn\">Um\u00f3w \u2192<\/span><\/div>\r\n        <\/div>\r\n      <\/a>\r\n      <a class=\"service-card reveal\" onclick=\"openModal('renow');return false;\" href=\"#\">\r\n        <div class=\"sc-img cg4\">\ud83d\udd04<\/div>\r\n        <div class=\"sc-body\">\r\n          <div class=\"sc-title\">Renowacja trawnika<\/div>\r\n          <div class=\"sc-desc\">Przywracamy trawniki do \u017cycia \u2013 wyr\u00f3wnanie terenu, nowe nasadzenia, pe\u0142na regeneracja.<\/div>\r\n          <div class=\"sc-footer\"><div class=\"price-tag\">od 500 z\u0142<small> \/projekt<\/small><\/div><span class=\"book-btn\">Um\u00f3w \u2192<\/span><\/div>\r\n        <\/div>\r\n      <\/a>\r\n      <a class=\"service-card reveal rd1\" onclick=\"openModal('projekt');return false;\" href=\"#\">\r\n        <div class=\"sc-img cg5\">\ud83c\udf33<\/div>\r\n        <div class=\"sc-body\">\r\n          <div class=\"sc-title\">Ogr\u00f3d od zera z projektem<\/div>\r\n          <div class=\"sc-desc\">Projektujemy i zak\u0142adamy ogrody od podstaw z projektem 2D\/3D i pe\u0142n\u0105 realizacj\u0105.<\/div>\r\n          <div class=\"sc-footer\"><div class=\"price-tag\">Wycena indyw.<\/div><span class=\"book-btn\">Um\u00f3w \u2192<\/span><\/div>\r\n        <\/div>\r\n      <\/a>\r\n      <a class=\"service-card reveal rd2\" onclick=\"openModal('rosliny');return false;\" href=\"#\">\r\n        <div class=\"sc-img cg1\">\ud83c\udf38<\/div>\r\n        <div class=\"sc-body\">\r\n          <div class=\"sc-title\">Piel\u0119gnacja ro\u015blin<\/div>\r\n          <div class=\"sc-desc\">Ci\u0119cie, formowanie, nawo\u017cenie krzew\u00f3w i drzew ozdobnych. Opryski ochronne.<\/div>\r\n          <div class=\"sc-footer\"><div class=\"price-tag\">od 120 z\u0142<small> \/wizyta<\/small><\/div><span class=\"book-btn\">Um\u00f3w \u2192<\/span><\/div>\r\n        <\/div>\r\n      <\/a>\r\n      <a class=\"service-card reveal\" onclick=\"openModal('mycie');return false;\" href=\"#\">\r\n        <div class=\"sc-img cg6\">\ud83d\udca7<\/div>\r\n        <div class=\"sc-body\">\r\n          <div class=\"sc-title\">Mycie ci\u015bnieniowe<\/div>\r\n          <div class=\"sc-desc\">Mycie p\u0142ot\u00f3w, kostki brukowej, taras\u00f3w i podjazd\u00f3w myjk\u0105 ci\u015bnieniow\u0105.<\/div>\r\n          <div class=\"sc-footer\"><div class=\"price-tag\">od 100 z\u0142<small> \/us\u0142uga<\/small><\/div><span class=\"book-btn\">Um\u00f3w \u2192<\/span><\/div>\r\n        <\/div>\r\n      <\/a>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<!-- PROCESS -->\r\n<section class=\"process\" id=\"jak-dzialamy\">\r\n  <div class=\"inner\" style=\"text-align:center\">\r\n    <span class=\"section-tag\" style=\"background:rgba(124,184,122,.15);color:var(--gm)\">Jak dzia\u0142amy<\/span>\r\n    <h2 class=\"section-title reveal\" style=\"color:var(--wh)\">Prosto i przejrzy\u015bcie<\/h2>\r\n    <p class=\"section-sub-center reveal rd1\">Cztery proste kroki dziel\u0105 Ci\u0119 od pi\u0119knego ogrodu.<\/p>\r\n    <div class=\"process-steps\">\r\n      <div class=\"process-step reveal\"><div class=\"step-num\">1<\/div><div class=\"step-title\">Wybierz us\u0142ug\u0119<\/div><div class=\"step-desc\">Przegl\u0105daj ofert\u0119 i wybierz czego potrzebujesz<\/div><\/div>\r\n      <div class=\"process-step reveal rd1\"><div class=\"step-num\">2<\/div><div class=\"step-title\">Um\u00f3w termin<\/div><div class=\"step-desc\">Wybierz wygodny dzie\u0144 i godzin\u0119 w kalendarzu<\/div><\/div>\r\n      <div class=\"process-step reveal rd2\"><div class=\"step-num\">3<\/div><div class=\"step-title\">Przyje\u017cd\u017camy<\/div><div class=\"step-desc\">Nasz team pojawia si\u0119 punktualnie z pe\u0142nym sprz\u0119tem<\/div><\/div>\r\n      <div class=\"process-step reveal rd3\"><div class=\"step-num\">4<\/div><div class=\"step-title\">Efekt gwarantowany<\/div><div class=\"step-desc\">Odbi\u00f3r pracy i Twoja satysfakcja to nasz priorytet<\/div><\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<!-- CALENDAR \/ BOOKING -->\r\n<section class=\"calendar-section\" id=\"rezerwacja\">\r\n  <div class=\"inner-sm\">\r\n    <div style=\"text-align:center;margin-bottom:3rem\">\r\n      <span class=\"section-tag reveal\">Rezerwacja<\/span>\r\n      <h2 class=\"section-title reveal rd1\">Wybierz termin wizyty<\/h2>\r\n      <p class=\"section-sub reveal rd2\" style=\"margin:0 auto\">Zielone kropki = wolne terminy. Wybierz dzie\u0144, godzin\u0119 i wype\u0142nij formularz. Potwierdzimy wizyt\u0119 w ci\u0105gu 24h.<\/p>\r\n    <\/div>\r\n    <div class=\"cal-widget reveal rd3\">\r\n      <div class=\"cal-header\">\r\n        <button class=\"cal-nav\" onclick=\"changeMonth(-1)\">\u2039<\/button>\r\n        <div class=\"cal-month\" id=\"calLabel\"><\/div>\r\n        <button class=\"cal-nav\" onclick=\"changeMonth(1)\">\u203a<\/button>\r\n      <\/div>\r\n      <div class=\"cal-grid\" id=\"calGrid\"><\/div>\r\n\r\n      <!-- Step 2: time slots -->\r\n      <div id=\"timeStep\" style=\"display:none;margin-bottom:1rem\">\r\n        <p style=\"font-size:.82rem;font-weight:600;color:var(--gd);margin-bottom:.6rem;text-transform:uppercase;letter-spacing:.06em\">Wybierz godzin\u0119<\/p>\r\n        <div class=\"time-slots\" id=\"timeSlots\"><\/div>\r\n        <p class=\"form-error\" id=\"timeError\">\u26a0 Prosz\u0119 wybra\u0107 godzin\u0119 wizyty.<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"cal-chosen\" id=\"calChosen\"><\/div>\r\n\r\n      <!-- Booking form -->\r\n      <div class=\"booking-form\" id=\"bookingForm\">\r\n        <p class=\"form-error\" id=\"formError\">\u26a0 Prosz\u0119 wype\u0142ni\u0107 wszystkie wymagane pola.<\/p>\r\n        <div class=\"form-row\">\r\n          <div class=\"form-group\"><label>Imi\u0119 i nazwisko *<\/label><input id=\"fName\" type=\"text\" placeholder=\"Jan Kowalski\"><\/div>\r\n          <div class=\"form-group\"><label>Telefon *<\/label><input id=\"fPhone\" type=\"tel\" placeholder=\"600 000 000\"><\/div>\r\n        <\/div>\r\n        <div class=\"form-row\">\r\n          <div class=\"form-group\"><label>Email<\/label><input id=\"fEmail\" type=\"email\" placeholder=\"jan@email.pl\"><\/div>\r\n          <div class=\"form-group\">\r\n            <label>Us\u0142uga *<\/label>\r\n            <select id=\"fService\">\r\n              <option value=\"\">-- wybierz us\u0142ug\u0119 --<\/option>\r\n              <option>Koszenie trawy<\/option>\r\n              <option>Wertykulacja trawy<\/option>\r\n              <option>Piel\u0119gnacja trawnika<\/option>\r\n              <option>Renowacja trawnika<\/option>\r\n              <option>Ogr\u00f3d od zera z projektem<\/option>\r\n              <option>Piel\u0119gnacja ro\u015blin<\/option>\r\n              <option>Mycie ci\u015bnieniowe<\/option>\r\n            <\/select>\r\n          <\/div>\r\n        <\/div>\r\n        <div class=\"form-group\"><label>Adres realizacji *<\/label><input id=\"fAddr\" type=\"text\" placeholder=\"ul. Ogrodowa 5, Warszawa\"><\/div>\r\n        <div class=\"form-group\"><label>Uwagi<\/label><input id=\"fNote\" type=\"text\" placeholder=\"Np. du\u017cy ogr\u00f3d, brama od ulicy...\"><\/div>\r\n        <button class=\"btn-submit\" onclick=\"submitBooking()\">\ud83d\udcc5 Potwierd\u017a rezerwacj\u0119<\/button>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<!-- ADMIN PANEL -->\r\n<section class=\"admin-section\" id=\"admin\">\r\n  <div class=\"admin-inner\">\r\n    <div class=\"admin-header\">\r\n      <div class=\"admin-title\">\ud83d\udd10 Panel rezerwacji<\/div>\r\n      <div class=\"admin-lock\">\r\n        <input class=\"admin-pin\" type=\"password\" id=\"adminPin\" placeholder=\"PIN dost\u0119pu\" onkeydown=\"if(event.key==='Enter')unlockAdmin()\">\r\n        <button class=\"btn-admin\" onclick=\"unlockAdmin()\">Zaloguj<\/button>\r\n        <button class=\"btn-admin\" style=\"background:var(--ea)\" onclick=\"clearAllBookings()\">Wyczy\u015b\u0107 wszystkie<\/button>\r\n      <\/div>\r\n    <\/div>\r\n    <div class=\"admin-body\" id=\"adminBody\">\r\n      <div class=\"admin-stats\" id=\"adminStats\"><\/div>\r\n      <div id=\"bookingsTableWrap\"><\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<!-- CONTACT -->\r\n<section class=\"contact\" id=\"kontakt\">\r\n  <div class=\"inner\">\r\n    <div class=\"contact-grid\">\r\n      <div>\r\n        <span class=\"section-tag\" style=\"background:rgba(184,217,176,.15);color:var(--gl)\">Kontakt<\/span>\r\n        <h2 class=\"section-title reveal\">Masz pytania?<br>Napisz do nas<\/h2>\r\n        <p class=\"section-sub reveal rd1\">Ch\u0119tnie odpowiemy na pytania o us\u0142ugi, wyceny i dost\u0119pno\u015b\u0107 termin\u00f3w.<\/p>\r\n        <div class=\"contact-items reveal rd2\">\r\n          <div class=\"contact-item\"><div class=\"contact-icon\">\ud83d\udcde<\/div><div><strong>+48 600 000 000<\/strong><br><small style=\"opacity:.7\">Pon\u2013Sob, 7:00\u201318:00<\/small><\/div><\/div>\r\n          <div class=\"contact-item\"><div class=\"contact-icon\">\ud83d\udce7<\/div><div>kontakt@zielonyogrod.pl<\/div><\/div>\r\n          <div class=\"contact-item\"><div class=\"contact-icon\">\ud83d\udccd<\/div><div>Warszawa i okolice (50 km)<\/div><\/div>\r\n        <\/div>\r\n      <\/div>\r\n      <div class=\"cform reveal rd2\">\r\n        <h3>Wy\u015blij wiadomo\u015b\u0107<\/h3>\r\n        <div style=\"display:flex;flex-direction:column;gap:1rem\">\r\n          <div class=\"form-group\"><label>Imi\u0119<\/label><input type=\"text\" placeholder=\"Twoje imi\u0119\"><\/div>\r\n          <div class=\"form-group\"><label>Email<\/label><input type=\"email\" placeholder=\"email@example.com\"><\/div>\r\n          <div class=\"form-group\"><label>Wiadomo\u015b\u0107<\/label><textarea placeholder=\"Opisz czego potrzebujesz...\"><\/textarea><\/div>\r\n          <button class=\"btn-sl\" onclick=\"submitContact()\">Wy\u015blij wiadomo\u015b\u0107 \u2192<\/button>\r\n        <\/div>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n<\/section>\r\n\r\n<footer>\r\n  <p>\u00a9 2025 <strong>ZielonyOgr\u00f3d<\/strong> \u2014 Profesjonalna piel\u0119gnacja ogrod\u00f3w \u00b7 Warszawa i okolice<\/p>\r\n  <p style=\"margin-top:.5rem;font-size:.73rem;opacity:.45\">Strona prototypowa \u2013 do personalizacji<\/p>\r\n<\/footer>\r\n\r\n<!-- MODAL -->\r\n<div class=\"modal-overlay\" id=\"modalOverlay\">\r\n  <div class=\"modal\">\r\n    <button class=\"modal-close\" id=\"modalCloseBtn\">\u2715<\/button>\r\n    <div class=\"modal-icon\" id=\"mIcon\"><\/div>\r\n    <div class=\"modal-title\" id=\"mTitle\"><\/div>\r\n    <div class=\"modal-price\" id=\"mPrice\"><\/div>\r\n    <div class=\"modal-desc\" id=\"mDesc\"><\/div>\r\n    <div class=\"modal-includes\"><h4>Co obejmuje us\u0142uga<\/h4><ul id=\"mList\"><\/ul><\/div>\r\n    <div class=\"modal-actions\">\r\n      <a href=\"#rezerwacja\" class=\"btn-bm\" id=\"mBook\">\ud83d\udcc5 Um\u00f3w termin<\/a>\r\n      <a href=\"#kontakt\" class=\"btn-cm\" id=\"mContact\">\u2709 Zapytaj o cen\u0119<\/a>\r\n    <\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\n\/* \u2500\u2500 SERVICES DATA \u2500\u2500 *\/\r\nconst SVC = {\r\n  koszenie:{icon:'\ud83c\udf3e',title:'Koszenie trawy',price:'od 80 z\u0142 \/ wizyta',desc:'Profesjonalne koszenie trawnika przy u\u017cyciu nowoczesnego sprz\u0119tu. Dbamy o r\u00f3wnomierne przycinanie, czyste kraw\u0119dzie i estetyczne wyko\u0144czenie.',list:['Koszenie do wybranej wysoko\u015bci','Odsysanie lub mulczowanie trawy','Obci\u0119cie kraw\u0119dzi przy chodnikach','Sprz\u0105tanie po pracy','Cykliczne wizyty (co 1\u20132 tygodnie)']},\r\n  werty:{icon:'\ud83c\udf31',title:'Wertykulacja trawy',price:'od 150 z\u0142 \/ ar',desc:'Mechaniczne usuwanie filcu i mchu z trawnika. Poprawia przepuszczalno\u015b\u0107 gleby, dotlenienie korzeni i og\u00f3ln\u0105 kondycj\u0119 murawy.',list:['Wertykulacja mechaniczna','Grabienie i wyw\u00f3z filcu','Dosiew trawy na przerzedzone miejsca','Nawo\u017cenie startowe po zabiegu','Zalecenia piel\u0119gnacyjne']},\r\n  pielegn:{icon:'\ud83c\udf43',title:'Piel\u0119gnacja trawnika',price:'od 200 z\u0142 \/ sezon',desc:'Kompleksowy pakiet piel\u0119gnacyjny dostosowany do potrzeb Twojego trawnika przez ca\u0142y sezon wegetacyjny.',list:['Regularne koszenie (co 1\u20132 tyg.)','Nawo\u017cenie 3\u20134\u00d7 w sezonie','Odchwaszczanie selektywne','Dosiewanie w razie potrzeby','Raport stanu po ka\u017cdej wizycie']},\r\n  renow:{icon:'\ud83d\udd04',title:'Renowacja trawnika',price:'od 500 z\u0142 \/ projekt',desc:'Przywracamy trawniki do \u017cycia. Je\u015bli Tw\u00f3j trawnik jest zniszczony lub po\u017c\u00f3\u0142k\u0142y \u2013 renowacja to idealne rozwi\u0105zanie.',list:['Ocena stanu i plan renowacji','Frezowanie \/ skaryfikacja','Wyr\u00f3wnanie terenu','Wysiew nowej trawy lub uk\u0142adanie rolki','Kontrola przez 4 tygodnie']},\r\n  projekt:{icon:'\ud83c\udf33',title:'Ogr\u00f3d od zera z projektem',price:'Wycena indywidualna',desc:'Projektujemy i zak\u0142adamy ogrody od podstaw. Ka\u017cdy projekt dopasowany do dzia\u0142ki, oczekiwa\u0144 i bud\u017cetu.',list:['Wizja lokalna i konsultacja','Projekt 2D + wizualizacja','Dob\u00f3r ro\u015blin i materia\u0142\u00f3w','Realizacja \u2013 prace ziemne i nasadzenia','Opcjonalnie: nawadnianie, o\u015bwietlenie']},\r\n  rosliny:{icon:'\ud83c\udf38',title:'Piel\u0119gnacja ro\u015blin',price:'od 120 z\u0142 \/ wizyta',desc:'Profesjonalna opieka nad krzewami, drzewami ozdobnymi, \u017cywop\u0142otami i bylinami.',list:['Ci\u0119cie prze\u015bwietlaj\u0105ce i formuj\u0105ce','Nawo\u017cenie dostosowane do gatunku','Ochrona przed szkodnikami','Mulczowanie rabat','Usuwanie suchych ga\u0142\u0119zi']},\r\n  mycie:{icon:'\ud83d\udca7',title:'Mycie ci\u015bnieniowe',price:'od 100 z\u0142 \/ us\u0142uga',desc:'Mycie myjk\u0105 ci\u015bnieniow\u0105 p\u0142ot\u00f3w, kostki brukowej, taras\u00f3w i podjazd\u00f3w. Spektakularny efekt w kilka godzin.',list:['Mycie kostki i podjazd\u00f3w','Mycie taras\u00f3w i schod\u00f3w','Mycie p\u0142ot\u00f3w (PVC, beton, metal)','Usuwanie glon\u00f3w, mchu i nalot\u00f3w','Opcjonalnie: impregnacja powierzchni']}\r\n};\r\n\r\n\/* \u2500\u2500 MODAL \u2500\u2500 *\/\r\nfunction openModal(k){\r\n  const s=SVC[k];\r\n  document.getElementById('mIcon').textContent=s.icon;\r\n  document.getElementById('mTitle').textContent=s.title;\r\n  document.getElementById('mPrice').textContent=s.price;\r\n  document.getElementById('mDesc').textContent=s.desc;\r\n  document.getElementById('mList').innerHTML=s.list.map(i=>`<li>${i}<\/li>`).join('');\r\n  document.getElementById('modalOverlay').classList.add('active');\r\n  document.body.style.overflow='hidden';\r\n}\r\ndocument.getElementById('modalOverlay').addEventListener('click',function(e){\r\n  if(e.target===this){closeModal();}\r\n});\r\ndocument.getElementById('modalCloseBtn').addEventListener('click',closeModal);\r\ndocument.querySelectorAll('.btn-bm,.btn-cm').forEach(b=>b.addEventListener('click',closeModal));\r\nfunction closeModal(){\r\n  document.getElementById('modalOverlay').classList.remove('active');\r\n  document.body.style.overflow='';\r\n}\r\n\r\n\/* \u2500\u2500 NAV SCROLL \u2500\u2500 *\/\r\nwindow.addEventListener('scroll',()=>{\r\n  document.getElementById('mainNav').classList.toggle('scrolled',window.scrollY>60);\r\n  \/\/ parallax hero\r\n  const h=document.querySelector('.hero');\r\n  const m=document.getElementById('heroMedia');\r\n  const r=h.getBoundingClientRect();\r\n  if(r.bottom>0&&r.top<window.innerHeight){\r\n    const p=-r.top\/window.innerHeight;\r\n    m.style.transform=`translateY(${p*70}px)`;\r\n  }\r\n});\r\n\r\n\/* \u2500\u2500 MOBILE MENU \u2500\u2500 *\/\r\nfunction openMenu(){document.getElementById('mobMenu').classList.add('open');document.body.style.overflow='hidden';}\r\nfunction closeMenu(){document.getElementById('mobMenu').classList.remove('open');document.body.style.overflow='';}\r\n\r\n\/* \u2500\u2500 REVEAL \u2500\u2500 *\/\r\nconst obs=new IntersectionObserver(es=>es.forEach(e=>{if(e.isIntersecting)e.target.classList.add('visible');}),{threshold:.12});\r\ndocument.querySelectorAll('.reveal').forEach(el=>obs.observe(el));\r\n\r\n\/* \u2500\u2500 CALENDAR \u2500\u2500 *\/\r\nlet cur=new Date(), selDay=null, selTime=null;\r\nconst MONTHS=['Stycze\u0144','Luty','Marzec','Kwiecie\u0144','Maj','Czerwiec','Lipiec','Sierpie\u0144','Wrzesie\u0144','Pa\u017adziernik','Listopad','Grudzie\u0144'];\r\nconst DAYS=['Pon','Wto','\u015aro','Czw','Pi\u0105','Sob','Nie'];\r\nconst AVAIL=[2,5,6,8,10,12,13,15,16,19,20,22,26,27];\r\nconst TIMES=['7:00','8:00','9:00','10:00','11:00','12:00','13:00','14:00','15:00','16:00','17:00'];\r\nconst BUSY_TIMES={5:['9:00','10:00'],12:['8:00','14:00'],19:['11:00','12:00','13:00']};\r\n\r\nfunction renderCal(){\r\n  const y=cur.getFullYear(), m=cur.getMonth();\r\n  const today=new Date();\r\n  document.getElementById('calLabel').textContent=`${MONTHS[m]} ${y}`;\r\n  const g=document.getElementById('calGrid'); g.innerHTML='';\r\n  DAYS.forEach(d=>{const e=document.createElement('div');e.className='cal-day-name';e.textContent=d;g.appendChild(e);});\r\n  let fd=new Date(y,m,1).getDay(); fd=(fd+6)%7;\r\n  for(let i=0;i<fd;i++){const e=document.createElement('button');e.className='cal-day empty';g.appendChild(e);}\r\n  const dim=new Date(y,m+1,0).getDate();\r\n  for(let d=1;d<=dim;d++){\r\n    const e=document.createElement('button'); e.className='cal-day'; e.textContent=d;\r\n    const isToday=d===today.getDate()&&m===today.getMonth()&&y===today.getFullYear();\r\n    const isPast=new Date(y,m,d)<new Date(today.getFullYear(),today.getMonth(),today.getDate());\r\n    if(isToday)e.classList.add('today');\r\n    if(isPast){e.classList.add('disabled');e.disabled=true;}\r\n    else if(AVAIL.includes(d))e.classList.add('available');\r\n    else{e.classList.add('disabled');e.disabled=true;}\r\n    if(selDay===d)e.classList.add('selected');\r\n    e.onclick=()=>selectDay(d,m,y);\r\n    g.appendChild(e);\r\n  }\r\n}\r\n\r\nfunction selectDay(d,m,y){\r\n  selDay=d; selTime=null;\r\n  renderCal();\r\n  \/\/ show time slots\r\n  const ts=document.getElementById('timeStep'); ts.style.display='block';\r\n  const busy=BUSY_TIMES[d]||[];\r\n  document.getElementById('timeSlots').innerHTML=TIMES.map(t=>{\r\n    const isBusy=busy.includes(t);\r\n    return `<button class=\"time-slot${isBusy?' busy':''}\" onclick=\"selectTime('${t}',${isBusy})\" ${isBusy?'disabled':''}>${t}<\/button>`;\r\n  }).join('');\r\n  document.getElementById('timeError').classList.remove('visible');\r\n  document.getElementById('calChosen').classList.remove('visible');\r\n  document.getElementById('bookingForm').classList.remove('visible');\r\n}\r\n\r\nfunction selectTime(t,busy){\r\n  if(busy)return;\r\n  selTime=t;\r\n  document.querySelectorAll('.time-slot').forEach(s=>s.classList.remove('selected'));\r\n  event.target.classList.add('selected');\r\n  const label=`\u2705 Wybrany termin: ${selDay} ${MONTHS[cur.getMonth()]} ${cur.getFullYear()}, godz. ${t}`;\r\n  const ch=document.getElementById('calChosen'); ch.textContent=label; ch.classList.add('visible');\r\n  document.getElementById('bookingForm').classList.add('visible');\r\n  document.getElementById('timeError').classList.remove('visible');\r\n}\r\n\r\nfunction changeMonth(dir){\r\n  cur.setMonth(cur.getMonth()+dir); selDay=null; selTime=null;\r\n  document.getElementById('timeStep').style.display='none';\r\n  document.getElementById('calChosen').classList.remove('visible');\r\n  document.getElementById('bookingForm').classList.remove('visible');\r\n  renderCal();\r\n}\r\n\r\nrenderCal();\r\n\r\n\/* \u2500\u2500 BOOKING SUBMIT \u2500\u2500 *\/\r\nfunction getBookings(){try{return JSON.parse(localStorage.getItem('garden_bookings')||'[]');}catch{return[];}}\r\nfunction saveBookings(arr){localStorage.setItem('garden_bookings',JSON.stringify(arr));}\r\n\r\nfunction submitBooking(){\r\n  \/\/ validation\r\n  if(!selDay){alert('\u26a0 Prosz\u0119 wybra\u0107 dzie\u0144 wizyty.');return;}\r\n  if(!selTime){document.getElementById('timeError').classList.add('visible');return;}\r\n  const name=document.getElementById('fName').value.trim();\r\n  const phone=document.getElementById('fPhone').value.trim();\r\n  const service=document.getElementById('fService').value;\r\n  const addr=document.getElementById('fAddr').value.trim();\r\n  if(!name||!phone||!service||!addr){\r\n    document.getElementById('formError').classList.add('visible');return;\r\n  }\r\n  document.getElementById('formError').classList.remove('visible');\r\n  const booking={\r\n    id:Date.now(),\r\n    date:`${selDay} ${MONTHS[cur.getMonth()]} ${cur.getFullYear()}`,\r\n    time:selTime,\r\n    name,phone,\r\n    email:document.getElementById('fEmail').value.trim(),\r\n    service, addr,\r\n    note:document.getElementById('fNote').value.trim(),\r\n    createdAt:new Date().toLocaleString('pl-PL')\r\n  };\r\n  const all=getBookings(); all.push(booking); saveBookings(all);\r\n  alert(`\u2705 Rezerwacja zapisana!\\n\\n\ud83d\udcc5 ${booking.date}, ${booking.time}\\n\ud83c\udf3f ${booking.service}\\n\ud83d\udc64 ${booking.name}\\n\ud83d\udccd ${booking.addr}\\n\\nSkontaktujemy si\u0119 w ci\u0105gu 24h!`);\r\n  \/\/ reset\r\n  selDay=null; selTime=null;\r\n  document.getElementById('fName').value='';document.getElementById('fPhone').value='';\r\n  document.getElementById('fEmail').value='';document.getElementById('fService').value='';\r\n  document.getElementById('fAddr').value='';document.getElementById('fNote').value='';\r\n  document.getElementById('timeStep').style.display='none';\r\n  document.getElementById('calChosen').classList.remove('visible');\r\n  document.getElementById('bookingForm').classList.remove('visible');\r\n  renderCal();\r\n  renderAdmin();\r\n}\r\n\r\n\/* \u2500\u2500 ADMIN PANEL \u2500\u2500 *\/\r\nconst ADMIN_PIN='1234';\r\nfunction unlockAdmin(){\r\n  const pin=document.getElementById('adminPin').value;\r\n  if(pin===ADMIN_PIN){\r\n    document.getElementById('adminBody').classList.add('open');\r\n    renderAdmin();\r\n  } else {\r\n    alert('Nieprawid\u0142owy PIN.');\r\n    document.getElementById('adminPin').value='';\r\n  }\r\n}\r\nfunction renderAdmin(){\r\n  const bookings=getBookings();\r\n  \/\/ stats\r\n  const services={}; bookings.forEach(b=>{services[b.service]=(services[b.service]||0)+1;});\r\n  const topSvc=Object.entries(services).sort((a,b)=>b[1]-a[1])[0];\r\n  document.getElementById('adminStats').innerHTML=`\r\n    <div class=\"admin-stat\"><div class=\"n\">${bookings.length}<\/div><div class=\"l\">Rezerwacji \u0142\u0105cznie<\/div><\/div>\r\n    <div class=\"admin-stat\"><div class=\"n\">${bookings.filter(b=>{const d=new Date();return b.createdAt.includes(d.toLocaleDateString('pl-PL').split('.')[1])}).length}<\/div><div class=\"l\">W tym miesi\u0105cu<\/div><\/div>\r\n    <div class=\"admin-stat\"><div class=\"n\">${topSvc?topSvc[0].split(' ')[0]:'\u2013'}<\/div><div class=\"l\">Najpopularniejsza us\u0142uga<\/div><\/div>\r\n  `;\r\n  if(!bookings.length){\r\n    document.getElementById('bookingsTableWrap').innerHTML='<div class=\"admin-empty\">\ud83d\udccb Brak rezerwacji. Gdy klienci si\u0119 zapisz\u0105, pojawi\u0105 si\u0119 tutaj.<\/div>';\r\n    return;\r\n  }\r\n  const rows=bookings.slice().reverse().map(b=>`\r\n    <tr>\r\n      <td><strong>${b.date}<\/strong><br><small>${b.time}<\/small><\/td>\r\n      <td>${b.name}<br><small>${b.phone}<\/small><\/td>\r\n      <td>${b.service}<\/td>\r\n      <td>${b.addr}${b.note?`<br><small style=\"color:var(--tm)\">${b.note}<\/small>`:''}<\/td>\r\n      <td><span class=\"badge-new\">nowa<\/span><\/td>\r\n      <td><button class=\"btn-del\" onclick=\"deleteBooking(${b.id})\">Usu\u0144<\/button><\/td>\r\n    <\/tr>`).join('');\r\n  document.getElementById('bookingsTableWrap').innerHTML=`\r\n    <table class=\"bookings-table\">\r\n      <thead><tr><th>Termin<\/th><th>Klient<\/th><th>Us\u0142uga<\/th><th>Adres<\/th><th>Status<\/th><th><\/th><\/tr><\/thead>\r\n      <tbody>${rows}<\/tbody>\r\n    <\/table>`;\r\n}\r\nfunction deleteBooking(id){\r\n  if(!confirm('Usun\u0105\u0107 t\u0119 rezerwacj\u0119?'))return;\r\n  saveBookings(getBookings().filter(b=>b.id!==id));\r\n  renderAdmin();\r\n}\r\nfunction clearAllBookings(){\r\n  if(!confirm('Usun\u0105\u0107 WSZYSTKIE rezerwacje? Tej operacji nie mo\u017cna cofn\u0105\u0107.'))return;\r\n  saveBookings([]);\r\n  renderAdmin();\r\n}\r\n\r\nfunction submitContact(){alert('\u2705 Wiadomo\u015b\u0107 wys\u0142ana! Odpiszemy najszybciej jak to mo\u017cliwe.');}\r\n<\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-98b37bf e-flex e-con-boxed e-con e-parent\" data-id=\"98b37bf\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\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>ZielonyOgr\u00f3d \u2013 Profesjonalna Piel\u0119gnacja Ogrod\u00f3w ZielonyOgr\u00f3d O nas Us\u0142ugi Jak dzia\u0142amy Rezerwacja Um\u00f3w wizyt\u0119 \u2715 O nas Us\u0142ugi Jak dzia\u0142amy Rezerwacja Kontakt Profesjonalna piel\u0119gnacja ogrod\u00f3w Tw\u00f3j ogr\u00f3dw najlepszychr\u0119kach Kompleksowa piel\u0119gnacja, projektowanie i renowacja ogrod\u00f3w. Przyje\u017cd\u017camy tam, gdzie jest Tw\u00f3j ogr\u00f3d. \ud83d\udcc5 Um\u00f3w termin Zobacz us\u0142ugi Przewi\u0144 150+Zadowolonych klient\u00f3w 8Us\u0142ug w ofercie 5\u2605\u015arednia ocena 24hCzas odpowiedzi [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-10","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/ogarnji.pl\/index.php?rest_route=\/wp\/v2\/pages\/10","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ogarnji.pl\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/ogarnji.pl\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/ogarnji.pl\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ogarnji.pl\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=10"}],"version-history":[{"count":25,"href":"https:\/\/ogarnji.pl\/index.php?rest_route=\/wp\/v2\/pages\/10\/revisions"}],"predecessor-version":[{"id":55,"href":"https:\/\/ogarnji.pl\/index.php?rest_route=\/wp\/v2\/pages\/10\/revisions\/55"}],"wp:attachment":[{"href":"https:\/\/ogarnji.pl\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=10"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}