{"id":8,"date":"2026-03-16T19:00:02","date_gmt":"2026-03-16T19:00:02","guid":{"rendered":"https:\/\/jnmwebsolutions.com\/?page_id=8"},"modified":"2026-03-23T17:27:17","modified_gmt":"2026-03-23T17:27:17","slug":"home","status":"publish","type":"page","link":"https:\/\/jnmwebsolutions.com\/","title":{"rendered":"Home"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"8\" class=\"elementor elementor-8\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c76c8d1 e-con-full e-flex e-con e-parent\" data-id=\"c76c8d1\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4e485c8 elementor-widget elementor-widget-html\" data-id=\"4e485c8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div id=\"jnm-clean-square-hero-v40\">\r\n    <div class=\"static-bg-v40\"><\/div>\r\n    \r\n    <div class=\"main-layout-v40\">\r\n        <div class=\"text-side-v40\">\r\n            <div class=\"status-badge-v40\">\r\n                <span class=\"static-dot-v40\"><\/span>\r\n                SYSTEM_v3_PRO_ACTIVE\r\n            <\/div>\r\n            \r\n            <h5 class=\"mega-name-v40\">\r\n                <span class=\"cyan-stroke-v40\">Jnm Web Solutions<\/span>\r\n            <\/h5>\r\n            \r\n            <h2 class=\"bold-tagline-v40\">Building Digital Legacy With Modern Tech.<\/h2>\r\n            \r\n            <div class=\"sub-description-v40\">\r\n                <p>Freelance WordPress Expert specializing in high-performance e-commerce solutions and immersive digital experiences. Let's transform your vision into a pixel-perfect reality.<\/p>\r\n            <\/div>\r\n            \r\n            <div class=\"button-row-v40\">\r\n                <a href=\"https:\/\/wa.link\/w15vrh\" class=\"btn-primary-v40\">START PROJECT<\/a>\r\n                <a href=\"https:\/\/wa.link\/w15vrh\" class=\"btn-secondary-v40\">CONTACT ME<\/a>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"visual-side-v40\">\r\n            <div class=\"floating-square-frame\">\r\n                <img decoding=\"async\" src=\"https:\/\/jnmwebsolutions.com\/wp-content\/uploads\/2026\/03\/Tosca_Yellow_Modern_Simple_Monogram_Sport_Logo-removebg-preview.png\" alt=\"JNM Portrait\">\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/div>\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Syncopate:wght@700&family=Space+Grotesk:wght@300;500;700&display=swap');\r\n\r\n#jnm-clean-square-hero-v40 {\r\n    position: relative;\r\n    width: 100%;\r\n    min-height: 100vh;\r\n    background: #020617;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    overflow: hidden;\r\n    font-family: 'Space Grotesk', sans-serif;\r\n    color: #fff;\r\n    padding: 60px 20px;\r\n}\r\n\r\n\/* Static Background Glows *\/\r\n.static-bg-v40 {\r\n    position: absolute;\r\n    inset: 0;\r\n    background: \r\n        radial-gradient(circle at 5% 5%, rgba(56, 189, 248, 0.08) 0%, transparent 40%),\r\n        radial-gradient(circle at 95% 95%, rgba(0, 255, 65, 0.05) 0%, transparent 40%);\r\n}\r\n\r\n.main-layout-v40 {\r\n    position: relative;\r\n    z-index: 10;\r\n    width: 90%;\r\n    max-width: 1250px;\r\n    display: flex;\r\n    justify-content: space-between;\r\n    align-items: center;\r\n    gap: 50px;\r\n}\r\n\r\n\/* Text Section Styles *\/\r\n.text-side-v40 { flex: 1.2; }\r\n.status-badge-v40 { color: #38bdf8; letter-spacing: 5px; font-size: 11px; font-weight: 700; margin-bottom: 20px; display: flex; align-items: center; gap: 10px; }\r\n.static-dot-v40 { width: 8px; height: 8px; background: #00ff41; border-radius: 50%; box-shadow: 0 0 10px #00ff41; }\r\n\r\n.mega-name-v40 { font-family: 'Syncopate', sans-serif; font-size: clamp(1.8rem, 4vw, 3.2rem); margin-bottom: 10px; }\r\n.cyan-stroke-v40 { color: transparent; -webkit-text-stroke: 1.2px #38bdf8; }\r\n.bold-tagline-v40 { font-size: clamp(1.5rem, 3.5vw, 2.8rem); font-weight: 700; line-height: 1.2; margin-bottom: 25px; }\r\n\r\n.sub-description-v40 p { color: #94a3b8; font-size: 18px; line-height: 1.6; max-width: 580px; margin-bottom: 40px; }\r\n\r\n\/* Buttons *\/\r\n.button-row-v40 { display: flex; gap: 15px; }\r\n.btn-primary-v40, .btn-secondary-v40 {\r\n    padding: 18px 35px;\r\n    text-decoration: none;\r\n    font-weight: 800;\r\n    font-size: 13px;\r\n    letter-spacing: 1px;\r\n    transition: 0.3s;\r\n    text-align: center;\r\n    border-radius: 4px;\r\n}\r\n.btn-primary-v40 { background: #38bdf8; color: #000; border: 1px solid #38bdf8; }\r\n.btn-primary-v40:hover { background: #00ff41; border-color: #00ff41; transform: translateY(-3px); }\r\n\r\n.btn-secondary-v40 { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,0.2); }\r\n.btn-secondary-v40:hover { border-color: #38bdf8; color: #38bdf8; background: rgba(56, 189, 248, 0.05); transform: translateY(-3px); }\r\n\r\n\/* \u23f9\ufe0f Gentle Floating Square Frame *\/\r\n.visual-side-v40 { flex: 0.8; display: flex; justify-content: center; }\r\n\r\n.floating-square-frame {\r\n    width: 320px;\r\n    height: 320px;\r\n    border: 2px solid rgba(56, 189, 248, 0.4);\r\n    background: rgba(255, 255, 255, 0.02);\r\n    position: relative;\r\n    box-shadow: 0 20px 60px rgba(0,0,0,0.4);\r\n    \/* \u0d0e\u0d2c\u0d57\u0d1f\u0d4d\u0d1f\u0d4d \u0d38\u0d46\u0d15\u0d4d\u0d37\u0d28\u0d3f\u0d32\u0d46 \u0d2a\u0d4b\u0d32\u0d46 \u0d28\u0d47\u0d30\u0d3f\u0d2f \u0d06\u0d1f\u0d4d\u0d1f\u0d02 *\/\r\n    animation: gentleFloat 5s ease-in-out infinite;\r\n}\r\n\r\n.floating-square-frame img {\r\n    width: 100%;\r\n    height: 100%;\r\n    object-fit: cover;\r\n    display: block;\r\n}\r\n\r\n\/* Floating Keyframes *\/\r\n@keyframes gentleFloat {\r\n    0%, 100% { transform: translateY(0) rotate(0deg); }\r\n    50% { transform: translateY(-15px) rotate(2deg); }\r\n}\r\n\r\n\/* \ud83d\udcf1 MOBILE RESPONSIVE QUERIES *\/\r\n@media (max-width: 1024px) {\r\n    .main-layout-v40 { flex-direction: column-reverse; text-align: center; gap: 40px; }\r\n    .text-side-v40 { display: flex; flex-direction: column; align-items: center; }\r\n}\r\n\r\n@media (max-width: 768px) {\r\n    .mega-name-v40 { font-size: 1.8rem; }\r\n    .bold-tagline-v40 { font-size: 1.6rem; }\r\n    .button-row-v40 { flex-direction: column; width: 100%; max-width: 300px; }\r\n    .floating-square-frame { width: 260px; height: 260px; }\r\n}\r\n\r\n@media (max-width: 480px) {\r\n    .mega-name-v40 { font-size: 1.4rem; }\r\n    .bold-tagline-v40 { font-size: 1.3rem; }\r\n    .floating-square-frame { width: 220px; height: 220px; }\r\n}\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-207e39a e-con-full e-flex e-con e-parent\" data-id=\"207e39a\" data-element_type=\"container\" data-e-type=\"container\" id=\"Services\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9a601a8 elementor-widget elementor-widget-html\" data-id=\"9a601a8\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"#Services\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section id=\"jnm-services-wide-3d-new\">\r\n    <div class=\"services-container-new\">\r\n        \r\n        <div class=\"services-header-new\">\r\n            <h2 class=\"services-main-title-new\">MY <span class=\"cyan-accent-new\">SERVICES<\/span><\/h2>\r\n            <div class=\"header-line-new\"><\/div>\r\n        <\/div>\r\n\r\n        <div class=\"services-grid-new\">\r\n            \r\n            <div class=\"service-card-wrapper-new\">\r\n                <div class=\"service-tilt-card-new jnm-tilt-card\">\r\n                    <div class=\"service-icon-new cyan-icon\">\r\n                        <i class=\"fas fa-layer-group\"><\/i> <\/div>\r\n                    <div class=\"pro-tag-mini-new\">\r\n                        <span class=\"dot-new\"><\/span> LANDING_PAGE\r\n                    <\/div>\r\n                    <h3 class=\"service-card-title-new\">Landing <br><span class=\"cyan-text-new\">Page<\/span><\/h3>\r\n                    \r\n                    <div class=\"service-content-editor-new\">\r\n                        <p><span class=\"cyan-arrow-new\">\u2192<\/span> High Conversion Layout<\/p>\r\n                        <p><span class=\"cyan-arrow-new\">\u2192<\/span> Fast Loading Speed<\/p>\r\n                        <p><span class=\"cyan-arrow-new\">\u2192<\/span> Mobile Responsive<\/p>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <div class=\"service-card-wrapper-new\">\r\n                <div class=\"service-tilt-card-new jnm-tilt-card\">\r\n                    <div class=\"service-icon-new green-icon\">\r\n                        <i class=\"fas fa-user-circle\"><\/i> <\/div>\r\n                    <div class=\"pro-tag-mini-new\">\r\n                        <span class=\"dot-new\"><\/span> PERSONAL_WEBSITE\r\n                    <\/div>\r\n                    <h3 class=\"service-card-title-new\">Personal <br><span class=\"cyan-text-new\">Website<\/span><\/h3>\r\n                    \r\n                    <div class=\"service-content-editor-new\">\r\n                        <p><span class=\"green-arrow-new\">\u2192<\/span> Digital Portfolio<\/p>\r\n                        <p><span class=\"green-arrow-new\">\u2192<\/span> Personal Branding<\/p>\r\n                        <p><span class=\"green-arrow-new\">\u2192<\/span> Social Media Integration<\/p>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <div class=\"service-card-wrapper-new\">\r\n                <div class=\"service-tilt-card-new jnm-tilt-card\">\r\n                    <div class=\"service-icon-new blue-icon\">\r\n                        <i class=\"fas fa-briefcase\"><\/i> <\/div>\r\n                    <div class=\"pro-tag-mini-new\">\r\n                        <span class=\"dot-new\"><\/span> BUSINESS_WEBSITE\r\n                    <\/div>\r\n                    <h3 class=\"service-card-title-new\">Business <br><span class=\"cyan-text-new\">Website<\/span><\/h3>\r\n                    \r\n                    <div class=\"service-content-editor-new\">\r\n                        <p><span class=\"blue-arrow-new\">\u2192<\/span> Corporate Identity<\/p>\r\n                        <p><span class=\"blue-arrow-new\">\u2192<\/span> Trust Architecture<\/p>\r\n                        <p><span class=\"blue-arrow-new\">\u2192<\/span> Lead Generation<\/p>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <div class=\"service-card-wrapper-new\">\r\n                <div class=\"service-tilt-card-new jnm-tilt-card\">\r\n                    <div class=\"service-icon-new magenta-icon\">\r\n                        <i class=\"fas fa-shopping-cart\"><\/i> <\/div>\r\n                    <div class=\"pro-tag-mini-new\">\r\n                        <span class=\"dot-new\"><\/span> ECOMMERCE_PRO\r\n                    <\/div>\r\n                    <h3 class=\"service-card-title-new\">E-Commerce <br><span class=\"cyan-text-new\">Website<\/span><\/h3>\r\n                    \r\n                    <div class=\"service-content-editor-new\">\r\n                        <p><span class=\"magenta-arrow-new\">\u2192<\/span> Secure Checkout Flow<\/p>\r\n                        <p><span class=\"magenta-arrow-new\">\u2192<\/span> Product Management<\/p>\r\n                        <p><span class=\"magenta-arrow-new\">\u2192<\/span> Payment Integration<\/p>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.0.0\/css\/all.min.css\">\r\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/vanilla-tilt\/1.8.1\/vanilla-tilt.min.js\"><\/script>\r\n\r\n<script>\r\n    \/\/ Initializing the 3D Tilt Effect\r\n    VanillaTilt.init(document.querySelectorAll(\".jnm-tilt-card\"), {\r\n        max: 8,\r\n        speed: 400,\r\n        glare: true,\r\n        \"max-glare\": 0.2,\r\n        perspective: 1000,\r\n        scale: 1.01\r\n    });\r\n<\/script>\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Syncopate:wght@700&family=Space+Grotesk:wght@300;400;600;700&display=swap');\r\n\r\n#jnm-services-wide-3d-new {\r\n    background: #020617; \/* Deep Midnight Blue from About section *\/\r\n    padding: 120px 5%;\r\n    color: #fff;\r\n    font-family: 'Space Grotesk', sans-serif;\r\n    overflow: hidden;\r\n}\r\n\r\n.services-container-new {\r\n    max-width: 1400px;\r\n    margin: 0 auto;\r\n}\r\n\r\n\/* Header Styles (Same as About section) *\/\r\n.services-header-new { text-align: center; margin-bottom: 90px; }\r\n.services-main-title-new { font-family: 'Syncopate', sans-serif; font-size: clamp(2rem, 5vw, 2.8rem); letter-spacing: -1px; }\r\n.cyan-accent-new { color: #38bdf8; }\r\n.header-line-new { width: 70px; height: 2px; background: #00ff41; margin: 20px auto 0; }\r\n\r\n\/* Grid Layout (4 columns for desktop) *\/\r\n.services-grid-new {\r\n    display: grid;\r\n    grid-template-columns: repeat(4, 1fr);\r\n    gap: 30px;\r\n}\r\n\r\n.service-card-wrapper-new { perspective: 1000px; }\r\n\r\n\/* 3D Tilt Card Style (About image border style) *\/\r\n.service-tilt-card-new {\r\n    background: linear-gradient(145deg, rgba(15, 23, 42, 1), rgba(2, 6, 23, 1));\r\n    border: 1px solid rgba(0, 255, 65, 0.15);\r\n    border-radius: 35px; \/* Same border radius as About image *\/\r\n    padding: 50px 30px;\r\n    height: 100%;\r\n    position: relative;\r\n    transform-style: preserve-3d;\r\n    cursor: pointer;\r\n    transition: border 0.3s;\r\n    box-shadow: 0 10px 30px rgba(0,0,0,0.3);\r\n}\r\n\r\n.service-tilt-card-new:hover {\r\n    border-color: #38bdf8; \/* Hover color change *\/\r\n}\r\n\r\n\/* Card Content: Icons *\/\r\n.service-icon-new {\r\n    font-size: 35px;\r\n    margin-bottom: 30px;\r\n    transform: translateZ(40px); \/* 3D effect *\/\r\n}\r\n\r\n\/* \u0d07\u0d2e\u0d47\u0d1c\u0d3f\u0d32\u0d46 \u0d2a\u0d4b\u0d32\u0d46\u0d2f\u0d41\u0d33\u0d4d\u0d33 \u0d13\u0d30\u0d4b \u0d10\u0d15\u0d4d\u0d15\u0d7a \u0d15\u0d33\u0d31\u0d41\u0d15\u0d33\u0d41\u0d02 *\/\r\n.cyan-icon { color: #38bdf8; }\r\n.green-icon { color: #00ff41; }\r\n.blue-icon { color: #00a3e0; }\r\n.magenta-icon { color: #eb008b; }\r\n\r\n\/* Pro Tag *\/\r\n.pro-tag-mini-new { \r\n    color: #38bdf8; \r\n    font-family: 'Syncopate', sans-serif; \r\n    font-size: 10px; \r\n    letter-spacing: 2px; \r\n    margin-bottom: 20px; \r\n    display: flex; \r\n    align-items: center; \r\n    gap: 8px; \r\n}\r\n\r\n.dot-new { width: 6px; height: 6px; background: #00ff41; border-radius: 50%; box-shadow: 0 0 8px #00ff41; }\r\n\r\n\/* Card Title (About Title style but smaller) *\/\r\n.service-card-title-new { \r\n    font-family: 'Syncopate', sans-serif; \r\n    font-size: 1.5rem; \r\n    line-height: 1.1; \r\n    margin-bottom: 25px; \r\n    letter-spacing: -1px;\r\n    transform: translateZ(30px);\r\n}\r\n\r\n.cyan-text-new { color: #38bdf8; }\r\n\r\n\/* Content Editor Side (\u0d07\u0d2e\u0d47\u0d1c\u0d3f\u0d32\u0d46\u0d2a\u0d4d\u0d2a\u0d4b\u0d32\u0d46\u0d2f\u0d41\u0d33\u0d4d\u0d33 \u0d32\u0d3f\u0d38\u0d4d\u0d31\u0d4d\u0d31\u0d4d \u0d38\u0d4d\u0d31\u0d4d\u0d31\u0d48\u0d7d) *\/\r\n.service-content-editor-new { \r\n    color: #94a3b8; \r\n    font-size: 16px; \r\n    line-height: 1.8; \r\n    transform: translateZ(20px);\r\n}\r\n\r\n.service-content-editor-new p { margin: 0; padding: 5px 0; display: flex; align-items: center; gap: 10px; }\r\n\r\n\/* \u0d07\u0d2e\u0d47\u0d1c\u0d3f\u0d32\u0d46\u0d2a\u0d4d\u0d2a\u0d4b\u0d32\u0d46\u0d2f\u0d41\u0d33\u0d4d\u0d33 \u0d13\u0d30\u0d4b \u0d15\u0d33\u0d31\u0d3f\u0d32\u0d46\u0d2f\u0d41\u0d02 \u0d05\u0d2e\u0d4d\u0d2a\u0d41\u0d15\u0d7e *\/\r\n.cyan-arrow-new { color: #38bdf8; }\r\n.green-arrow-new { color: #00ff41; }\r\n.blue-arrow-new { color: #00a3e0; }\r\n.magenta-arrow-new { color: #eb008b; }\r\n\r\n\/* --- Responsive Layouts --- *\/\r\n\r\n@media (max-width: 1200px) {\r\n    .services-grid-new {\r\n        grid-template-columns: repeat(2, 1fr); \/* 2 cards on Tablets\/laptops *\/\r\n    }\r\n}\r\n\r\n@media (max-width: 768px) {\r\n    #jnm-services-wide-3d-new {\r\n        padding: 80px 5%;\r\n    }\r\n    \r\n    .services-grid-new {\r\n        grid-template-columns: 1fr; \/* 1 card on Mobile *\/\r\n        gap: 25px;\r\n    }\r\n\r\n    .service-main-title-new {\r\n        font-size: 2.2rem;\r\n    }\r\n\r\n    .service-tilt-card-new {\r\n        padding: 40px 25px;\r\n    }\r\n\r\n    .service-card-title-new {\r\n        font-size: 1.3rem;\r\n    }\r\n}\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-f205575 e-con-full e-flex e-con e-parent\" data-id=\"f205575\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-694e728 elementor-widget elementor-widget-html\" data-id=\"694e728\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section id=\"jnm-about-wide-3d\">\r\n    <div class=\"about-container\">\r\n        \r\n        <div class=\"about-header\">\r\n            <h2 class=\"about-main-title\">OUR <span class=\"cyan-accent\">ABOUT<\/span><\/h2>\r\n            <div class=\"header-line\"><\/div>\r\n        <\/div>\r\n\r\n        <div class=\"about-flex\">\r\n            <div class=\"about-img-box-wrapper\">\r\n                <div class=\"img-gradient-border jnm-tilt-card\">\r\n                    <img decoding=\"async\" src=\"https:\/\/jnmwebsolutions.com\/wp-content\/uploads\/2026\/03\/stocksnap-wordpress-923188_640.jpg\" alt=\"JNM Solutions\">\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <div class=\"about-content\">\r\n                <div class=\"pro-tag\">\r\n                    <span class=\"dot\"><\/span> PRO_DEVELOPER_MODE\r\n                <\/div>\r\n                \r\n                <h3 class=\"about-title\">\r\n                    TRANSFORMING VISION <br>\r\n                    INTO <span class=\"cyan-text\">DIGITAL<\/span> <br>\r\n                    <span class=\"cyan-text\">MASTERPIECES.<\/span>\r\n                <\/h3>\r\n\r\n                <p class=\"about-desc\">\r\n                    I am a specialized Freelance Web Developer and the founder of JNM Web Solutions. \r\n                    I focus on building high-conversion e-commerce platforms and professional business \r\n                    websites that aren't just visually stunning, but technically superior.\r\n                <\/p>\r\n\r\n                <a href=\"#about\" class=\"about-btn\">ABOUT ME<\/a>\r\n            <\/div>\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/vanilla-tilt\/1.8.1\/vanilla-tilt.min.js\"><\/script>\r\n<script>\r\n    \/\/ Desktop-\u0d7d \u0d2e\u0d3e\u0d24\u0d4d\u0d30\u0d02 Tilt \u0d35\u0d7c\u0d15\u0d4d\u0d15\u0d4d \u0d1a\u0d46\u0d2f\u0d4d\u0d24\u0d3e\u0d7d \u0d2e\u0d24\u0d3f, \u0d2e\u0d4a\u0d2c\u0d48\u0d32\u0d3f\u0d7d \u0d35\u0d32\u0d4d\u0d32\u0d3e\u0d24\u0d46 \u0d1a\u0d46\u0d30\u0d3f\u0d2f\u0d41\u0d28\u0d4d\u0d28\u0d24\u0d4d \u0d12\u0d34\u0d3f\u0d35\u0d3e\u0d15\u0d4d\u0d15\u0d3e\u0d02\r\n    if (window.innerWidth > 768) {\r\n        VanillaTilt.init(document.querySelectorAll(\".jnm-tilt-card\"), {\r\n            max: 8,\r\n            speed: 400,\r\n            glare: true,\r\n            \"max-glare\": 0.3,\r\n            perspective: 1200,\r\n            scale: 1.01\r\n        });\r\n    }\r\n<\/script>\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Syncopate:wght@700&family=Space+Grotesk:wght@300;400;600;700&display=swap');\r\n\r\n#jnm-about-wide-3d {\r\n    background: #020617;\r\n    padding: 100px 5%;\r\n    color: #fff;\r\n    font-family: 'Space Grotesk', sans-serif;\r\n    overflow: hidden;\r\n}\r\n\r\n.about-container {\r\n    max-width: 1400px;\r\n    margin: 0 auto;\r\n}\r\n\r\n.about-header { text-align: center; margin-bottom: 70px; }\r\n.about-main-title { font-family: 'Syncopate', sans-serif; font-size: clamp(1.8rem, 5vw, 2.8rem); letter-spacing: -1px; }\r\n.cyan-accent { color: #38bdf8; }\r\n.header-line { width: 70px; height: 2px; background: #00ff41; margin: 20px auto 0; }\r\n\r\n.about-flex {\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 60px;\r\n    margin: 0 auto;\r\n}\r\n\r\n\/* Image Box Wrapper *\/\r\n.about-img-box-wrapper {\r\n    flex: 1.5;\r\n    perspective: 1200px;\r\n}\r\n\r\n.img-gradient-border {\r\n    position: relative;\r\n    padding: 12px;\r\n    border-radius: 35px;\r\n    border: 1px solid rgba(0, 255, 65, 0.2);\r\n    background: linear-gradient(145deg, rgba(15, 23, 42, 1), rgba(2, 6, 23, 1));\r\n    transform-style: preserve-3d;\r\n    cursor: pointer;\r\n}\r\n\r\n.img-gradient-border img {\r\n    width: 100%;\r\n    height: 450px;\r\n    border-radius: 25px;\r\n    display: block;\r\n    object-fit: cover;\r\n    transform: translateZ(30px);\r\n}\r\n\r\n\/* Content Side *\/\r\n.about-content { flex: 1; }\r\n.pro-tag { color: #38bdf8; font-family: 'Syncopate', sans-serif; font-size: 11px; letter-spacing: 3px; margin-bottom: 20px; display: flex; align-items: center; gap: 10px; }\r\n.dot { width: 8px; height: 8px; background: #00ff41; border-radius: 50%; box-shadow: 0 0 10px #00ff41; }\r\n.about-title { font-family: 'Syncopate', sans-serif; font-size: clamp(1.5rem, 4vw, 2.5rem); line-height: 1.1; margin-bottom: 25px; letter-spacing: -1px; }\r\n.cyan-text { color: #38bdf8; }\r\n.about-desc { color: #94a3b8; font-size: 16px; line-height: 1.7; margin-bottom: 35px; max-width: 600px; }\r\n\r\n.about-btn { \r\n    display: inline-block; \r\n    padding: 15px 40px; \r\n    border: 1px solid rgba(255,255,255,0.2); \r\n    color: #00ff41; \r\n    text-decoration: none; \r\n    font-family: 'Syncopate', sans-serif; \r\n    font-size: 11px; \r\n    letter-spacing: 2px; \r\n    transition: 0.3s; \r\n    border-radius: 4px;\r\n}\r\n.about-btn:hover { background: #00ff41; color: #000; box-shadow: 0 0 20px rgba(0, 255, 65, 0.4); }\r\n\r\n\/* --- \ud83d\udcf1 MOBILE RESPONSIVE QUERIES --- *\/\r\n\r\n@media (max-width: 1100px) {\r\n    .about-flex { gap: 40px; }\r\n    .img-gradient-border img { height: 380px; }\r\n}\r\n\r\n@media (max-width: 991px) {\r\n    .about-flex {\r\n        flex-direction: column; \/* Stack image and text *\/\r\n        text-align: center;\r\n    }\r\n\r\n    .about-img-box-wrapper {\r\n        width: 100%;\r\n        max-width: 600px; \/* \u0d35\u0d32\u0d4d\u0d32\u0d3e\u0d24\u0d46 \u0d35\u0d32\u0d41\u0d24\u0d3e\u0d15\u0d3e\u0d24\u0d3f\u0d30\u0d3f\u0d15\u0d4d\u0d15\u0d3e\u0d7b *\/\r\n    }\r\n\r\n    .about-content {\r\n        display: flex;\r\n        flex-direction: column;\r\n        align-items: center;\r\n    }\r\n\r\n    .pro-tag { justify-content: center; }\r\n    \r\n    .about-desc { margin-left: auto; margin-right: auto; }\r\n}\r\n\r\n@media (max-width: 768px) {\r\n    #jnm-about-wide-3d { padding: 70px 5%; }\r\n    .about-header { margin-bottom: 50px; }\r\n    .img-gradient-border { border-radius: 25px; padding: 8px; }\r\n    .img-gradient-border img { height: 300px; border-radius: 18px; }\r\n    .about-title { letter-spacing: 0; }\r\n}\r\n\r\n@media (max-width: 480px) {\r\n    .img-gradient-border img { height: 250px; }\r\n    .about-btn { width: 100%; box-sizing: border-box; }\r\n}\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-2a1e2e3 e-con-full e-flex e-con e-parent\" data-id=\"2a1e2e3\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3769ad5 elementor-widget elementor-widget-html\" data-id=\"3769ad5\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section id=\"jnm-why-choose-me-minimal\">\r\n    <div class=\"features-container\">\r\n        \r\n        <div class=\"features-header\">\r\n            <h2 class=\"feature-title\">WHY CHOOSE <span class=\"blue-accent\">ME?<\/span><\/h2>\r\n            <div class=\"line-v11\"><\/div>\r\n        <\/div>\r\n\r\n        <div class=\"features-grid\">\r\n            \r\n            <div class=\"feature-card\">\r\n                <div class=\"f-icon\">\r\n                    <svg viewBox=\"0 0 24 24\" width=\"32\" height=\"32\" stroke=\"#00ff41\" stroke-width=\"2\" fill=\"none\"><path d=\"M13 2L3 14h9l-1 8 10-12h-9l1-8z\"><\/path><\/svg>\r\n                <\/div>\r\n                <h3>Lightning Fast<\/h3>\r\n                <p>I build websites optimized for speed, ensuring a smooth experience for your users and better rankings on Google.<\/p>\r\n                <div class=\"card-glow\"><\/div>\r\n            <\/div>\r\n\r\n            <div class=\"feature-card\">\r\n                <div class=\"f-icon\">\r\n                    <svg viewBox=\"0 0 24 24\" width=\"32\" height=\"32\" stroke=\"#38bdf8\" stroke-width=\"2\" fill=\"none\"><circle cx=\"11\" cy=\"11\" r=\"8\"><\/circle><line x1=\"21\" y1=\"21\" x2=\"16.65\" y2=\"16.65\"><\/line><\/svg>\r\n                <\/div>\r\n                <h3>SEO Optimized<\/h3>\r\n                <p>Your website will be built with search engines in mind, making it easier for potential clients to find you online.<\/p>\r\n                <div class=\"card-glow\"><\/div>\r\n            <\/div>\r\n\r\n            <div class=\"feature-card\">\r\n                <div class=\"f-icon\">\r\n                    <svg viewBox=\"0 0 24 24\" width=\"32\" height=\"32\" stroke=\"#00ff41\" stroke-width=\"2\" fill=\"none\"><rect x=\"3\" y=\"11\" width=\"18\" height=\"11\" rx=\"2\" ry=\"2\"><\/rect><path d=\"M7 11V7a5 5 0 0 1 10 0v4\"><\/path><\/svg>\r\n                <\/div>\r\n                <h3>Secure & Reliable<\/h3>\r\n                <p>Security is my priority. I implement the latest safety standards to keep your data and your customers safe.<\/p>\r\n                <div class=\"card-glow\"><\/div>\r\n            <\/div>\r\n\r\n            <div class=\"feature-card\">\r\n                <div class=\"f-icon\">\r\n                    <svg viewBox=\"0 0 24 24\" width=\"32\" height=\"32\" stroke=\"#38bdf8\" stroke-width=\"2\" fill=\"none\"><path d=\"M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z\"><\/path><\/svg>\r\n                <\/div>\r\n                <h3>Dedicated Support<\/h3>\r\n                <p>I don't just build and leave. I provide ongoing support to ensure your business continues to grow online.<\/p>\r\n                <div class=\"card-glow\"><\/div>\r\n            <\/div>\r\n\r\n        <\/div>\r\n    <\/div>\r\n<\/section>\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Syncopate:wght@700&family=Space+Grotesk:wght@400;600&display=swap');\r\n\r\n#jnm-why-choose-me-minimal {\r\n    background: #020617;\r\n    padding: 100px 8%;\r\n    color: #fff;\r\n    font-family: 'Space Grotesk', sans-serif;\r\n}\r\n\r\n.features-header {\r\n    text-align: center;\r\n    margin-bottom: 70px;\r\n}\r\n\r\n.feature-title {\r\n    font-family: 'Syncopate', sans-serif;\r\n    font-size: 2.5rem;\r\n    letter-spacing: -1px;\r\n    margin: 0;\r\n}\r\n\r\n.blue-accent { color: #38bdf8; }\r\n\r\n.line-v11 {\r\n    width: 60px;\r\n    height: 2px;\r\n    background: #00ff41;\r\n    margin: 25px auto 0;\r\n}\r\n\r\n.features-grid {\r\n    display: grid;\r\n    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));\r\n    gap: 30px;\r\n}\r\n\r\n.feature-card {\r\n    background: rgba(255, 255, 255, 0.02);\r\n    border: 1px solid rgba(255, 255, 255, 0.06);\r\n    padding: 45px 35px;\r\n    border-radius: 25px;\r\n    transition: all 0.4s ease;\r\n    position: relative;\r\n    overflow: hidden;\r\n    cursor: default;\r\n}\r\n\r\n.feature-card:hover {\r\n    background: rgba(255, 255, 255, 0.04);\r\n    border-color: #00ff41;\r\n    transform: translateY(-10px);\r\n}\r\n\r\n.f-icon { margin-bottom: 25px; }\r\n\r\n.feature-card h3 {\r\n    font-size: 22px;\r\n    margin-bottom: 15px;\r\n    font-weight: 700;\r\n}\r\n\r\n.feature-card p {\r\n    color: #94a3b8;\r\n    font-size: 15px;\r\n    line-height: 1.7;\r\n}\r\n\r\n.card-glow {\r\n    position: absolute;\r\n    top: 0; left: -100%;\r\n    width: 100%; height: 100%;\r\n    background: linear-gradient(90deg, transparent, rgba(56, 189, 248, 0.05), transparent);\r\n    transition: 0.6s;\r\n}\r\n\r\n.feature-card:hover .card-glow { left: 100%; }\r\n\r\n@media (max-width: 768px) {\r\n    .feature-title { font-size: 1.8rem; }\r\n}\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3ffbf1f e-con-full e-flex e-con e-parent\" data-id=\"3ffbf1f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-06f4d07 elementor-widget elementor-widget-html\" data-id=\"06f4d07\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<section id=\"jnm-contact-vfinal\">\r\n    <div class=\"contact-container\">\r\n        \r\n        <div class=\"contact-info\">\r\n            <h2 class=\"contact-title\">LET'S <span class=\"green-text\">TALK.<\/span><\/h2>\r\n            <p class=\"contact-sub\">Have a project in mind? Reach out and let's build something exceptional together.<\/p>\r\n            \r\n            <div class=\"info-items\">\r\n                <div class=\"item\">\r\n                    <div class=\"icon-box\">\u2709<\/div>\r\n                    <div class=\"text\">\r\n                        <h4>Email Me<\/h4>\r\n                        <p>hello@jnmwebsolutions.com<\/p>\r\n                    <\/div>\r\n                <\/div>\r\n\r\n                <div class=\"item\">\r\n                    <div class=\"icon-box\">\ud83d\udccd<\/div>\r\n                    <div class=\"text\">\r\n                        <h4>Location<\/h4>\r\n                        <p>Kochi, Panangad<\/p>\r\n                        <p class=\"brand-sub\">JNM Web Solutions<\/p>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n\r\n            <div class=\"whatsapp-box\">\r\n                <a href=\"https:\/\/wa.link\/w15vrh\" class=\"wa-link\">\r\n                    <span class=\"wa-icon\">\ud83d\udcac<\/span> CHAT ON WHATSAPP\r\n                <\/a>\r\n            <\/div>\r\n        <\/div>\r\n\r\n        <div class=\"contact-form-wrapper\">\r\n            <form class=\"jnm-form\">\r\n                <div class=\"input-group\">\r\n                    <input type=\"text\" placeholder=\"Full Name\" required>\r\n                <\/div>\r\n                <div class=\"input-group\">\r\n                    <input type=\"tel\" placeholder=\"Mobile Number\" required>\r\n                <\/div>\r\n                <div class=\"input-group\">\r\n                    <input type=\"email\" placeholder=\"Email Address\" required>\r\n                <\/div>\r\n                <div class=\"input-group\">\r\n                    <textarea placeholder=\"Your Requirement (Explain your project...)\" rows=\"5\" required><\/textarea>\r\n                <\/div>\r\n                <button type=\"submit\" class=\"submit-btn\">\r\n                    SEND MESSAGE\r\n                    <span class=\"btn-arrow\">\u2192<\/span>\r\n                <\/button>\r\n            <\/form>\r\n        <\/div>\r\n\r\n    <\/div>\r\n<\/section>\r\n\r\n<style>\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Syncopate:wght@700&family=Space+Grotesk:wght@400;600&display=swap');\r\n\r\n#jnm-contact-vfinal {\r\n    background: #020617;\r\n    padding: 100px 5%;\r\n    color: #fff;\r\n    font-family: 'Space Grotesk', sans-serif;\r\n    overflow: hidden;\r\n}\r\n\r\n.contact-container {\r\n    max-width: 1200px;\r\n    margin: 0 auto;\r\n    display: flex;\r\n    gap: 80px;\r\n    align-items: center; \/* Vertically center aligned *\/\r\n}\r\n\r\n.contact-info { flex: 1; }\r\n\r\n.contact-title {\r\n    font-family: 'Syncopate', sans-serif;\r\n    font-size: clamp(2rem, 5vw, 3rem);\r\n    margin-bottom: 20px;\r\n    letter-spacing: -2px;\r\n}\r\n\r\n.green-text { color: #00ff41; }\r\n\r\n.contact-sub {\r\n    color: #94a3b8;\r\n    font-size: 18px;\r\n    line-height: 1.6;\r\n    margin-bottom: 50px;\r\n    max-width: 500px;\r\n}\r\n\r\n.info-items { margin-bottom: 40px; }\r\n\r\n.item {\r\n    display: flex;\r\n    align-items: center;\r\n    gap: 20px;\r\n    margin-bottom: 30px;\r\n}\r\n\r\n.icon-box {\r\n    width: 50px; height: 50px;\r\n    background: rgba(0, 255, 65, 0.1);\r\n    color: #00ff41;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    border-radius: 12px;\r\n    font-size: 20px;\r\n    flex-shrink: 0;\r\n}\r\n\r\n.item h4 { font-size: 11px; color: #38bdf8; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 5px; font-weight: 700; }\r\n.item p { font-size: 18px; font-weight: 600; margin: 0; }\r\n\r\n.brand-sub {\r\n    font-size: 14px !important;\r\n    color: #00ff41;\r\n    opacity: 0.8;\r\n    margin-top: 5px !important;\r\n    font-weight: 400 !important;\r\n}\r\n\r\n.wa-link {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    gap: 15px;\r\n    padding: 18px 35px;\r\n    background: #25d366;\r\n    color: #000;\r\n    text-decoration: none;\r\n    font-weight: 800;\r\n    border-radius: 12px;\r\n    transition: 0.3s;\r\n    font-size: 14px;\r\n    letter-spacing: 1px;\r\n}\r\n\r\n.wa-link:hover { transform: translateY(-5px); box-shadow: 0 15px 30px rgba(37, 211, 102, 0.25); }\r\n\r\n\/* Form Side *\/\r\n.contact-form-wrapper {\r\n    flex: 1;\r\n    background: rgba(255, 255, 255, 0.02);\r\n    padding: 50px;\r\n    border-radius: 35px;\r\n    border: 1px solid rgba(255, 255, 255, 0.05);\r\n    backdrop-filter: blur(10px);\r\n}\r\n\r\n.input-group { margin-bottom: 20px; }\r\n\r\n.jnm-form input, .jnm-form textarea {\r\n    width: 100%;\r\n    padding: 18px;\r\n    background: #0f172a;\r\n    border: 1px solid rgba(255, 255, 255, 0.1);\r\n    border-radius: 15px;\r\n    color: #fff;\r\n    font-family: 'Space Grotesk', sans-serif;\r\n    font-size: 16px;\r\n    outline: none;\r\n    transition: 0.3s;\r\n    box-sizing: border-box;\r\n}\r\n\r\n.jnm-form input:focus, .jnm-form textarea:focus {\r\n    border-color: #38bdf8;\r\n    box-shadow: 0 0 15px rgba(56, 189, 248, 0.1);\r\n}\r\n\r\n.submit-btn {\r\n    width: 100%;\r\n    padding: 20px;\r\n    background: #38bdf8;\r\n    border: none;\r\n    border-radius: 15px;\r\n    color: #000;\r\n    font-weight: 800;\r\n    font-size: 15px;\r\n    letter-spacing: 1px;\r\n    cursor: pointer;\r\n    transition: 0.3s;\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    gap: 12px;\r\n}\r\n\r\n.submit-btn:hover { background: #00ff41; transform: translateY(-5px); box-shadow: 0 10px 20px rgba(0, 255, 65, 0.2); }\r\n\r\n\/* --- \ud83d\udcf1 MOBILE RESPONSIVE QUERIES --- *\/\r\n\r\n@media (max-width: 1024px) {\r\n    .contact-container { gap: 50px; }\r\n    .contact-form-wrapper { padding: 40px; }\r\n}\r\n\r\n@media (max-width: 991px) {\r\n    .contact-container {\r\n        flex-direction: column;\r\n        text-align: center;\r\n    }\r\n\r\n    .contact-info {\r\n        display: flex;\r\n        flex-direction: column;\r\n        align-items: center;\r\n    }\r\n\r\n    .contact-sub { margin-left: auto; margin-right: auto; }\r\n\r\n    .item {\r\n        flex-direction: column;\r\n        gap: 10px;\r\n        margin-bottom: 40px;\r\n    }\r\n\r\n    .contact-form-wrapper {\r\n        width: 100%;\r\n        box-sizing: border-box;\r\n        border-radius: 25px;\r\n    }\r\n}\r\n\r\n@media (max-width: 768px) {\r\n    #jnm-contact-vfinal { padding: 70px 5%; }\r\n    .contact-title { font-size: 2.2rem; }\r\n    .contact-form-wrapper { padding: 30px 20px; }\r\n    .wa-link { width: 100%; justify-content: center; box-sizing: border-box; }\r\n}\r\n\r\n@media (max-width: 480px) {\r\n    .contact-title { font-size: 1.8rem; }\r\n    .item p { font-size: 16px; }\r\n}\r\n<\/style>\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>SYSTEM_v3_PRO_ACTIVE Jnm Web Solutions Building Digital Legacy With Modern Tech. Freelance WordPress Expert specializing in high-performance e-commerce solutions and immersive digital experiences. Let&#8217;s transform your vision into a pixel-perfect reality. START PROJECT CONTACT ME MY SERVICES LANDING_PAGE Landing Page \u2192 High Conversion Layout \u2192 Fast Loading Speed \u2192 Mobile Responsive PERSONAL_WEBSITE Personal Website \u2192 Digital [&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-8","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/jnmwebsolutions.com\/index.php\/wp-json\/wp\/v2\/pages\/8","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/jnmwebsolutions.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/jnmwebsolutions.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/jnmwebsolutions.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/jnmwebsolutions.com\/index.php\/wp-json\/wp\/v2\/comments?post=8"}],"version-history":[{"count":112,"href":"https:\/\/jnmwebsolutions.com\/index.php\/wp-json\/wp\/v2\/pages\/8\/revisions"}],"predecessor-version":[{"id":275,"href":"https:\/\/jnmwebsolutions.com\/index.php\/wp-json\/wp\/v2\/pages\/8\/revisions\/275"}],"wp:attachment":[{"href":"https:\/\/jnmwebsolutions.com\/index.php\/wp-json\/wp\/v2\/media?parent=8"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}