{"id":16,"date":"2026-09-09T13:55:15","date_gmt":"2026-09-09T13:55:15","guid":{"rendered":"https:\/\/dramandeepgujral.com\/?page_id=16"},"modified":"2026-09-09T13:59:08","modified_gmt":"2026-09-09T13:59:08","slug":"coming-soon","status":"publish","type":"page","link":"https:\/\/dramandeepgujral.com\/","title":{"rendered":"Coming soon"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"16\" class=\"elementor elementor-16\">\n\t\t\t\t<div class=\"elementor-element elementor-element-26542c8 e-con-full e-flex jltma-glass-effect-no e-con e-parent\" data-id=\"26542c8\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6dfa53b jltma-glass-effect-no elementor-widget elementor-widget-html\" data-id=\"6dfa53b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"coming-soon-page\">\r\n\r\n    <div class=\"cs-shape cs-shape-1\"><\/div>\r\n    <div class=\"cs-shape cs-shape-2\"><\/div>\r\n    <div class=\"cs-shape cs-shape-3\"><\/div>\r\n    <div class=\"cs-shape cs-shape-4\"><\/div>\r\n\r\n    <div class=\"cs-dots\"><\/div>\r\n    <div class=\"cs-pulse\"><\/div>\r\n\r\n    <div class=\"cs-content\">\r\n\r\n        <div class=\"cs-label\">\r\n            Something New Is Coming\r\n        <\/div>\r\n\r\n        <h1 class=\"cs-title\">\r\n            Coming\r\n            <span>Soon<\/span>\r\n        <\/h1>\r\n\r\n        <p class=\"cs-description\">\r\n            We're creating something exceptional for you.\r\n            Our new website is currently being prepared\r\n            and will be launching soon.\r\n        <\/p>\r\n\r\n        <div class=\"cs-divider\"><\/div>\r\n\r\n        <!-- 1 MONTH COUNTDOWN -->\r\n        <div class=\"cs-countdown\">\r\n\r\n            <div class=\"cs-time-box\">\r\n                <div class=\"cs-number\" id=\"cs-days\">00<\/div>\r\n                <div class=\"cs-unit\">Days<\/div>\r\n            <\/div>\r\n\r\n            <div class=\"cs-time-box\">\r\n                <div class=\"cs-number\" id=\"cs-hours\">00<\/div>\r\n                <div class=\"cs-unit\">Hours<\/div>\r\n            <\/div>\r\n\r\n            <div class=\"cs-time-box\">\r\n                <div class=\"cs-number\" id=\"cs-minutes\">00<\/div>\r\n                <div class=\"cs-unit\">Minutes<\/div>\r\n            <\/div>\r\n\r\n            <div class=\"cs-time-box\">\r\n                <div class=\"cs-number\" id=\"cs-seconds\">00<\/div>\r\n                <div class=\"cs-unit\">Seconds<\/div>\r\n            <\/div>\r\n\r\n        <\/div>\r\n\r\n        <div class=\"cs-bottom-text\">\r\n            Our website will be live soon.\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n<\/div>\r\n\r\n\r\n<style>\r\n\r\n\/* ===============================\r\n   FONT\r\n================================ *\/\r\n\r\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap');\r\n\r\n\r\n\/* ===============================\r\n   RESET\r\n================================ *\/\r\n\r\n.coming-soon-page,\r\n.coming-soon-page * {\r\n    box-sizing: border-box;\r\n}\r\n\r\n\r\n\/* ===============================\r\n   MAIN\r\n================================ *\/\r\n\r\n.coming-soon-page {\r\n    position: relative;\r\n\r\n    width: 100%;\r\n    min-height: 100vh;\r\n    min-height: 100svh;\r\n\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    overflow: hidden;\r\n\r\n    font-family: \"Poppins\", sans-serif;\r\n\r\n    background:\r\n        radial-gradient(\r\n            circle at 15% 20%,\r\n            rgba(19,169,189,0.14),\r\n            transparent 28%\r\n        ),\r\n        radial-gradient(\r\n            circle at 85% 80%,\r\n            rgba(8,123,184,0.12),\r\n            transparent 30%\r\n        ),\r\n        linear-gradient(\r\n            135deg,\r\n            #ffffff 0%,\r\n            #f3fbfd 50%,\r\n            #ffffff 100%\r\n        );\r\n}\r\n\r\n\r\n\/* ===============================\r\n   BACKGROUND SHAPES\r\n================================ *\/\r\n\r\n.cs-shape {\r\n    position: absolute;\r\n    border-radius: 50%;\r\n    pointer-events: none;\r\n}\r\n\r\n.cs-shape-1 {\r\n    width: 450px;\r\n    height: 450px;\r\n\r\n    left: -280px;\r\n    top: -220px;\r\n\r\n    border: 1px solid rgba(19,169,189,0.25);\r\n\r\n    animation: csFloatOne 8s ease-in-out infinite;\r\n}\r\n\r\n.cs-shape-2 {\r\n    width: 550px;\r\n    height: 550px;\r\n\r\n    right: -360px;\r\n    bottom: -300px;\r\n\r\n    border: 1px solid rgba(8,123,184,0.18);\r\n\r\n    animation: csFloatTwo 10s ease-in-out infinite;\r\n}\r\n\r\n.cs-shape-3 {\r\n    width: 180px;\r\n    height: 180px;\r\n\r\n    right: 12%;\r\n    top: 10%;\r\n\r\n    background: rgba(19,169,189,0.07);\r\n\r\n    filter: blur(2px);\r\n\r\n    animation: csFloatThree 6s ease-in-out infinite;\r\n}\r\n\r\n.cs-shape-4 {\r\n    width: 100px;\r\n    height: 100px;\r\n\r\n    left: 12%;\r\n    bottom: 12%;\r\n\r\n    background: rgba(8,123,184,0.07);\r\n\r\n    animation: csFloatFour 7s ease-in-out infinite reverse;\r\n}\r\n\r\n\r\n\/* ===============================\r\n   DOTS\r\n================================ *\/\r\n\r\n.cs-dots {\r\n    position: absolute;\r\n\r\n    width: 130px;\r\n    height: 130px;\r\n\r\n    right: 7%;\r\n    bottom: 15%;\r\n\r\n    opacity: 0.5;\r\n\r\n    background-image:\r\n        radial-gradient(\r\n            #13a9bd 1.5px,\r\n            transparent 1.5px\r\n        );\r\n\r\n    background-size: 15px 15px;\r\n\r\n    animation: csDotsMove 8s ease-in-out infinite;\r\n}\r\n\r\n\r\n\/* ===============================\r\n   PULSE CIRCLE\r\n================================ *\/\r\n\r\n.cs-pulse {\r\n    position: absolute;\r\n\r\n    width: 520px;\r\n    height: 520px;\r\n\r\n    left: 50%;\r\n    top: 50%;\r\n\r\n    transform: translate(-50%, -50%);\r\n\r\n    border: 1px solid rgba(19,169,189,0.08);\r\n\r\n    border-radius: 50%;\r\n\r\n    animation: csPulse 5s ease-in-out infinite;\r\n\r\n    pointer-events: none;\r\n}\r\n\r\n.cs-pulse::before {\r\n    content: \"\";\r\n\r\n    position: absolute;\r\n\r\n    inset: 55px;\r\n\r\n    border: 1px solid rgba(8,123,184,0.07);\r\n\r\n    border-radius: 50%;\r\n}\r\n\r\n\r\n\/* ===============================\r\n   CONTENT\r\n================================ *\/\r\n\r\n.cs-content {\r\n    position: relative;\r\n\r\n    z-index: 10;\r\n\r\n    width: 90%;\r\n    max-width: 850px;\r\n\r\n    padding: 40px 0;\r\n\r\n    text-align: center;\r\n}\r\n\r\n\r\n\/* ===============================\r\n   LABEL\r\n================================ *\/\r\n\r\n.cs-label {\r\n    display: inline-flex;\r\n\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    gap: 12px;\r\n\r\n    margin-bottom: 25px;\r\n\r\n    color: #0f9eb2;\r\n\r\n    font-size: 11px;\r\n\r\n    font-weight: 600;\r\n\r\n    letter-spacing: 4px;\r\n\r\n    text-transform: uppercase;\r\n}\r\n\r\n.cs-label::before,\r\n.cs-label::after {\r\n    content: \"\";\r\n\r\n    width: 35px;\r\n    height: 1px;\r\n\r\n    background: #13a9bd;\r\n}\r\n\r\n\r\n\/* ===============================\r\n   TITLE\r\n================================ *\/\r\n\r\n.cs-title {\r\n    margin: 0;\r\n\r\n    color: #12395b;\r\n\r\n    font-size: clamp(55px, 9vw, 105px);\r\n\r\n    line-height: 0.98;\r\n\r\n    font-weight: 700;\r\n\r\n    letter-spacing: -4px;\r\n}\r\n\r\n.cs-title span {\r\n    display: block;\r\n\r\n    background:\r\n        linear-gradient(\r\n            90deg,\r\n            #087bb8,\r\n            #13a9bd\r\n        );\r\n\r\n    -webkit-background-clip: text;\r\n    background-clip: text;\r\n\r\n    -webkit-text-fill-color: transparent;\r\n}\r\n\r\n\r\n\/* ===============================\r\n   DESCRIPTION\r\n================================ *\/\r\n\r\n.cs-description {\r\n    max-width: 570px;\r\n\r\n    margin: 30px auto 0;\r\n\r\n    color: #547287;\r\n\r\n    font-size: 15px;\r\n\r\n    line-height: 1.8;\r\n\r\n    font-weight: 400;\r\n}\r\n\r\n\r\n\/* ===============================\r\n   DIVIDER\r\n================================ *\/\r\n\r\n.cs-divider {\r\n    width: 65px;\r\n    height: 3px;\r\n\r\n    margin: 35px auto;\r\n\r\n    border-radius: 20px;\r\n\r\n    background:\r\n        linear-gradient(\r\n            90deg,\r\n            #087bb8,\r\n            #13a9bd\r\n        );\r\n}\r\n\r\n\r\n\/* ===============================\r\n   COUNTDOWN\r\n================================ *\/\r\n\r\n.cs-countdown {\r\n    display: flex;\r\n\r\n    justify-content: center;\r\n\r\n    gap: 15px;\r\n\r\n    margin-top: 10px;\r\n}\r\n\r\n.cs-time-box {\r\n    width: 105px;\r\n    height: 95px;\r\n\r\n    display: flex;\r\n\r\n    flex-direction: column;\r\n\r\n    align-items: center;\r\n    justify-content: center;\r\n\r\n    border-radius: 20px;\r\n\r\n    background: rgba(255,255,255,0.78);\r\n\r\n    border: 1px solid rgba(19,169,189,0.16);\r\n\r\n    box-shadow:\r\n        0 15px 45px rgba(18,57,91,0.07);\r\n\r\n    backdrop-filter: blur(15px);\r\n    -webkit-backdrop-filter: blur(15px);\r\n\r\n    transition:\r\n        transform 0.35s ease,\r\n        box-shadow 0.35s ease;\r\n}\r\n\r\n.cs-time-box:hover {\r\n    transform: translateY(-6px);\r\n\r\n    box-shadow:\r\n        0 20px 50px rgba(8,123,184,0.13);\r\n}\r\n\r\n.cs-number {\r\n    color: #12395b;\r\n\r\n    font-size: 28px;\r\n\r\n    line-height: 1;\r\n\r\n    font-weight: 700;\r\n}\r\n\r\n.cs-unit {\r\n    margin-top: 8px;\r\n\r\n    color: #7891a2;\r\n\r\n    font-size: 9px;\r\n\r\n    font-weight: 600;\r\n\r\n    letter-spacing: 1.5px;\r\n\r\n    text-transform: uppercase;\r\n}\r\n\r\n\r\n\/* ===============================\r\n   BOTTOM TEXT\r\n================================ *\/\r\n\r\n.cs-bottom-text {\r\n    margin-top: 25px;\r\n\r\n    color: #8198a7;\r\n\r\n    font-size: 10px;\r\n\r\n    font-weight: 400;\r\n}\r\n\r\n\r\n\/* ===============================\r\n   ANIMATIONS\r\n================================ *\/\r\n\r\n@keyframes csPulse {\r\n\r\n    0%,\r\n    100% {\r\n        transform:\r\n            translate(-50%, -50%)\r\n            scale(0.95);\r\n\r\n        opacity: 0.5;\r\n    }\r\n\r\n    50% {\r\n        transform:\r\n            translate(-50%, -50%)\r\n            scale(1.05);\r\n\r\n        opacity: 1;\r\n    }\r\n}\r\n\r\n\r\n@keyframes csFloatOne {\r\n\r\n    0%,\r\n    100% {\r\n        transform: translate(0,0);\r\n    }\r\n\r\n    50% {\r\n        transform: translate(20px,20px);\r\n    }\r\n}\r\n\r\n\r\n@keyframes csFloatTwo {\r\n\r\n    0%,\r\n    100% {\r\n        transform: translate(0,0);\r\n    }\r\n\r\n    50% {\r\n        transform: translate(-25px,-20px);\r\n    }\r\n}\r\n\r\n\r\n@keyframes csFloatThree {\r\n\r\n    0%,\r\n    100% {\r\n        transform: translateY(0);\r\n    }\r\n\r\n    50% {\r\n        transform: translateY(-20px);\r\n    }\r\n}\r\n\r\n\r\n@keyframes csFloatFour {\r\n\r\n    0%,\r\n    100% {\r\n        transform: translateY(0);\r\n    }\r\n\r\n    50% {\r\n        transform: translateY(-15px);\r\n    }\r\n}\r\n\r\n\r\n@keyframes csDotsMove {\r\n\r\n    0%,\r\n    100% {\r\n        transform: translate(0,0);\r\n    }\r\n\r\n    50% {\r\n        transform: translate(-10px,-15px);\r\n    }\r\n}\r\n\r\n\r\n\/* ===============================\r\n   MOBILE\r\n================================ *\/\r\n\r\n@media (max-width: 600px) {\r\n\r\n    .coming-soon-page {\r\n        min-height: 100svh;\r\n\r\n        padding: 25px 18px;\r\n    }\r\n\r\n    .cs-content {\r\n        width: 100%;\r\n\r\n        padding: 20px 0;\r\n    }\r\n\r\n    .cs-label {\r\n        gap: 8px;\r\n\r\n        margin-bottom: 20px;\r\n\r\n        font-size: 8px;\r\n\r\n        letter-spacing: 2.5px;\r\n    }\r\n\r\n    .cs-label::before,\r\n    .cs-label::after {\r\n        width: 20px;\r\n    }\r\n\r\n    .cs-title {\r\n        font-size: 48px;\r\n\r\n        letter-spacing: -2px;\r\n    }\r\n\r\n    .cs-description {\r\n        max-width: 340px;\r\n\r\n        margin-top: 22px;\r\n\r\n        font-size: 12px;\r\n\r\n        line-height: 1.7;\r\n    }\r\n\r\n    .cs-divider {\r\n        margin: 27px auto;\r\n    }\r\n\r\n    .cs-countdown {\r\n        gap: 7px;\r\n    }\r\n\r\n    .cs-time-box {\r\n        width: 70px;\r\n        height: 70px;\r\n\r\n        border-radius: 14px;\r\n    }\r\n\r\n    .cs-number {\r\n        font-size: 20px;\r\n    }\r\n\r\n    .cs-unit {\r\n        margin-top: 6px;\r\n\r\n        font-size: 7px;\r\n\r\n        letter-spacing: 0.8px;\r\n    }\r\n\r\n    .cs-bottom-text {\r\n        margin-top: 20px;\r\n\r\n        font-size: 9px;\r\n    }\r\n\r\n    .cs-pulse {\r\n        width: 340px;\r\n        height: 340px;\r\n    }\r\n\r\n    .cs-dots {\r\n        right: -15px;\r\n        bottom: 8%;\r\n\r\n        transform: scale(0.7);\r\n    }\r\n\r\n    .cs-shape-3 {\r\n        width: 100px;\r\n        height: 100px;\r\n\r\n        right: -20px;\r\n        top: 10%;\r\n    }\r\n\r\n    .cs-shape-4 {\r\n        width: 70px;\r\n        height: 70px;\r\n\r\n        left: -20px;\r\n        bottom: 10%;\r\n    }\r\n}\r\n\r\n\r\n\/* ===============================\r\n   SMALL MOBILE\r\n================================ *\/\r\n\r\n@media (max-width: 380px) {\r\n\r\n    .cs-title {\r\n        font-size: 41px;\r\n    }\r\n\r\n    .cs-time-box {\r\n        width: 63px;\r\n        height: 63px;\r\n    }\r\n\r\n    .cs-number {\r\n        font-size: 18px;\r\n    }\r\n}\r\n\r\n<\/style>\r\n\r\n\r\n<script>\r\n\r\n\/* =================================\r\n   AUTOMATIC 1 MONTH COUNTDOWN\r\n================================= *\/\r\n\r\n(function () {\r\n\r\n    \/*\r\n     * Launch date = exactly 1 month\r\n     * from the current date\/time.\r\n     *\/\r\n\r\n    const launchDate = new Date();\r\n\r\n    launchDate.setMonth(\r\n        launchDate.getMonth() + 1\r\n    );\r\n\r\n\r\n    function updateCountdown() {\r\n\r\n        const now = new Date();\r\n\r\n        const difference =\r\n            launchDate.getTime() -\r\n            now.getTime();\r\n\r\n\r\n        if (difference <= 0) {\r\n\r\n            document.getElementById(\r\n                \"cs-days\"\r\n            ).textContent = \"00\";\r\n\r\n            document.getElementById(\r\n                \"cs-hours\"\r\n            ).textContent = \"00\";\r\n\r\n            document.getElementById(\r\n                \"cs-minutes\"\r\n            ).textContent = \"00\";\r\n\r\n            document.getElementById(\r\n                \"cs-seconds\"\r\n            ).textContent = \"00\";\r\n\r\n            return;\r\n        }\r\n\r\n\r\n        const days = Math.floor(\r\n            difference \/\r\n            (1000 * 60 * 60 * 24)\r\n        );\r\n\r\n\r\n        const hours = Math.floor(\r\n            (difference %\r\n                (1000 * 60 * 60 * 24)) \/\r\n            (1000 * 60 * 60)\r\n        );\r\n\r\n\r\n        const minutes = Math.floor(\r\n            (difference %\r\n                (1000 * 60 * 60)) \/\r\n            (1000 * 60)\r\n        );\r\n\r\n\r\n        const seconds = Math.floor(\r\n            (difference %\r\n                (1000 * 60)) \/\r\n            1000\r\n        );\r\n\r\n\r\n        document.getElementById(\r\n            \"cs-days\"\r\n        ).textContent =\r\n            String(days).padStart(2, \"0\");\r\n\r\n\r\n        document.getElementById(\r\n            \"cs-hours\"\r\n        ).textContent =\r\n            String(hours).padStart(2, \"0\");\r\n\r\n\r\n        document.getElementById(\r\n            \"cs-minutes\"\r\n        ).textContent =\r\n            String(minutes).padStart(2, \"0\");\r\n\r\n\r\n        document.getElementById(\r\n            \"cs-seconds\"\r\n        ).textContent =\r\n            String(seconds).padStart(2, \"0\");\r\n\r\n    }\r\n\r\n\r\n    updateCountdown();\r\n\r\n    setInterval(\r\n        updateCountdown,\r\n        1000\r\n    );\r\n\r\n})();\r\n\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Something New Is Coming Coming Soon We&#8217;re creating something exceptional for you. Our new website is currently being prepared and [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-16","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/dramandeepgujral.com\/index.php\/wp-json\/wp\/v2\/pages\/16","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/dramandeepgujral.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/dramandeepgujral.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/dramandeepgujral.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/dramandeepgujral.com\/index.php\/wp-json\/wp\/v2\/comments?post=16"}],"version-history":[{"count":10,"href":"https:\/\/dramandeepgujral.com\/index.php\/wp-json\/wp\/v2\/pages\/16\/revisions"}],"predecessor-version":[{"id":28,"href":"https:\/\/dramandeepgujral.com\/index.php\/wp-json\/wp\/v2\/pages\/16\/revisions\/28"}],"wp:attachment":[{"href":"https:\/\/dramandeepgujral.com\/index.php\/wp-json\/wp\/v2\/media?parent=16"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}