Spaces:
Running
Running
| <html lang="pl"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>AXIOM Studio — Architektura Wnętrz</title> | |
| <link rel="preconnect" href="https://fonts.googleapis.com"> | |
| <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> | |
| <link href="https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400&family=Inter:wght@300;400;500;600&family=Playfair+Display:ital,wght@0,400;0,700;1,400&display=swap" rel="stylesheet"> | |
| <link rel="stylesheet" href="style.css"> | |
| </head> | |
| <body> | |
| <!-- CURSOR --> | |
| <div class="cursor" id="cursor"></div> | |
| <div class="cursor-follower" id="cursor-follower"></div> | |
| <!-- LOADER --> | |
| <div class="loader" id="loader"> | |
| <div class="loader-inner"> | |
| <div class="loader-line"></div> | |
| <span class="loader-text">AXIOM</span> | |
| </div> | |
| </div> | |
| <!-- NAVIGATION --> | |
| <nav class="nav" id="nav"> | |
| <div class="nav-logo"> | |
| <span class="logo-text">AXIOM</span> | |
| <span class="logo-sub">STUDIO</span> | |
| </div> | |
| <div class="nav-links"> | |
| <a href="#about" class="nav-link">O Nas</a> | |
| <a href="#portfolio" class="nav-link">Portfolio</a> | |
| <a href="#process" class="nav-link">Proces</a> | |
| <a href="#testimonials" class="nav-link">Opinie</a> | |
| <a href="#contact" class="nav-link nav-cta">Kontakt</a> | |
| </div> | |
| <div class="nav-hamburger" id="hamburger"> | |
| <span></span><span></span><span></span> | |
| </div> | |
| </nav> | |
| <!-- HERO --> | |
| <section class="hero" id="hero"> | |
| <div class="hero-bg"> | |
| <div class="hero-gradient"></div> | |
| <div class="hero-grid"></div> | |
| <div class="hero-orb orb-1"></div> | |
| <div class="hero-orb orb-2"></div> | |
| <div class="hero-orb orb-3"></div> | |
| </div> | |
| <div class="hero-content"> | |
| <div class="hero-badge">Warsaw • Poland • Est. 2014</div> | |
| <h1 class="hero-title"> | |
| <span class="title-line">Przestrzenie</span> | |
| <span class="title-line italic">które inspirują</span> | |
| <span class="title-line">do życia</span> | |
| </h1> | |
| <p class="hero-desc">Tworzymy wyjątkowe wnętrza łącząc elegancję z funkcjonalnością. Każdy projekt to unikalna historia opowiedziana przez przestrzeń, światło i materię.</p> | |
| <div class="hero-actions"> | |
| <a href="#portfolio" class="btn-primary"> | |
| <span>Zobacz Portfolio</span> | |
| <svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M3 8H13M9 4l4 4-4 4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg> | |
| </a> | |
| <a href="#contact" class="btn-secondary">Umów Konsultację</a> | |
| </div> | |
| <div class="hero-stats"> | |
| <div class="stat"> | |
| <span class="stat-num" data-count="147">0</span> | |
| <span class="stat-label">Projektów</span> | |
| </div> | |
| <div class="stat-divider"></div> | |
| <div class="stat"> | |
| <span class="stat-num" data-count="12">0</span> | |
| <span class="stat-label">Lat doświadczenia</span> | |
| </div> | |
| <div class="stat-divider"></div> | |
| <div class="stat"> | |
| <span class="stat-num" data-count="98">0</span> | |
| <span class="stat-label">% Zadowolonych klientów</span> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="hero-visual"> | |
| <div class="hero-image-frame"> | |
| <div class="hero-image-inner"> | |
| <img src="https://images.unsplash.com/photo-1618221195710-dd6b41faaea6?w=800&q=80" alt="Interior Design" class="hero-img"> | |
| <div class="hero-image-overlay"></div> | |
| </div> | |
| <div class="hero-image-badge"> | |
| <svg width="20" height="20" viewBox="0 0 24 24" fill="none"><path d="M12 2l2.4 7.4H22l-6.2 4.5 2.4 7.4L12 17l-6.2 4.3 2.4-7.4L2 9.4h7.6z" fill="#C9A96E"/></svg> | |
| <span>Award Winning Design</span> | |
| </div> | |
| </div> | |
| <div class="hero-float-card"> | |
| <div class="float-card-content"> | |
| <img src="https://images.unsplash.com/photo-1586023492125-27b2c045efd7?w=200&q=80" alt="Project" class="float-img"> | |
| <div class="float-info"> | |
| <span class="float-title">Villa Mokotów</span> | |
| <span class="float-year">2025</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="hero-scroll"> | |
| <span>Scroll</span> | |
| <div class="scroll-line"></div> | |
| </div> | |
| </section> | |
| <!-- MARQUEE --> | |
| <div class="marquee-section"> | |
| <div class="marquee-track"> | |
| <div class="marquee-content"> | |
| <span>Architektura Wnętrz</span><span class="dot">•</span> | |
| <span>Projektowanie Przestrzeni</span><span class="dot">•</span> | |
| <span>Interior Design</span><span class="dot">•</span> | |
| <span>Luxury Living</span><span class="dot">•</span> | |
| <span>Minimalizm</span><span class="dot">•</span> | |
| <span>Skandynawski Design</span><span class="dot">•</span> | |
| <span>Architektura Wnętrz</span><span class="dot">•</span> | |
| <span>Projektowanie Przestrzeni</span><span class="dot">•</span> | |
| <span>Interior Design</span><span class="dot">•</span> | |
| <span>Luxury Living</span><span class="dot">•</span> | |
| <span>Minimalizm</span><span class="dot">•</span> | |
| <span>Skandynawski Design</span><span class="dot">•</span> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- ABOUT --> | |
| <section class="about" id="about"> | |
| <div class="container"> | |
| <div class="about-grid"> | |
| <div class="about-images"> | |
| <div class="about-img-main"> | |
| <img src="https://images.unsplash.com/photo-1560448204-e02f11c3d0e2?w=600&q=80" alt="Architect" loading="lazy"> | |
| <div class="about-img-accent"></div> | |
| </div> | |
| <div class="about-img-secondary"> | |
| <img src="https://images.unsplash.com/photo-1631679706909-1844bbd07221?w=400&q=80" alt="Interior" loading="lazy"> | |
| <div class="about-years-badge"> | |
| <span class="years-num">12+</span> | |
| <span class="years-label">lat<br>doświadczenia</span> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="about-text"> | |
| <div class="section-label">O Studio</div> | |
| <h2 class="section-title">Filozofia<br><em>pięknej przestrzeni</em></h2> | |
| <p class="about-desc">AXIOM Studio to butikowa pracownia architektoniczna założona przez Alicję Kowalską. Specjalizujemy się w tworzeniu wyjątkowych wnętrz, które łączą estetykę z funkcjonalnością, tworząc przestrzenie dopasowane do indywidualnych potrzeb każdego klienta.</p> | |
| <p class="about-desc">Nasza filozofia opiera się na głębokim rozumieniu przestrzeni, materiałów i światła. Każdy projekt traktujemy jako okazję do stworzenia czegoś unikatowego — miejsca, które odzwierciedla charakter i styl życia jego mieszkańców.</p> | |
| <div class="about-tags"> | |
| <span class="tag">Rezydencje</span> | |
| <span class="tag">Apartamenty</span> | |
| <span class="tag">Przestrzenie komercyjne</span> | |
| <span class="tag">Hotele</span> | |
| </div> | |
| <a href="#contact" class="btn-outline">Porozmawiajmy o projekcie</a> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- PORTFOLIO --> | |
| <section class="portfolio" id="portfolio"> | |
| <div class="container"> | |
| <div class="section-header"> | |
| <div class="section-label">Portfolio</div> | |
| <h2 class="section-title">Wybrane<br><em>realizacje</em></h2> | |
| <p class="section-desc">Każdy projekt to unikalna historia stworzona we współpracy z klientem</p> | |
| </div> | |
| <div class="portfolio-filter"> | |
| <button class="filter-btn active" data-filter="all">Wszystkie</button> | |
| <button class="filter-btn" data-filter="residential">Rezydencje</button> | |
| <button class="filter-btn" data-filter="apartment">Apartamenty</button> | |
| <button class="filter-btn" data-filter="commercial">Komercyjne</button> | |
| </div> | |
| <div class="portfolio-grid"> | |
| <div class="portfolio-item featured" data-category="residential"> | |
| <div class="portfolio-img-wrap"> | |
| <img src="https://images.unsplash.com/photo-1600210492493-0946911123ea?w=900&q=80" alt="Villa Wilanów" loading="lazy"> | |
| <div class="portfolio-overlay"> | |
| <div class="portfolio-info"> | |
| <span class="p-category">Rezydencja</span> | |
| <h3 class="p-title">Villa Wilanów</h3> | |
| <span class="p-year">Warszawa, 2024</span> | |
| </div> | |
| <div class="p-arrow"> | |
| <svg width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M5 12H19M13 6l6 6-6 6" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="portfolio-item" data-category="apartment"> | |
| <div class="portfolio-img-wrap"> | |
| <img src="https://images.unsplash.com/photo-1556909114-f6e7ad7d3136?w=600&q=80" alt="Apartament Żoliborz" loading="lazy"> | |
| <div class="portfolio-overlay"> | |
| <div class="portfolio-info"> | |
| <span class="p-category">Apartament</span> | |
| <h3 class="p-title">Apartament Żoliborz</h3> | |
| <span class="p-year">Warszawa, 2024</span> | |
| </div> | |
| <div class="p-arrow"> | |
| <svg width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M5 12H19M13 6l6 6-6 6" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="portfolio-item" data-category="apartment"> | |
| <div class="portfolio-img-wrap"> | |
| <img src="https://images.unsplash.com/photo-1616137422495-1e9e46e2aa1e?w=600&q=80" alt="Penthouse Śródmieście" loading="lazy"> | |
| <div class="portfolio-overlay"> | |
| <div class="portfolio-info"> | |
| <span class="p-category">Penthouse</span> | |
| <h3 class="p-title">Penthouse Śródmieście</h3> | |
| <span class="p-year">Warszawa, 2023</span> | |
| </div> | |
| <div class="p-arrow"> | |
| <svg width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M5 12H19M13 6l6 6-6 6" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="portfolio-item" data-category="commercial"> | |
| <div class="portfolio-img-wrap"> | |
| <img src="https://images.unsplash.com/photo-1582037928769-181f2644ecb7?w=600&q=80" alt="Restaurant Atelier" loading="lazy"> | |
| <div class="portfolio-overlay"> | |
| <div class="portfolio-info"> | |
| <span class="p-category">Restauracja</span> | |
| <h3 class="p-title">Restaurant Atelier</h3> | |
| <span class="p-year">Warszawa, 2023</span> | |
| </div> | |
| <div class="p-arrow"> | |
| <svg width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M5 12H19M13 6l6 6-6 6" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="portfolio-item" data-category="residential"> | |
| <div class="portfolio-img-wrap"> | |
| <img src="https://images.unsplash.com/photo-1615873968403-89e068629265?w=600&q=80" alt="Dom w Konstancinie" loading="lazy"> | |
| <div class="portfolio-overlay"> | |
| <div class="portfolio-info"> | |
| <span class="p-category">Dom</span> | |
| <h3 class="p-title">Dom w Konstancinie</h3> | |
| <span class="p-year">Konstancin, 2023</span> | |
| </div> | |
| <div class="p-arrow"> | |
| <svg width="24" height="24" viewBox="0 0 24 24" fill="none"><path d="M5 12H19M13 6l6 6-6 6" stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="portfolio-cta"> | |
| <a href="#contact" class="btn-primary">Zobacz wszystkie projekty | |
| <svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M3 8H13M9 4l4 4-4 4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg> | |
| </a> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- PROCESS --> | |
| <section class="process" id="process"> | |
| <div class="container"> | |
| <div class="section-header center"> | |
| <div class="section-label">Jak pracujemy</div> | |
| <h2 class="section-title">Nasz<br><em>proces projektowy</em></h2> | |
| </div> | |
| <div class="process-steps"> | |
| <div class="process-step"> | |
| <div class="step-number">01</div> | |
| <div class="step-icon"> | |
| <svg width="32" height="32" viewBox="0 0 32 32" fill="none"><circle cx="16" cy="16" r="14" stroke="#C9A96E" stroke-width="1.5"/><path d="M11 16.5l3 3 7-7" stroke="#C9A96E" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg> | |
| </div> | |
| <h3 class="step-title">Konsultacja</h3> | |
| <p class="step-desc">Poznajemy Twoje marzenia, styl życia i oczekiwania. To fundament każdego projektu.</p> | |
| </div> | |
| <div class="process-connector"></div> | |
| <div class="process-step"> | |
| <div class="step-number">02</div> | |
| <div class="step-icon"> | |
| <svg width="32" height="32" viewBox="0 0 32 32" fill="none"><circle cx="16" cy="16" r="14" stroke="#C9A96E" stroke-width="1.5"/><path d="M10 22l4-8 4 4 3-6" stroke="#C9A96E" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg> | |
| </div> | |
| <h3 class="step-title">Koncepcja</h3> | |
| <p class="step-desc">Tworzymy moodboard i wstępną wizję przestrzeni. Prezentujemy palety barw, materiały i styl.</p> | |
| </div> | |
| <div class="process-connector"></div> | |
| <div class="process-step"> | |
| <div class="step-number">03</div> | |
| <div class="step-icon"> | |
| <svg width="32" height="32" viewBox="0 0 32 32" fill="none"><circle cx="16" cy="16" r="14" stroke="#C9A96E" stroke-width="1.5"/><rect x="10" y="10" width="12" height="12" rx="1" stroke="#C9A96E" stroke-width="1.5"/><path d="M13 16h6M16 13v6" stroke="#C9A96E" stroke-width="1.5" stroke-linecap="round"/></svg> | |
| </div> | |
| <h3 class="step-title">Projekt 3D</h3> | |
| <p class="step-desc">Szczegółowe wizualizacje 3D pozwalają zobaczyć wnętrze zanim jeszcze powstanie.</p> | |
| </div> | |
| <div class="process-connector"></div> | |
| <div class="process-step"> | |
| <div class="step-number">04</div> | |
| <div class="step-icon"> | |
| <svg width="32" height="32" viewBox="0 0 32 32" fill="none"><circle cx="16" cy="16" r="14" stroke="#C9A96E" stroke-width="1.5"/><path d="M12 20V14l4-3 4 3v6" stroke="#C9A96E" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg> | |
| </div> | |
| <h3 class="step-title">Realizacja</h3> | |
| <p class="step-desc">Nadzorujemy każdy etap wykonania. Dbamy o jakość i terminowość wszystkich prac.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- FEATURED PROJECT --> | |
| <section class="featured-project"> | |
| <div class="fp-image"> | |
| <img src="https://images.unsplash.com/photo-1600585154340-be6161a56a0c?w=1400&q=80" alt="Featured Project" loading="lazy"> | |
| <div class="fp-overlay"></div> | |
| </div> | |
| <div class="fp-content"> | |
| <div class="section-label light">Projekt roku 2024</div> | |
| <h2 class="fp-title">Villa<br><em>Konstancin</em></h2> | |
| <p class="fp-desc">Luksusowa rezydencja o powierzchni 680m², zaprojektowana z myślą o rodzinie ceniącej spokój i elegancję. Projekt łączy nowoczesną architekturę z naturalnymi materiałami.</p> | |
| <div class="fp-details"> | |
| <div class="fp-detail"> | |
| <span class="fp-detail-label">Powierzchnia</span> | |
| <span class="fp-detail-value">680 m²</span> | |
| </div> | |
| <div class="fp-detail"> | |
| <span class="fp-detail-label">Lokalizacja</span> | |
| <span class="fp-detail-value">Konstancin-Jeziorna</span> | |
| </div> | |
| <div class="fp-detail"> | |
| <span class="fp-detail-label">Rok</span> | |
| <span class="fp-detail-value">2024</span> | |
| </div> | |
| </div> | |
| <a href="#contact" class="btn-primary light">Zobacz projekt | |
| <svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M3 8H13M9 4l4 4-4 4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg> | |
| </a> | |
| </div> | |
| </section> | |
| <!-- TESTIMONIALS --> | |
| <section class="testimonials" id="testimonials"> | |
| <div class="container"> | |
| <div class="section-header center"> | |
| <div class="section-label">Opinie</div> | |
| <h2 class="section-title">Co mówią<br><em>nasi klienci</em></h2> | |
| </div> | |
| <div class="testimonials-grid"> | |
| <div class="testimonial-card"> | |
| <div class="t-quote">"</div> | |
| <p class="t-text">AXIOM Studio stworzyło dla nas przestrzeń, która przerasta nasze najśmielsze oczekiwania. Alicja ma niesamowitą zdolność rozumienia potrzeb klienta i przekuwania ich w piękne, funkcjonalne projekty.</p> | |
| <div class="t-author"> | |
| <img src="https://i.pravatar.cc/60?img=1" alt="Katarzyna" class="t-avatar"> | |
| <div class="t-info"> | |
| <span class="t-name">Katarzyna i Marek W.</span> | |
| <span class="t-role">Klienci — Villa Wilanów</span> | |
| </div> | |
| </div> | |
| <div class="t-stars">★★★★★</div> | |
| </div> | |
| <div class="testimonial-card featured"> | |
| <div class="t-quote">"</div> | |
| <p class="t-text">Profesjonalizm na najwyższym poziomie. Od pierwszej konsultacji do odbioru kluczy — wszystko przebiegło bezproblemowo. Nasze mieszkanie jest teraz dokładnie takie, o jakim marzyliśmy przez lata.</p> | |
| <div class="t-author"> | |
| <img src="https://i.pravatar.cc/60?img=5" alt="Anna" class="t-avatar"> | |
| <div class="t-info"> | |
| <span class="t-name">Anna Kowalczyk</span> | |
| <span class="t-role">Klientka — Apartament Żoliborz</span> | |
| </div> | |
| </div> | |
| <div class="t-stars">★★★★★</div> | |
| </div> | |
| <div class="testimonial-card"> | |
| <div class="t-quote">"</div> | |
| <p class="t-text">Restauracja Atelier zyskała zupełnie nowe oblicze. Goście ciągle pytają o projektanta. To najlepsza inwestycja w historii naszego biznesu — design przyciąga klientów lepiej niż jakakolwiek reklama.</p> | |
| <div class="t-author"> | |
| <img src="https://i.pravatar.cc/60?img=3" alt="Tomasz" class="t-avatar"> | |
| <div class="t-info"> | |
| <span class="t-name">Tomasz Nowicki</span> | |
| <span class="t-role">Właściciel — Restaurant Atelier</span> | |
| </div> | |
| </div> | |
| <div class="t-stars">★★★★★</div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- AWARDS --> | |
| <section class="awards"> | |
| <div class="container"> | |
| <div class="awards-grid"> | |
| <div class="award-item"> | |
| <svg class="award-icon" viewBox="0 0 40 40" fill="none"><path d="M20 4l2.8 8.5H31l-7.1 5.2 2.7 8.5L20 21l-6.6 5.2 2.7-8.5L9 9H17.2z" stroke="#C9A96E" stroke-width="1.2"/></svg> | |
| <span class="award-name">Interior Design Award 2024</span> | |
| </div> | |
| <div class="award-item"> | |
| <svg class="award-icon" viewBox="0 0 40 40" fill="none"><circle cx="20" cy="20" r="16" stroke="#C9A96E" stroke-width="1.2"/><path d="M14 20l4 4 8-8" stroke="#C9A96E" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg> | |
| <span class="award-name">Architizer A+ Award</span> | |
| </div> | |
| <div class="award-item"> | |
| <svg class="award-icon" viewBox="0 0 40 40" fill="none"><rect x="8" y="8" width="24" height="24" rx="2" stroke="#C9A96E" stroke-width="1.2"/><path d="M14 20h12M20 14v12" stroke="#C9A96E" stroke-width="1.5" stroke-linecap="round"/></svg> | |
| <span class="award-name">Polish Interior Design Award</span> | |
| </div> | |
| <div class="award-item"> | |
| <svg class="award-icon" viewBox="0 0 40 40" fill="none"><path d="M20 6C12.3 6 6 12.3 6 20s6.3 14 14 14 14-6.3 14-14S27.7 6 20 6z" stroke="#C9A96E" stroke-width="1.2"/><path d="M15 20.5l3 3 7-7" stroke="#C9A96E" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg> | |
| <span class="award-name">Elle Decoration Top 10</span> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- CONTACT --> | |
| <section class="contact" id="contact"> | |
| <div class="container"> | |
| <div class="contact-grid"> | |
| <div class="contact-info"> | |
| <div class="section-label">Kontakt</div> | |
| <h2 class="section-title">Zacznijmy<br><em>współpracę</em></h2> | |
| <p class="contact-desc">Masz projekt w głowie? Chętnie porozmawiamy o Twoich marzeniach i zmienimy je w rzeczywistość. Pierwsza konsultacja jest bezpłatna.</p> | |
| <div class="contact-details"> | |
| <div class="contact-item"> | |
| <div class="contact-icon"> | |
| <svg width="20" height="20" viewBox="0 0 20 20" fill="none"><path d="M2.5 5.5C2.5 4.4 3.4 3.5 4.5 3.5h11c1.1 0 2 .9 2 2v9c0 1.1-.9 2-2 2h-11c-1.1 0-2-.9-2-2v-9z" stroke="#C9A96E" stroke-width="1.2"/><path d="M2.5 5.5l7.5 5.5 7.5-5.5" stroke="#C9A96E" stroke-width="1.2"/></svg> | |
| </div> | |
| <div> | |
| <span class="contact-label">Email</span> | |
| <span class="contact-value">hello@axiomstudio.pl</span> | |
| </div> | |
| </div> | |
| <div class="contact-item"> | |
| <div class="contact-icon"> | |
| <svg width="20" height="20" viewBox="0 0 20 20" fill="none"><path d="M3 5c0-.6.4-1 1-1h3l1.5 3.5-1.75 1.1A11 11 0 0013 12.25l1.1-1.75L17.5 12v3c0 .6-.4 1-1 1C8.5 16 4 11.5 3 6V5z" stroke="#C9A96E" stroke-width="1.2" stroke-linejoin="round"/></svg> | |
| </div> | |
| <div> | |
| <span class="contact-label">Telefon</span> | |
| <span class="contact-value">+48 22 123 45 67</span> | |
| </div> | |
| </div> | |
| <div class="contact-item"> | |
| <div class="contact-icon"> | |
| <svg width="20" height="20" viewBox="0 0 20 20" fill="none"><path d="M10 2C6.7 2 4 4.7 4 8c0 4.5 6 10 6 10s6-5.5 6-10c0-3.3-2.7-6-6-6z" stroke="#C9A96E" stroke-width="1.2"/><circle cx="10" cy="8" r="2" stroke="#C9A96E" stroke-width="1.2"/></svg> | |
| </div> | |
| <div> | |
| <span class="contact-label">Studio</span> | |
| <span class="contact-value">ul. Nowy Świat 22, Warszawa</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="contact-form-wrap"> | |
| <form class="contact-form" id="contactForm"> | |
| <div class="form-row"> | |
| <div class="form-group"> | |
| <label for="name">Imię i nazwisko</label> | |
| <input type="text" id="name" placeholder="Jan Kowalski" required> | |
| </div> | |
| <div class="form-group"> | |
| <label for="email">Email</label> | |
| <input type="email" id="email" placeholder="jan@example.com" required> | |
| </div> | |
| </div> | |
| <div class="form-group"> | |
| <label for="project">Rodzaj projektu</label> | |
| <select id="project"> | |
| <option value="">Wybierz typ projektu</option> | |
| <option>Mieszkanie / Apartament</option> | |
| <option>Dom jednorodzinny</option> | |
| <option>Rezydencja / Willa</option> | |
| <option>Lokal usługowy / Biuro</option> | |
| <option>Hotel / Aparthotel</option> | |
| </select> | |
| </div> | |
| <div class="form-group"> | |
| <label for="message">Opisz swój projekt</label> | |
| <textarea id="message" rows="4" placeholder="Opowiedz nam o swojej przestrzeni i marzeniach..."></textarea> | |
| </div> | |
| <button type="submit" class="btn-primary full"> | |
| Wyślij wiadomość | |
| <svg width="16" height="16" viewBox="0 0 16 16" fill="none"><path d="M3 8H13M9 4l4 4-4 4" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg> | |
| </button> | |
| </form> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <!-- FOOTER --> | |
| <footer class="footer"> | |
| <div class="container"> | |
| <div class="footer-top"> | |
| <div class="footer-brand"> | |
| <div class="footer-logo"> | |
| <span class="logo-text">AXIOM</span> | |
| <span class="logo-sub">STUDIO</span> | |
| </div> | |
| <p class="footer-tagline">Tworzymy wnętrza, które inspirują do życia.</p> | |
| <div class="footer-social"> | |
| <a href="#" class="social-link" aria-label="Instagram"> | |
| <svg width="18" height="18" viewBox="0 0 24 24" fill="none"><rect x="2" y="2" width="20" height="20" rx="5" stroke="currentColor" stroke-width="1.5"/><circle cx="12" cy="12" r="4" stroke="currentColor" stroke-width="1.5"/><circle cx="17.5" cy="6.5" r="1" fill="currentColor"/></svg> | |
| </a> | |
| <a href="#" class="social-link" aria-label="Pinterest"> | |
| <svg width="18" height="18" viewBox="0 0 24 24" fill="none"><path d="M12 2C6.48 2 2 6.48 2 12c0 4.24 2.65 7.86 6.39 9.29-.09-.78-.17-1.98.04-2.82.18-.76 1.22-5.16 1.22-5.16s-.31-.62-.31-1.55c0-1.46.85-2.55 1.9-2.55.9 0 1.33.67 1.33 1.48 0 .9-.57 2.25-.87 3.5-.25 1.05.52 1.9 1.54 1.9 1.85 0 3.09-2.36 3.09-5.15 0-2.13-1.44-3.62-3.5-3.62-2.39 0-3.79 1.79-3.79 3.64 0 .72.28 1.49.62 1.91.07.08.08.15.06.23l-.23.94c-.04.15-.13.18-.3.11-1.12-.52-1.82-2.17-1.82-3.49 0-2.84 2.06-5.45 5.93-5.45 3.11 0 5.53 2.22 5.53 5.18 0 3.09-1.95 5.57-4.65 5.57-.91 0-1.76-.47-2.05-1.03l-.56 2.09c-.2.78-.75 1.76-1.12 2.36.85.26 1.75.4 2.68.4 5.52 0 10-4.48 10-10S17.52 2 12 2z" stroke="currentColor" stroke-width="1.2"/></svg> | |
| </a> | |
| <a href="#" class="social-link" aria-label="Houzz"> | |
| <svg width="18" height="18" viewBox="0 0 24 24" fill="none"><path d="M12 2L4 8v14h6v-6h4v6h6V8z" stroke="currentColor" stroke-width="1.5" stroke-linejoin="round"/></svg> | |
| </a> | |
| </div> | |
| </div> | |
| <div class="footer-links"> | |
| <div class="footer-col"> | |
| <h4>Studio</h4> | |
| <a href="#about">O Nas</a> | |
| <a href="#portfolio">Portfolio</a> | |
| <a href="#process">Proces</a> | |
| <a href="#contact">Kontakt</a> | |
| </div> | |
| <div class="footer-col"> | |
| <h4>Usługi</h4> | |
| <a href="#">Projektowanie wnętrz</a> | |
| <a href="#">Wizualizacje 3D</a> | |
| <a href="#">Nadzór autorski</a> | |
| <a href="#">Aranżacja mebli</a> | |
| </div> | |
| <div class="footer-col"> | |
| <h4>Kontakt</h4> | |
| <a href="mailto:hello@axiomstudio.pl">hello@axiomstudio.pl</a> | |
| <a href="tel:+48221234567">+48 22 123 45 67</a> | |
| <span>ul. Nowy Świat 22</span> | |
| <span>00-373 Warszawa</span> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="footer-bottom"> | |
| <span>© 2026 AXIOM Studio. Wszelkie prawa zastrzeżone.</span> | |
| <span>Architektura Wnętrz Warszawa</span> | |
| </div> | |
| </div> | |
| </footer> | |
| <script src="script.js"></script> | |
| </body> | |
| </html> |