{"id":182,"date":"2025-06-06T06:59:28","date_gmt":"2025-06-06T06:59:28","guid":{"rendered":"https:\/\/futuresite.it\/?page_id=182"},"modified":"2026-03-12T18:08:39","modified_gmt":"2026-03-12T18:08:39","slug":"web-applications","status":"publish","type":"page","link":"https:\/\/futuresite.it\/it\/web-applications\/","title":{"rendered":"Applicazioni Web"},"content":{"rendered":"<style>\n    @import url('https:\/\/fonts.googleapis.com\/css2?family=Inter:wght@300;400;600;800&display=swap');\n\n    .wa-wrapper {\n        font-family: 'Inter', system-ui, -apple-system, sans-serif;\n        background: #061014;\n        color: #e2e8f0;\n        margin: 0;\n        padding: 0;\n        box-sizing: border-box;\n        overflow-x: hidden;\n        padding-bottom: 200px;\n    }\n\n    .wa-wrapper * {\n        box-sizing: border-box;\n    }\n\n    .wa-wrapper .wa-hero {\n        display: flex;\n        align-items: center;\n        justify-content: space-between;\n        padding: 6rem 5%;\n        min-height: 80vh;\n        position: relative;\n        background: radial-gradient(circle at 10% 20%, rgba(14, 165, 233, 0.1) 0%, transparent 40%),\n            radial-gradient(circle at 90% 80%, rgba(16, 185, 129, 0.1) 0%, transparent 40%);\n    }\n\n    .wa-wrapper .wa-hero::before {\n        content: '';\n        position: absolute;\n        top: 0;\n        left: 0;\n        right: 0;\n        bottom: 0;\n        background: url('data:image\/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MCIgaGVpZ2h0PSI0MCI+CjxyZWN0IHdpZHRoPSI0MCIgaGVpZ2h0PSI0MCIgZmlsbD0ibm9uZSIvPgo8Y2lyY2xlIGN4PSIyMCIgY3k9IjIwIiByPSIxIiBmaWxsPSJyZ2JhKDI1NSwyNTUsMjU1LDAuMDUpIi8+Cjwvc3ZnPg==') repeat;\n        z-index: 1;\n        pointer-events: none;\n    }\n\n    .wa-wrapper .wa-hero-content {\n        flex: 1;\n        max-width: 600px;\n        z-index: 2;\n        animation: waFadeInUp 1s ease-out;\n    }\n\n    .wa-wrapper .wa-title {\n        font-size: 4rem;\n        font-weight: 800;\n        line-height: 1.1;\n        margin-bottom: 1.5rem;\n        color: #ffffff;\n    }\n\n    .wa-wrapper .wa-title .wa-highlight {\n        background: linear-gradient(135deg, #0ea5e9 0%, #10b981 100%);\n        -webkit-background-clip: text;\n        -webkit-text-fill-color: transparent;\n        display: inline-block;\n    }\n\n    .wa-wrapper .wa-description {\n        font-size: 1.125rem;\n        line-height: 1.7;\n        color: #94a3b8;\n        margin-bottom: 2.5rem;\n    }\n\n    .wa-wrapper .wa-cta-group {\n        display: flex;\n        gap: 1rem;\n    }\n\n    .wa-wrapper .wa-btn {\n        padding: 0.875rem 2rem;\n        border-radius: 9999px;\n        font-weight: 600;\n        text-decoration: none;\n        transition: all 0.3s ease;\n        display: inline-flex;\n        align-items: center;\n        justify-content: center;\n    }\n\n    .wa-wrapper .wa-btn-primary {\n        background: linear-gradient(135deg, #0ea5e9 0%, #10b981 100%);\n        color: #ffffff;\n        box-shadow: 0 4px 15px rgba(14, 165, 233, 0.4);\n    }\n\n    .wa-wrapper .wa-btn-primary:hover {\n        box-shadow: 0 6px 20px rgba(16, 185, 129, 0.6);\n        transform: translateY(-2px);\n    }\n\n    .wa-wrapper .wa-btn-secondary {\n        background: rgba(255, 255, 255, 0.05);\n        color: #e2e8f0;\n        border: 1px solid rgba(255, 255, 255, 0.1);\n        backdrop-filter: blur(10px);\n    }\n\n    .wa-wrapper .wa-btn-secondary:hover {\n        background: rgba(255, 255, 255, 0.1);\n        transform: translateY(-2px);\n    }\n\n    .wa-wrapper .wa-hero-image {\n        flex: 1;\n        display: flex;\n        justify-content: center;\n        align-items: center;\n        z-index: 2;\n        animation: waFadeIn 1.5s ease-out;\n        padding-left: 4rem;\n    }\n\n    .wa-wrapper .wa-hero-image img {\n        max-width: 100%;\n        height: auto;\n        border-radius: 20px;\n        box-shadow: 0 0 50px rgba(14, 165, 233, 0.25);\n        border: 1px solid rgba(255, 255, 255, 0.1);\n        transform: perspective(1000px) rotateY(-5deg) translateY(0);\n        transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.2, 1);\n    }\n\n    .wa-wrapper .wa-hero-image img:hover {\n        transform: perspective(1000px) rotateY(0deg) translateY(-10px);\n    }\n\n    .wa-wrapper .wa-tech-section {\n        padding: 5rem 5%;\n        background: #081218;\n        position: relative;\n        z-index: 2;\n        border-top: 1px solid rgba(255, 255, 255, 0.05);\n    }\n\n    .wa-wrapper .wa-subtitle {\n        text-align: center;\n        font-size: 2.5rem;\n        font-weight: 700;\n        margin-bottom: 4rem;\n        color: #ffffff;\n    }\n\n    .wa-wrapper .wa-tech-grid {\n        display: grid;\n        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\n        gap: 2rem;\n        max-width: 1200px;\n        margin: 0 auto;\n    }\n\n    .wa-wrapper .wa-tech-card {\n        background: rgba(255, 255, 255, 0.03);\n        border: 1px solid rgba(255, 255, 255, 0.05);\n        border-radius: 16px;\n        padding: 2.5rem 2rem;\n        backdrop-filter: blur(10px);\n        transition: all 0.4s ease;\n        cursor: pointer;\n        display: flex;\n        flex-direction: column;\n        align-items: flex-start;\n    }\n\n    .wa-wrapper .wa-tech-card:hover {\n        transform: translateY(-10px);\n        background: rgba(255, 255, 255, 0.05);\n        border-color: rgba(16, 185, 129, 0.4);\n        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3), inset 0 0 20px rgba(14, 165, 233, 0.1);\n    }\n\n    .wa-wrapper .wa-tech-icon {\n        font-size: 2.5rem;\n        margin-bottom: 1.5rem;\n        background: linear-gradient(135deg, rgba(14, 165, 233, 0.1), rgba(16, 185, 129, 0.1));\n        border: 1px solid rgba(255, 255, 255, 0.05);\n        width: 60px;\n        height: 60px;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        border-radius: 12px;\n    }\n\n    .wa-wrapper .wa-tech-name {\n        font-size: 1.25rem;\n        font-weight: 600;\n        margin-bottom: 0.75rem;\n        color: #ffffff;\n    }\n\n    .wa-wrapper .wa-tech-desc {\n        color: #94a3b8;\n        line-height: 1.6;\n        font-size: 0.95rem;\n    }\n\n    \/* Animations *\/\n    @keyframes waFadeInUp {\n        from {\n            opacity: 0;\n            transform: translateY(30px);\n        }\n\n        to {\n            opacity: 1;\n            transform: translateY(0);\n        }\n    }\n\n    @keyframes waFadeIn {\n        from {\n            opacity: 0;\n        }\n\n        to {\n            opacity: 1;\n        }\n    }\n\n    \/* Responsive constraints *\/\n    @media (max-width: 900px) {\n        .wa-wrapper .wa-hero {\n            flex-direction: column;\n            text-align: center;\n            padding-top: 4rem;\n        }\n\n        .wa-wrapper .wa-hero-content {\n            margin-bottom: 4rem;\n        }\n\n        .wa-wrapper .wa-cta-group {\n            justify-content: center;\n        }\n\n        .wa-wrapper .wa-title {\n            font-size: 3rem;\n        }\n\n        .wa-wrapper .wa-hero-image {\n            padding-left: 0;\n        }\n    }\n<\/style>\n\n<div class=\"wa-wrapper\">\n    <!-- Hero Section -->\n    <div class=\"wa-hero\">\n        <div class=\"wa-hero-content\">\n            <h1 class=\"wa-title\">Web <span class=\"wa-highlight\">Applications<\/span><\/h1>\n            <p class=\"wa-description\">Discover how custom web applications can streamline your operations, boost\n                innovation, and enhance user experiences. We offer tailored solutions for various industries, addressing\n                unique requirements to drive success.<\/p>\n            <div class=\"wa-cta-group\">\n                <a href=\"#contact\" class=\"wa-btn wa-btn-primary\">Streamline Your Operations<\/a>\n                <a href=\"#technologies\" class=\"wa-btn wa-btn-secondary\">Explore Solutions<\/a>\n            <\/div>\n        <\/div>\n        <div class=\"wa-hero-image\">\n            <img decoding=\"async\" src=\"https:\/\/futuresite.it\/wp-content\/uploads\/2026\/03\/web_apps_hero_1773336397173.webp\"\n                alt=\"High-tech abstract representation of web applications\" \/>\n        <\/div>\n    <\/div>\n\n    <!-- Technologies Section -->\n    <div class=\"wa-tech-section\" id=\"technologies\">\n        <h2 class=\"wa-subtitle\">Built with Powerful Technologies<\/h2>\n        <div class=\"wa-tech-grid\">\n            <div class=\"wa-tech-card\">\n                <div class=\"wa-tech-icon\">\u269b\ufe0f<\/div>\n                <h3 class=\"wa-tech-name\">React UI<\/h3>\n                <p class=\"wa-tech-desc\">Component-driven architecture for building interactive, single-page application\n                    interfaces with maximum reusability.<\/p>\n            <\/div>\n            <div class=\"wa-tech-card\">\n                <div class=\"wa-tech-icon\">\u26a1<\/div>\n                <h3 class=\"wa-tech-name\">Next.js<\/h3>\n                <p class=\"wa-tech-desc\">The modern standard for building blazing fast, SEO-friendly web apps with\n                    server-side rendering capabilities.<\/p>\n            <\/div>\n            <div class=\"wa-tech-card\">\n                <div class=\"wa-tech-icon\">\ud83d\udfe2<\/div>\n                <h3 class=\"wa-tech-name\">Node.js<\/h3>\n                <p class=\"wa-tech-desc\">Asynchronous, event-driven JavaScript runtime built to scale real-time network\n                    capabilities effortlessly.<\/p>\n            <\/div>\n            <div class=\"wa-tech-card\">\n                <div class=\"wa-tech-icon\">\ud83d\udd96<\/div>\n                <h3 class=\"wa-tech-name\">Vue.js<\/h3>\n                <p class=\"wa-tech-desc\">A progressive, versatile framework crafted to build highly adaptable and\n                    performant user interfaces.<\/p>\n            <\/div>\n            <div class=\"wa-tech-card\">\n                <div class=\"wa-tech-icon\">\ud83d\udcf1<\/div>\n                <h3 class=\"wa-tech-name\">Progressive Web Apps (PWA)<\/h3>\n                <p class=\"wa-tech-desc\">Native app-like experiences delivered straight to the browser with offline\n                    support and high speed.<\/p>\n            <\/div>\n            <div class=\"wa-tech-card\">\n                <div class=\"wa-tech-icon\">\ud83d\udcc8<\/div>\n                <h3 class=\"wa-tech-name\">Scalable Backends<\/h3>\n                <p class=\"wa-tech-desc\">Custom API and database architectures built specifically to handle large data\n                    throughput securely.<\/p>\n            <\/div>\n        <\/div>\n    <\/div>\n<\/div>","protected":false},"excerpt":{"rendered":"<p>Web Applications Discover how custom web applications can streamline your operations, boost innovation, and enhance user experiences. We offer tailored solutions for various industries, addressing unique requirements to drive success. Streamline Your Operations Explore Solutions Built with Powerful Technologies \u269b\ufe0f React UI Component-driven architecture for building interactive, single-page application interfaces with maximum reusability. \u26a1 Next.js The modern standard for building blazing fast, SEO-friendly web apps with server-side rendering capabilities. \ud83d\udfe2 Node.js Asynchronous, event-driven JavaScript runtime built to scale real-time network capabilities effortlessly. \ud83d\udd96 Vue.js A progressive, versatile framework crafted to build highly adaptable and performant user interfaces. \ud83d\udcf1 Progressive Web<\/p>","protected":false},"author":1,"featured_media":156,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"template-basic","meta":{"om_disable_all_campaigns":false,"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"class_list":["post-182","page","type-page","status-publish","has-post-thumbnail","hentry"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/futuresite.it\/it\/wp-json\/wp\/v2\/pages\/182","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/futuresite.it\/it\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/futuresite.it\/it\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/futuresite.it\/it\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/futuresite.it\/it\/wp-json\/wp\/v2\/comments?post=182"}],"version-history":[{"count":137,"href":"https:\/\/futuresite.it\/it\/wp-json\/wp\/v2\/pages\/182\/revisions"}],"predecessor-version":[{"id":463,"href":"https:\/\/futuresite.it\/it\/wp-json\/wp\/v2\/pages\/182\/revisions\/463"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/futuresite.it\/it\/wp-json\/wp\/v2\/media\/156"}],"wp:attachment":[{"href":"https:\/\/futuresite.it\/it\/wp-json\/wp\/v2\/media?parent=182"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}