Domain > ezistack.com

More information on this domain is in AlienVault OTX

DNS Resolutions

Date	IP Address
2025-02-13	52.1.172.236 (ClassC)
2025-08-09	52.72.226.137 (ClassC)
2025-12-06	3.219.142.121 (ClassC)

HTTP/1.1 200 OKDate: Sat, 06 Dec 2025 00:27:56 GMTContent-Type: text/htmlContent-Length: 279378Connection: keep-aliveServer: Apache/2.4.52 (Ubuntu)Last-Modified: Wed, 03 Dec 2025 14:31:00 GMTETag: 44352-6450d0fab533dAccept-Ranges: bytesVary: Accept-Encoding

!DOCTYPE html>html langen>head>    meta charsetUTF-8>    meta nameviewport contentwidthdevice-width, initial-scale1.0>    title>EziStack - AI-Powered Website Builder/title>	meta namedescription contentCreate AI-powered websites with the EziStack AI Website Builder. launch fast, host for pennies, and scale without limits. Professional Sites using AI> link relpreload hreffonts/poppins-v23-latin-900.woff2 asfont typefont/woff2>!-- css-->link relstylesheet hrefassets/style.css fetchpriorityhigh>!-- AOS CSS -->!-- link relpreload asstyle hrefassets/aos.css onloadthis.onloadnull;this.relstylesheet> -->!-- noscript>link relstylesheet hrefassets/aos.css>/noscript> -->link relpreload hrefassets/icons.css asstyle>link relstylesheet hrefassets/icons.css mediaprint onloadthis.mediaall>noscript>link relstylesheet hrefassets/icons.css>/noscript>!--  icons.css -->link relpreload hreffonts/Phosphor.woff2 asfont typefont/woff2>link relpreload hreffonts/Phosphor-Bold.woff2 asfont typefont/woff2>link relpreload hreffonts/Phosphor-Fill.woff2 asfont typefont/woff2>!-- Smooth scrolling for in-page anchors -->style>  html { scroll-behavior: smooth; }/style>style>     !DOCTYPE html>html langen>head>    meta charsetUTF-8>    meta nameviewport contentwidthdevice-width, initial-scale1.0>    title>EziStack Countdown Timer/title>    style>.countdown-hero {    max-width: 750px;    margin: 2.5rem auto;    background: linear-gradient(135deg, #1E40AF 0%, #3B82F6 100%);    padding: 1.5rem 1rem;    border-radius: 20px;    box-shadow: 0 10px 30px rgba(30, 64, 175, 0.25);    position: relative;    overflow: hidden;}.countdown-content {    position: relative;    z-index: 2;    display: flex;    align-items: center;    justify-content: center;    gap: 1rem;    flex-wrap: wrap;}@media (max-width: 640px) {    .countdown-content {        flex-direction: column;        gap: 1rem;    }}.countdown-title {    font-family: Poppins, sans-serif;    font-size: clamp(1rem, 2.5vw, 1.25rem);    font-weight: 700;    color: white;    margin: 0;    line-height: 1.2;    text-align: center;    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);}.timer-grid {    display: flex;    align-items: center;    gap: 0.4rem;}.timer-box {    background: rgba(255, 255, 255, 0.95);    border-radius: 10px;    padding: 0.65rem 0.5rem;    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);    min-width: 50px;    text-align: center;}.timer-number {    font-family: Poppins, sans-serif;    font-size: clamp(1.5rem, 4vw, 1.75rem);    font-weight: 900;    color: #1E40AF !important; /* Adding !important to override any conflicts */    line-height: 1;    display: block;}.timer-label {    font-size: 0.625rem;    font-weight: 600;    color: #1F2937 !important; /* Dark gray for labels */    text-transform: uppercase;    letter-spacing: 0.3px;    margin-top: 0.25rem;    display: block;}.timer-separator {    font-size: clamp(1.2rem, 3vw, 1.5rem);    font-weight: 700;    color: white;    opacity: 0.5;}/* Pricing Section Countdown */.countdown-compact {    display: flex;    align-items: center;    justify-content: center;    gap: 1rem;    flex-wrap: wrap;}.countdown-compact-title {    font-family: Poppins, sans-serif;    font-size: clamp(0.95rem, 2.5vw, 1.1rem);    font-weight: 700;    color: white;    margin: 0;}.timer-compact-grid {    display: flex;    align-items: center;    gap: 0.4rem;}.timer-compact-box {    background: rgba(0, 0, 0, 0.2);    border-radius: 10px;    padding: 0.6rem 0.5rem;    min-width: 48px;    backdrop-filter: blur(10px);    border: 1px solid rgba(255, 255, 255, 0.15);}.timer-compact-number {    font-family: Poppins, sans-serif;    font-size: clamp(1.4rem, 3.5vw, 1.6rem);    font-weight: 900;    color: white;    line-height: 1;    display: block;    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);}.timer-compact-label {    font-size: 0.625rem;    font-weight: 600;    color: rgba(255, 255, 255, 0.95);    text-transform: uppercase;    letter-spacing: 0.3px;    margin-top: 0.25rem;}.timer-separator {    font-size: clamp(1.2rem, 3vw, 1.5rem);    font-weight: 700;    color: white;    opacity: 0.6;}        /* Expired State */        .countdown-expired {            display: none;            font-size: 1.1rem;            font-weight: 700;            color: white;            padding: 0.75rem;            background: rgba(239, 68, 68, 0.2);            border: 1px solid rgba(239, 68, 68, 0.4);            border-radius: 10px;        }		/style> script        idfsc-api        srchttps://sbl.onfastspring.com/sbl/1.0.5/fastspring-builder.min.js        typetext/javascript        data-storefrontezistack.onfastspring.com/popup-ezistack        data-popup-closedonFSPopupClosed>    /script>/head>body classscroll-smooth bg-gray-50>!-- div styleposition: sticky; top: 0; z-index: 1000; background: linear-gradient(135deg, #000000 0%, #DC2626 100%); color: white; padding: 12px 20px; text-align: center; box-shadow: 0 4px 12px rgba(0,0,0,0.3); border-bottom: 3px solid #F59E0B;> -->    !-- div stylemax-width: 1200px; margin: 0 auto; display: flex; align-items: center; justify-content: center; gap: 16px; flex-wrap: wrap;> -->        !-- span stylefont-size: 24px;>🔥/span> -->        !-- span stylefont-weight: 700; font-size: 16px; letter-spacing: 0.5px;>BLACK FRIDAY SALE:/span> -->        !-- span stylefont-weight: 600; font-size: 15px;>Save up to strong stylecolor: #FCD34D; font-size: 18px;>$50/strong> on all plans/span> -->        !-- span stylebackground: #F59E0B; color: #000; padding: 6px 16px; border-radius: 20px; font-weight: 700; font-size: 13px; letter-spacing: 0.3px;>ENDS DEC 2ND/span> -->    !-- /div> -->!-- /div> -->    section classrelative min-h-screen flex items-center hero-gradient>        div classfloating-shapes>            div classshape shape-1>/div>            div classshape shape-2>/div>            div classshape shape-3>/div>            div classshape shape-4>/div>        /div>        div classrelative z-10 max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 pt-10 pb-20>        	 						 						 div classtext-center space-y-6>  h1 classtext-4xl md:text-6xl lg:text-7xl font-bold text-white leading-tight headline-font>  Launch Professionalspan classtext-var(--accent) block>SEO-Ready Sites/span>  span classblock>in Minutes/span>/h1>h2 classtext-xl md:text-2xl lg:text-3xl font-bold text-white mt-6 headline-font>Scale to 100+ Websites &span classtext-2xl md:text-3xl lg:text-4xl font-bold text-var(--accent) mt-1 headline-font> Host them for pennies./span>/h2>p classtext-lg lg:text-xl text-blue-100 mt-8 mb-6 max-w-4xl mx-auto leading-relaxed>  Create Fully Personalized Properties with Keyword Research, Authority Content, and Complete Design—All Done For You./p>     /div>!-- New Process Flow -->div classflex flex-row items-center justify-center stylemargin-top:3.5rem;flex-wrap:wrap;gap:10px 14px;max-width:100%;margin-bottom:clamp(10px,2vw,16px);>  div classbg-var(--accent) text-var(--text) rounded-xl shadow-lg hover:shadow-xl transition-all duration-300 text-center stylepadding:10px 18px;font-size:clamp(14px,3.2vw,18px);font-weight:800;letter-spacing:.4px;min-width:0;max-width:100%;white-space:nowrap;text-shadow:0 1px 2px rgba(0,0,0,.25);>Enter a Keyword/div>  i classph-bold ph-arrow-right text-var(--accent) stylefont-size:clamp(16px,4vw,22px);margin:0 6px;flex:0 0 auto;>/i>  div classbg-var(--secondary) text-white rounded-xl shadow-lg hover:shadow-xl transition-all duration-300 text-center stylepadding:10px 18px;font-size:clamp(14px,3.2vw,18px);font-weight:800;letter-spacing:.4px;min-width:0;max-width:100%;white-space:nowrap;text-shadow:0 1px 2px rgba(0,0,0,.25);>AI Builds Everything/div>  i classph-bold ph-arrow-right text-var(--accent) stylefont-size:clamp(16px,4vw,22px);margin:0 6px;flex:0 0 auto;>/i>  div classbg-var(--success) text-white rounded-xl shadow-lg hover:shadow-xl transition-all duration-300 text-center stylepadding:10px 18px;font-size:clamp(14px,3.2vw,18px);font-weight:800;letter-spacing:.4px;min-width:0;max-width:100%;white-space:nowrap;text-shadow:0 1px 2px rgba(0,0,0,.25);>Deploy in Minutes/div>/div>!-- Bottom tagline -->div styledisplay:flex;justify-content:center;width:100%;margin-top:1rem;>p classfont-semibold stylemargin:clamp(18px,3vw,30px) 0 clamp(30px,4vw,54px);padding:10px 20px;border-radius:9999px;color:#fff;background:rgba(245,158,11,.12);border:1px solid #F59E0B;box-shadow:0 8px 20px rgba(245,158,11,.25);text-shadow:0 1px 2px rgba(0,0,0,.35);font-size:clamp(14px,2.4vw,18px);letter-spacing:.25px;text-align:center;>No WordPress, No Plugins, No Technical Headaches./p>/div>            div classgrid lg:grid-cols-5 gap-8 items-center>                            div classlg:col-span-3 order-1 lg:order-1 aos-init aos-animate data-aosfade-right data-aos-delay100>				div classtext-center mb-6 stylemargin-top: 1rem;>  h3 stylecolor: #F59E0B; font-family: Inter, sans-serif; font-weight: 800; font-size: 1.5rem; letter-spacing: 0.05em; text-transform: uppercase; text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3); margin-bottom: 0.5rem;>    See It In Action  /h3>  /div>div classvideo-container styleborder-radius: 16px; padding: 0;  box-shadow: 0 10px 30px rgba(0,0,0,0.2);>    div classvideo-wrapper onclickloadMainVideo(this) styleposition: relative; width: 100%; aspect-ratio: 16/9; border-radius: 16px; overflow: hidden; cursor: pointer; background: #000; touch-action: manipulation;>                !-- YouTube iframe (initially hidden) -->        iframe             classyoutube-iframe             src             data-srchttps://www.youtube.com/embed/mChYAiBzFoc?autoplay1&mute0&playsinline1&rel0             styleposition: absolute; inset: 0; width: 100%; height: 100%; border: 0; z-index: 5; opacity: 0; transition: opacity 0.5s ease;             titleWebsite Builder Demo             allowautoplay; encrypted-media; picture-in-picture             allowfullscreen>        /iframe>                !-- Loop video overlay -->        div classloop-overlay styleposition: absolute; inset: 0; z-index: 10; background: #000; transition: all 0.5s ease;>            video classloop-video autoplay muted loop playsinline stylewidth: 100%; height: 100%; object-fit: cover;>                source srcimg/3step-gif.webm typevideo/webm>                !-- Add MP4 fallback if you create one later -->                !-- source srcimg/3step-gif.mp4 typevideo/mp4> -->            /video>        /div>                !-- Play button overlay -->        div classplay-overlay styleposition: absolute; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 20; background: rgba(0,0,0,0.3); transition: all 0.3s ease;>            div classplay-button stylewidth: clamp(60px, 8vw, 80px); height: clamp(60px, 8vw, 80px); background: rgba(255,255,255,0.95); border-radius: 50%; display: flex; align-items: center; justify-content: center; animation: pulse 2s ease-in-out infinite; box-shadow: 0 4px 20px rgba(0,0,0,0.3); transition: transform 0.2s ease;>                div stylewidth: 0; height: 0; border-left: clamp(18px, 2.5vw, 25px) solid #333; border-top: clamp(12px, 1.5vw, 15px) solid transparent; border-bottom: clamp(12px, 1.5vw, 15px) solid transparent; margin-left: clamp(3px, 0.5vw, 5px);>/div>            /div>        /div>                !-- CTA overlay -->        div classcta-overlay styleposition: absolute; bottom: clamp(10px, 2vw, 20px); left: clamp(10px, 2vw, 20px); right: clamp(10px, 2vw, 20px); background: rgba(255,255,255,0.95); padding: clamp(10px, 2vw, 15px) clamp(15px, 3vw, 20px); border-radius: 8px; z-index: 15; backdrop-filter: blur(10px); animation: slideUp 0.8s ease 2s both;>            p stylefont-size: clamp(12px, 2.5vw, 14px); font-weight: 600; color: #333; margin: 0; text-align: center;>🔥 Watch Full Demo - See How Easy Website Building Can Be!/p>        /div>                !-- Loading indicator -->        div classloading-indicator styleposition: absolute; inset: 0; z-index: 25; background: rgba(0,0,0,0.8); display: none; align-items: center; justify-content: center; color: white; font-size: 18px;>            div>Loading video.../div>        /div>    /div>/div>/div>style>   @keyframes pulse {    0%, 100% { transform: scale(1); }    50% { transform: scale(1.05); }}.play-button {    animation: pulse 3s ease-in-out infinite; /* Changed from 2s to 3s */}/* Or pause on hover */.video-wrapper:not(:hover) .play-button {    animation-play-state: paused;}        @keyframes slideUp {        from { transform: translateY(100%); opacity: 0; }        to { transform: translateY(0); opacity: 1; }    }/style>         div classlg:col-span-2 order-2 lg:order-2 space-y-4 aos-init aos-animate data-aosfade-left data-aos-delay200>    !-- Bullet 1 -->    div classbenefit-card p-4 shadow-lg stylebackground: #1E40AF; border-radius: 1rem; padding: 1.25rem 1.5rem; box-shadow: 0 8px 24px rgba(30, 64, 175, 0.4); transition: all 0.3s ease; border: 3px solid #F59E0B;>        div classflex items-center space-x-3 onmouseoverthis.parentNode.style.transformtranslateY(-6px); this.parentNode.style.boxShadow0 16px 32px rgba(245, 158, 11, 0.6); this.parentNode.style.borderColor#F59E0B; onmouseoutthis.parentNode.style.transformtranslateY(0); this.parentNode.style.boxShadow0 8px 24px rgba(30, 64, 175, 0.4); this.parentNode.style.borderColor#F59E0B;>            div classflex-shrink-0 w-12 h-12 rounded-lg flex items-center justify-center stylebackground: #F59E0B; color: white; font-size: 1.25rem;>                ⚡            /div>            div>                h3 classfont-bold text-xl mb-1 stylecolor: white;>Launch in Minutes, Not Months/h3>                p classtext-sm stylecolor: #E0E7FF;>                    Complete Personalized Sites with Research, Content, Logos, and Design.                /p>            /div>        /div>    /div>        !-- Bullet 2 -->    div classbenefit-card p-4 shadow-lg stylebackground: #1E40AF; border-radius: 1rem; padding: 1.25rem 1.5rem; box-shadow: 0 8px 24px rgba(30, 64, 175, 0.4); transition: all 0.3s ease; border: 3px solid #10B981;>        div classflex items-center space-x-3 onmouseoverthis.parentNode.style.transformtranslateY(-6px); this.parentNode.style.boxShadow0 16px 32px rgba(16, 185, 129, 0.6); this.parentNode.style.borderColor#10B981; onmouseoutthis.parentNode.style.transformtranslateY(0); this.parentNode.style.boxShadow0 8px 24px rgba(30, 64, 175, 0.4); this.parentNode.style.borderColor#10B981;>            div classflex-shrink-0 w-12 h-12 rounded-lg flex items-center justify-center stylebackground: #10B981; color: white; font-size: 1.25rem;>                💰            /div>            div>                h3 classfont-bold text-xl mb-1 stylecolor: white;>Host for Pennies/h3>                p classtext-sm stylecolor: #E0E7FF;>                    Deploy to Your Cloud for Cents per Year with Free SSL. Ultra-Cheap, Ultra-Scalable, Fully Yours.                /p>            /div>        /div>    /div>        !-- Bullet 3 -->    div classbenefit-card p-4 shadow-lg stylebackground: #1E40AF; border-radius: 1rem; padding: 1.25rem 1.5rem; box-shadow: 0 8px 24px rgba(30, 64, 175, 0.4); transition: all 0.3s ease; border: 3px solid #3B82F6;>        div classflex items-center space-x-3 onmouseoverthis.parentNode.style.transformtranslateY(-6px); this.parentNode.style.boxShadow0 16px 32px rgba(59, 130, 246, 0.6); this.parentNode.style.borderColor#3B82F6; onmouseoutthis.parentNode.style.transformtranslateY(0); this.parentNode.style.boxShadow0 8px 24px rgba(30, 64, 175, 0.4); this.parentNode.style.borderColor#3B82F6;>            div classflex-shrink-0 w-12 h-12 rounded-lg flex items-center justify-center stylebackground: #3B82F6; color: white; font-size: 1.25rem;>                📈            /div>            div>                h3 classfont-bold text-xl mb-1 stylecolor: white;>SEO Baked-In/h3>                p classtext-sm stylecolor: #E0E7FF;>                    Smart Silos, Schema, Keyword Research, and Automated Freshness Updates.                /p>            /div>        /div>    /div>        !-- Bullet 4 -->    div classbenefit-card p-4 shadow-lg stylebackground: #1E40AF; border-radius: 1rem; padding: 1.25rem 1.5rem; box-shadow: 0 8px 24px rgba(30, 64, 175, 0.4); transition: all 0.3s ease; border: 3px solid #F59E0B;>        div classflex items-center space-x-3 onmouseoverthis.parentNode.style.transformtranslateY(-6px); this.parentNode.style.boxShadow0 16px 32px rgba(245, 158, 11, 0.6); this.parentNode.style.borderColor#F59E0B; onmouseoutthis.parentNode.style.transformtranslateY(0); this.parentNode.style.boxShadow0 8px 24px rgba(30, 64, 175, 0.4); this.parentNode.style.borderColor#F59E0B;>            div classflex-shrink-0 w-12 h-12 rounded-lg flex items-center justify-center stylebackground: #F59E0B; color: white; font-size: 1.25rem;>                🧠            /div>            div>                h3 classfont-bold text-xl mb-1 stylecolor: white;>AI Speed + Your Control/h3>                p classtext-sm stylecolor: #E0E7FF;>                    AI Handles Research and Creation, You Customize to Match Your Brand.                /p>            /div>        /div>    /div>        !-- Bullet 5 -->    div classbenefit-card p-4 shadow-lg stylebackground: #1E40AF; border-radius: 1rem; padding: 1.25rem 1.5rem; box-shadow: 0 8px 24px rgba(30, 64, 175, 0.4); transition: all 0.3s ease; border: 3px solid #10B981;>        div classflex items-center space-x-3 onmouseoverthis.parentNode.style.transformtranslateY(-6px); this.parentNode.style.boxShadow0 16px 32px rgba(16, 185, 129, 0.6); this.parentNode.style.borderColor#10B981; onmouseoutthis.parentNode.style.transformtranslateY(0); this.parentNode.style.boxShadow0 8px 24px rgba(30, 64, 175, 0.4); this.parentNode.style.borderColor#10B981;>            div classflex-shrink-0 w-12 h-12 rounded-lg flex items-center justify-center stylebackground: #10B981; color: white; font-size: 1.25rem;>                🔒            /div>            div>                h3 classfont-bold text-xl mb-1 stylecolor: white;>Rock-Solid Security/h3>                p classtext-sm stylecolor: #E0E7FF;>                    Static Hosting Eliminates Plugins, Hacks, and Downtime.                /p>            /div>        /div>    /div>/div>            /div>		        /div>		    /section>				!-- div classrelative flex items-center justify-center hero-gradient stylepadding: 0 1.5rem; overflow-x: hidden; text-align:center; padding-bottom:10px; padding-top:10px;> -->	    !-- section classcountdown-hero> -->        !-- div classcountdown-content> -->            !-- h3 classcountdown-title> -->                !-- 🔥 Founders Special Ends In: -->            !-- /h3> -->              !-- div classtimer-grid idmainTimer> -->                !-- div classtimer-box> -->                    !-- span classtimer-number iddays>00/span> -->                    !-- span classtimer-label>Days/span> -->                !-- /div> -->                !-- span classtimer-separator>:/span> -->                !-- div classtimer-box> -->                    !-- span classtimer-number idhours>00/span> -->                    !-- span classtimer-label>Hours/span> -->                !-- /div> -->                !-- span classtimer-separator>:/span> -->                !-- div classtimer-box> -->                    !-- span classtimer-number idminutes>00/span> -->                    !-- span classtimer-label>Mins/span> -->                !-- /div> -->                !-- span classtimer-separator>:/span> -->                !-- div classtimer-box> -->                    !-- span classtimer-number idseconds>00/span> -->                    !-- span classtimer-label>Secs/span> -->                !-- /div> -->            !-- /div> -->        !-- /div> -->    !-- /section> -->!-- /div> -->	section classw-full bg-gradient-to-br from-green-50 to-emerald-100 py-3.75rem px-6 flex flex-col items-center relative overflow-hidden data-aosfade-up>  !-- Subtle Background Elements -->  div classabsolute inset-0 opacity-5>    div classabsolute top-20 left-20 w-32 h-32 bg-var(--success) rounded-full blur-3xl>/div>    div classabsolute bottom-20 right-20 w-40 h-40 bg-var(--accent) rounded-full blur-2xl>/div>  /div>    div classmax-w-7xl mx-auto relative z-10>    !-- Header Section -->div classtext-center mb-16 data-aosfade-in data-aos-delay100>  !-- Pain Point Bridge - Clean & Punchy -->div stylemargin-bottom: 3rem;>  !-- Main Statement -->  h3 stylefont-family: Poppins, sans-serif; font-weight: 600; font-size: 2.2rem; color: var(--text); margin-bottom: 2rem; line-height: 1.25; letter-spacing: -0.02em; text-align: center;>    Stop Wrestling with Themes, Plugins, and Servers.  /h3>    !-- Time Contrast with Arrow -->  p stylefont-family: Inter, sans-serif; font-size: 1.25rem; color: var(--text-light); line-height: 1.6; font-weight: 500; text-align: center; max-width: 36rem; margin: 0 auto 2.5rem auto;>    What used to take     strong stylecolor: var(--text); font-weight: 600;>weeks/strong>    - now happens in     strong stylecolor: var(--accent); font-weight: 600;>Minutes/strong>.  /p>    !-- Visual Arrow Transition --> !-- Minimal visual separator -->div styletext-align: center; margin: 3rem 0 2rem 0;>  div stylewidth: 60px; height: 2px; background: linear-gradient(90deg, transparent, rgba(30, 64, 175, 0.3), transparent); margin: 0 auto;>/div>/div>/div>  !-- Transition Statement -->p stylefont-family: Poppins, sans-serif; font-weight: 600; font-size: 1.5rem; color: var(--text-light); margin-bottom: 1rem; line-height: 1.4;>    Youve seen how it works. Now see what it creates.  /p>    !-- Main Header -->  h2 stylefont-family: Poppins, sans-serif; font-weight: 800; font-size: 3rem; color: var(--primary); margin-bottom: 1rem; line-height: 1.1; letter-spacing: -0.02em;>    Real Sites, span stylecolor: var(--success);>Real Results/span>  /h2>    !-- Description -->  p stylefont-size: 1.2rem; color: var(--text); max-width: 42rem; margin: 0 auto 2rem auto; line-height: 1.6; font-weight: 400;>    Every site is fully personalized with unique branding, custom colors, and professional design  /p>    !-- CTA -->  div styledisplay: inline-flex; align-items: center; gap: 0.5rem; padding: 0.75rem 1.25rem; background: linear-gradient(135deg, rgba(16, 185, 129, 0.15), rgba(16, 185, 129, 0.08)); border-radius: 50px; border: 1px solid rgba(16, 185, 129, 0.25); box-shadow: 0 2px 8px rgba(16, 185, 129, 0.1);>    i classph-bold ph-magnifying-glass-plus stylecolor: var(--success); font-size: 1.1rem;>/i>    span stylefont-size: 0.95rem; font-weight: 600; color: var(--success);>Click any image to view full-size/span>  /div>/div>    !-- Site Showcase Grid -->  div classgrid grid-cols-1 md:grid-cols-2 gap-8 mb-16>  !-- Site 1 - Local Business Site -->  div classgroup relative bg-white rounded-3xl shadow-xl border-2 border-gray-400 hover:border-var(--secondary) overflow-hidden hover:shadow-2xl transition-all duration-300 cursor-pointer lightbox-trigger data-imageimg/local.webp data-titleLocal Business Site - Professional branding with location-specific content data-aoszoom-in data-aos-delay260>    !-- Site Screenshot -->    div classrelative overflow-hidden>      img srcimg/local-thumb.webp width360 height211 altLocal Business Site Screenshot classw-full h-48 object-cover group-hover:scale-105 transition-transform duration-300 loadinglazy decodingasync>            !-- Hover Overlay -->      div classabsolute inset-0 bg-black bg-opacity-0 group-hover:bg-opacity-30 transition-all duration-300 flex items-center justify-center>        div classopacity-0 group-hover:opacity-100 transition-opacity duration-300>          div classw-14 h-14 bg-white rounded-full flex items-center justify-center shadow-lg>            i classph-bold ph-magnifying-glass-plus text-var(--primary) text-2xl>/i>          /div>        /div>      /div>    /div>        !-- Logo & Brand Info -->    div classp-6 border-t-2 border-gray-100>      !-- Centered Logo -->      div classflex justify-center mb-6>        div classw-32 h-24 bg-gray-50 rounded-2xl p-3 shadow-lg border border-gray-200>          img srcimg/lock-logo.png width102 height70 altCustom Logo classw-full h-full object-contain loadinglazy decodingasync>        /div>      /div>            !-- Site Info -->      div classtext-center mb-4>        h3 classtext-lg font-bold text-var(--primary)>Local Site/h3>        p classtext-sm text-var(--text-light)>Professional local branding/p>      /div>            !-- Colors -->      div classflex items-center justify-center gap-2>        div classw-5 h-5 bg-gradient-to-r from-#2C3E50 to-#34495E rounded-full border-2 border-white shadow-sm>/div>        div classw-5 h-5 bg-gradient-to-r from-#F39C12 to-#E67E22 rounded-full border-2 border-white shadow-sm>/div>        div classw-5 h-5 bg-gradient-to-r from-#E6EBF0 to-#CBD7E0 rounded-full border-2 border-white shadow-sm>/div>        span classtext-xs text-var(--text-light) ml-2 font-medium>Trust-building colors/span>      /div>    /div>  /div>  !-- Site 2 - Hobby Site -->  div classgroup relative bg-white rounded-3xl shadow-xl border-2 border-gray-400 hover:border-var(--success) overflow-hidden hover:shadow-2xl transition-all duration-300 cursor-pointer lightbox-trigger data-imageimg/knitcraft.webp data-titleHobby Site - Custom branding with personalized logo and color scheme data-aoszoom-in data-aos-delay200>    !-- Site Screenshot -->    div classrelative overflow-hidden>      img srcimg/knitcraft-thumb.webp  width360 height211 altHobby Site Screenshot classw-full h-48 object-cover group-hover:scale-105 transition-transform duration-300 loadinglazy decodingasync>            !-- Hover Overlay -->      div classabsolute inset-0 bg-black bg-opacity-0 group-hover:bg-opacity-30 transition-all duration-300 flex items-center justify-center>        div classopacity-0 group-hover:opacity-100 transition-opacity duration-300>          div classw-14 h-14 bg-white rounded-full flex items-center justify-center shadow-lg>            i classph-bold ph-magnifying-glass-plus text-var(--primary) text-2xl>/i>          /div>        /div>      /div>    /div>        !-- Logo & Brand Info -->    div classp-6 border-t-2 border-gray-100>      !-- Centered Logo -->      div classflex justify-center mb-6>        div classw-32 h-24 bg-gray-50 rounded-2xl p-3 shadow-lg border border-gray-200>          img srcimg/knit-logo.png width102 height70 altCustom Logo classw-full h-full object-contain loadinglazy decodingasync>        /div>      /div>            !-- Site Info -->      div classtext-center mb-4>        h3 classtext-lg font-bold text-var(--primary)>Hobby Site/h3>        p classtext-sm text-var(--text-light)>Custom branding & optimization/p>      /div>            !-- Colors -->      div classflex items-center justify-center gap-2>        div classw-5 h-5 bg-gradient-to-r from-#4A7B99 to-#3A6B89 rounded-full border-2 border-white shadow-sm>/div>        div classw-5 h-5 bg-gradient-to-r from-#F49A20 to-#E68A00 rounded-full border-2 border-white shadow-sm>/div>        div classw-5 h-5 bg-gradient-to-r from-#7BA969 to-#6B9A59 rounded-full border-2 border-white shadow-sm>/div>        span classtext-xs text-var(--text-light) ml-2 font-medium>Custom color palette/span>      /div>    /div>  /div>  !-- Site 3 - Local Site 2 -->  div classgroup relative bg-white rounded-3xl shadow-xl border-2 border-gray-400 hover:border-var(--primary) overflow-hidden hover:shadow-2xl transition-all duration-300 cursor-pointer lightbox-trigger data-imageimg/local-2.webp data-titleLocal Business 2 - different local business site data-aoszoom-in data-aos-delay380>    !-- Site Screenshot -->    div classrelative overflow-hidden>      img srcimg/local-2-thumb.webp  width360 height211 altSales Funnel Screenshot classw-full h-48 object-cover group-hover:scale-105 transition-transform duration-300 loadinglazy decodingasync>            !-- Hover Overlay -->      div classabsolute inset-0 bg-black bg-opacity-0 group-hover:bg-opacity-30 transition-all duration-300 flex items-center justify-center>        div classopacity-0 group-hover:opacity-100 transition-opacity duration-300>          div classw-14 h-14 bg-white rounded-full flex items-center justify-center shadow-lg>            i classph-bold ph-magnifying-glass-plus text-var(--primary) text-2xl>/i>          /div>        /div>      /div>    /div>        !-- Logo & Brand Info -->    div classp-6 border-t-2 border-gray-100>      !-- Centered Logo -->      div classflex justify-center mb-6>        div classw-32 h-24 bg-gray-50 rounded-2xl p-3 shadow-lg border border-gray-200>          img srcimg/lock-logo2.png width102 height70 altCustom Logo classw-full h-full object-contain loadinglazy decodingasync>        /div>      /div>            !-- Site Info -->      div classtext-center mb-4>        h3 classtext-lg font-bold text-var(--primary)>Local Site 2/h3>        p classtext-sm text-var(--text-light)>Conversion-focused design/p>      /div>            !-- Colors -->      div classflex items-center justify-center gap-2>        div classw-5 h-5 bg-gradient-to-r from-#2C3E50 to-#34495E rounded-full border-2 border-white shadow-sm>/div>        div classw-5 h-5 bg-gradient-to-r from-#F39C12 to-#E67E22 rounded-full border-2 border-white shadow-sm>/div>        div classw-5 h-5 bg-gradient-to-r from-#E6EBF0 to-#CBD7E0 rounded-full border-2 border-white shadow-sm>/div>        span classtext-xs text-var(--text-light) ml-2 font-medium>Trust-building colors/span>      /div>    /div>  /div>  !-- Site 4 - Authority Blog -->  div classgroup relative bg-white rounded-3xl shadow-xl border-2 border-gray-400 hover:border-var(--accent) overflow-hidden hover:shadow-2xl transition-all duration-300 cursor-pointer lightbox-trigger data-imageimg/blog.webp data-titleAuthority Blog - Custom editorial design with unique voice and branding data-aoszoom-in data-aos-delay320>    !-- Site Screenshot -->    div classrelative overflow-hidden>      img srcimg/blog-thumb.webp  width360 height211 altAuthority Blog Screenshot classw-full h-48 object-cover group-hover:scale-105 transition-transform duration-300 loadinglazy decodingasync>            !-- Hover Overlay -->      div classabsolute inset-0 bg-black bg-opacity-0 group-hover:bg-opacity-30 transition-all duration-300 flex items-center justify-center>        div classopacity-0 group-hover:opacity-100 transition-opacity duration-300>          div classw-14 h-14 bg-white rounded-full flex items-center justify-center shadow-lg>            i classph-bold ph-magnifying-glass-plus text-var(--primary) text-2xl>/i>          /div>        /div>      /div>    /div>        !-- Logo & Brand Info -->    div classp-6 border-t-2 border-gray-100>      !-- Centered Logo -->      div classflex justify-center mb-6>        div classw-32 h-24 bg-gray-50 rounded-2xl p-3 shadow-lg border border-gray-200>          img srcimg/bb-logo.png width102 height70 altCustom Logo classw-full h-full object-contain loadinglazy decodingasync>        /div>      /div>            !-- Site Info -->      div classtext-center mb-4>        h3 classtext-lg font-bold text-var(--primary)>Authority Blog/h3>        p classtext-sm text-var(--text-light)>Editorial design & unique voice/p>      /div>            !-- Colors -->      div classflex items-center justify-center gap-2>        div classw-5 h-5 bg-gradient-to-r from-#4A2C2A to-#3A201E rounded-full border-2 border-white shadow-sm>/div>        div classw-5 h-5 bg-gradient-to-r from-#F2A44B to-#E6943D rounded-full border-2 border-white shadow-sm>/div>        div classw-5 h-5 bg-gradient-to-r from-#B88B5F to-#A67B52 rounded-full border-2 border-white shadow-sm>/div>        span classtext-xs text-var(--text-light) ml-2 font-medium>Editorial palette/span>      /div>    /div>  /div>/div>    !-- Bottom Highlight -->    div classtext-center data-aosfade-up data-aos-delay500>      div classbg-white rounded-3xl shadow-xl border-2 border-gray-200 p-8 md:p-12 max-w-4xl mx-auto>              h3 classheadline-font text-3xl md:text-4xl font-bold font-poppins text-var(--primary) mb-4 leading-tight >         Your Site. Your Brand. Your Style.        /h3>     p classtext-lg text-var(--text-light) leading-relaxed mb-6>  AI-Personalized Templates. No Cookie-Cutter Designs. Each Site Gets Custom Branding, Unique Color Palettes,   Personalized Layouts, and Content Written in Your Brands Voice./p>        !--p classtext-xl font-semibold text-var(--success)>      Your Brand, Your Style, Your Competitive Advantage.        /p>-->      /div>    /div>    !-- Transition to Dashboard -->    div classtext-center mt-16 data-aosfade-up data-aos-delay600>      p classtext-lg font-semibold text-var(--primary) mb-4>       Now See How Easy It Is to Manage All Your Traffic Assets...      /p>      div classw-32 h-1 bg-gradient-to-r from-var(--success) to-emerald-400 mx-auto rounded-full>/div>    /div>  /div>!-- Just a placeholder - the actual lightbox will be created by JavaScript -->div idlightbox-placeholder styledisplay: none;>/div>/section>script>document.addEventListener(DOMContentLoaded, function() {  const triggers  document.querySelectorAll(.lightbox-trigger);  let lightboxElement  null;  let savedScrollY  0;  let pausedInlineVideo  null; // remember the small inline video we paused  // CSS injected for both images and videos  const lightboxCSS  `    .dynamic-lightbox {      position: fixed !important;      inset: 0 !important;      width: 100vw !important;      height: 100vh !important;      background: rgba(0, 0, 0, 0.9) !important;      z-index: 2147483647 !important; /* ensure its above everything */      display: flex !important;      align-items: center !important;      justify-content: center !important;      padding: 20px !important;      box-sizing: border-box !important;      overflow: hidden !important; /* prevent page scrollbars */    }    .dynamic-lightbox .lb-media {      max-width: 90vw !important;      max-height: 85vh !important;      object-fit: contain !important;      border-radius: 12px !important;      box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25) !important;      display: block !important;    }    .dynamic-lightbox-close {      position: fixed !important; /* relative to viewport */      top: 20px !important;      right: 20px !important;      width: 48px !important;      height: 48px !important;      background: rgba(255, 255, 255, 0.2) !important;      border: none !important;      border-radius: 50% !important;      color: white !important;      font-size: 24px !important;      cursor: pointer !important;      display: flex !important;      align-items: center !important;      justify-content: center !important;      z-index: 2147483647 !important; /* above the media */      transition: background 0.3s ease !important;    }    .dynamic-lightbox-close:hover {      background: rgba(255, 255, 255, 0.3) !important;    }    body.lightbox-no-scroll {      overflow: hidden !important;      position: fixed !important;      width: 100% !important;    }  `;  // Inject CSS once  const style  document.createElement(style);  style.textContent  lightboxCSS;  document.head.appendChild(style);  function openLightboxWithImage(imageSrc, title) {    buildLightbox(() > {      const img  document.createElement(img);      img.src  imageSrc;      img.alt  title || Lightbox image;      img.className  lb-media;      // Prevent context menu on image      img.addEventListener(contextmenu, e > e.preventDefault());      return img;    });  }  function openLightboxWithVideo(sources, title, inlineVideoEl) {    buildLightbox(() > {      // Pause the small inline video so you dont hear/see two at once (even muted, it saves CPU)      if (inlineVideoEl && !inlineVideoEl.paused) {        pausedInlineVideo  inlineVideoEl;        inlineVideoEl.pause();      }      const vid  document.createElement(video);      vid.className  lb-media;      vid.autoplay  true;      vid.loop  true;      vid.muted  true;      // ensures autoplay everywhere      vid.playsInline  true;      // Add sources (prefer WEBM, then MP4)      if (sources.webm) {        const s  document.createElement(source);        s.src  sources.webm;        s.type  video/webm;        vid.appendChild(s);      }      if (sources.mp4) {        const s  document.createElement(source);        s.src  sources.mp4;        s.type  video/mp4;        vid.appendChild(s);      }      // Start playback      vid.addEventListener(canplay, () > { vid.play().catch(()>{}); }, { once: true });      // Clicking the dark background closes; clicking the video does NOT      return vid;    });  }  function buildLightbox(contentFactory) {    savedScrollY  window.pageYOffset;    lightboxElement  document.createElement(div);    lightboxElement.className  dynamic-lightbox;    const closeBtn  document.createElement(button);    closeBtn.className  dynamic-lightbox-close;    closeBtn.innerHTML  ×;    closeBtn.setAttribute(aria-label, Close lightbox);    const mediaEl  contentFactory();    lightboxElement.appendChild(mediaEl);    lightboxElement.appendChild(closeBtn);    // Freeze body scroll    document.body.style.top  `-${savedScrollY}px`;    document.body.classList.add(lightbox-no-scroll);    document.body.appendChild(lightboxElement);    // Close when clicking backdrop (but not the media)    lightboxElement.addEventListener(click, function(e) {      if (e.target  lightboxElement) closeLightbox();    });    closeBtn.addEventListener(click, closeLightbox);  }  function closeLightbox() {  if (!lightboxElement) return;  // Stop any playing video to free resources  const vid  lightboxElement.querySelector(video);  if (vid) {    vid.pause();    vid.removeAttribute(src);    vid.innerHTML  ; // remove source> children to stop network  }    // SMOOTH RESTORATION - no jump  // First restore the body styles without scrolling  document.body.classList.remove(lightbox-no-scroll);  const topValue  document.body.style.top;  document.body.style.top  ;    // Remove lightbox  document.body.removeChild(lightboxElement);  lightboxElement  null;    // Restore scroll position smoothly using the saved value  if (savedScrollY && savedScrollY > 0) {    // Use smooth behavior if supported, otherwise instant    window.scrollTo({      top: savedScrollY,      behavior: instant  // This prevents the jump effect    });  }    // Resume the small inline video if we paused it  if (pausedInlineVideo) {    pausedInlineVideo.play().catch(()>{});    pausedInlineVideo  null;  }}  // Set up triggers (supports both image and video)  triggers.forEach(trigger > {    trigger.addEventListener(click, function(e) {      e.preventDefault();      e.stopPropagation();      const el  this;      // 1) If its wired like your original images:      const imageSrc  el.dataset.image;      if (imageSrc && !el.dataset.videoWebm && !el.dataset.videoMp4) {        return openLightboxWithImage(imageSrc, el.dataset.title);      }      // 2) Video via data attributes (recommended for your video> thumbnails)      const videoWebm  el.dataset.videoWebm;      const videoMp4   el.dataset.videoMp4;      if (videoWebm || videoMp4) {        return openLightboxWithVideo({ webm: videoWebm, mp4: videoMp4 }, el.dataset.title, el.tagName  VIDEO ? el : null);      }      // 3) Fallback: if the trigger is a video> without data- attrs, try to read its source> children      if (el.tagName  VIDEO) {        const sWebm  el.querySelector(sourcetypevideo/webm)?.src || ;        const sMp4   el.querySelector(sourcetypevideo/mp4)?.src  || el.currentSrc || ;        if (sWebm || sMp4) {          return openLightboxWithVideo({ webm: sWebm, mp4: sMp4 }, el.getAttribute(aria-label) || , el);        }      }      // 4) Final fallback: if its an img> without data-image, use its src      if (el.tagName  IMG && el.src) {        return openLightboxWithImage(el.src, el.alt || );      }    });  });  // Global escape key handler  document.addEventListener(keydown, function(e) {    if (e.key  Escape && lightboxElement) {      closeLightbox();    }  });});/script>!-- Video Testimonial 1 - Carin (Simplified Video Embed) -->section stylebackground: linear-gradient(135deg, #1E40AF 0%, #3B82F6 100%); padding: 4rem 1.5rem; margin: 0; position: relative; overflow: hidden; data-aosfade-up>  !-- Background Elements -->  div styleposition: absolute; inset: 0; opacity: 0.08;>    div styleposition: absolute; top: 15%; left: 8%; width: 120px; height: 120px; background: #F59E0B; border-radius: 50%; filter: blur(45px);>/div>    div styleposition: absolute; bottom: 25%; right: 12%; width: 90px; height: 90px; background: #10B981; border-radius: 50%; filter: blur(35px);>/div>  /div>    div stylemax-width: 1200px; margin: 0 auto; position: relative; z-index: 10;>    !-- Header Section -->    div styletext-align: center; margin-bottom: 3.5rem;>      div styledisplay: inline-flex; align-items: center; gap: 0.75rem; background: rgba(245, 158, 11, 0.15); border: 1px solid rgba(245, 158, 11, 0.35); padding: 0.75rem 1.5rem; border-radius: 30px; margin-bottom: 2rem;>        span stylefont-size: 1.3rem;>⭐/span>        span stylecolor: #FDE68A; font-weight: 700; font-size: 0.95rem; letter-spacing: 0.5px; text-transform: uppercase;>25-Year Web Expert Testimonial/span>      /div>            h3 stylefont-family: Poppins, sans-serif; font-size: clamp(2.25rem, 4.5vw, 3.25rem); font-weight: 900; color: white; margin: 0 0 1.5rem 0; line-height: 1.1; letter-spacing: -0.025em;>        Digital Marketing Agency Owner:br>        span stylecolor: #F59E0B; display: block; margin-top: 0.5rem;>Built 20 Sites With Just Clicks/span>      /h3>            p stylecolor: rgba(255, 255, 255, 0.9); font-size: 1.25rem; font-weight: 500; margin: 0 0 1rem 0; max-width: 700px; margin-left: auto; margin-right: auto; line-height: 1.6;>        25 years building websites. Owns a digital marketing agency. 15-year relationship with our founder.      /p>    /div>    !-- Video Container - Simplified -->    div stylemax-width: 800px; margin: 0 auto 3rem auto;>      div styleposition: relative; background: #000; border-radius: 20px; overflow: hidden; box-shadow: 0 20px 40px rgba(0,0,0,0.4);>        div styleposition: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;>          iframe             srchttps://www.youtube.com/embed/OC8XbebgGD0             frameborder0             allowfullscreen            styleposition: absolute; top: 0; left: 0; width: 100%; height: 100%;>          /iframe>        /div>      /div>    /div>    !-- Credentials Grid -->    div styledisplay: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 2rem; max-width: 1000px; margin: 0 auto;>            !-- Credentials Card -->      div stylebackground: rgba(255, 255, 255, 0.95); border-radius: 20px; padding: 2rem;>        h4 stylefont-family: Poppins, sans-serif; font-size: 1.5rem; font-weight: 800; color: #1E40AF; margin: 0 0 1.5rem 0; text-align: center;>          Expert Credentials        /h4>                div styledisplay: flex; align-items: center; gap: 1rem; margin-bottom: 1rem;>          div stylewidth: 12px; height: 12px; background: #10B981; border-radius: 50%;>/div>          span stylecolor: #1F2937; font-weight: 600;>25 years building websites/span>        /div>                div styledisplay: flex; align-items: center; gap: 1rem; margin-bottom: 1rem;>          div stylewidth: 12px; height: 12px; background: #3B82F6; border-radius: 50%;>/div>          span stylecolor: #1F2937; font-weight: 600;>Owns digital marketing agency/span>        /div>                div styledisplay: flex; align-items: center; gap: 1rem;>          div stylewidth: 12px; height: 12px; background: #F59E0B; border-radius: 50%;>/div>          span stylecolor: #1F2937; font-weight: 600;>15-year customer relationship/span>        /div>      /div>      !-- Results Card -->      div stylebackground: linear-gradient(135deg, #10B981 0%, #059669 100%); border-radius: 20px; padding: 2rem; color: white;>        h4 stylefont-family: Poppins, sans-serif; font-size: 1.5rem; font-weight: 800; margin: 0 0 1.5rem 0; text-align: center;>          Beta Testing Results        /h4>                div styletext-align: center; margin-bottom: 1.5rem;>          div stylefont-size: 3rem; font-weight: 900; line-height: 1; margin-bottom: 0.5rem;>20/div>          div stylefont-size: 1.1rem; font-weight: 600;>Websites Built/div>          div stylefont-size: 0.95rem; opacity: 0.8; margin-top: 0.25rem;>With just clicks/div>        /div>                div stylebackground: rgba(255, 255, 255, 0.15); border-radius: 12px; padding: 1rem;>          p stylefont-style: italic; font-size: 0.95rem; margin: 0; text-align: center;>            I can always depend on getting the support I need and his software is just amazing.          /p>        /div>      /div>    /div>  /div>/section>section classw-full bg-gradient-to-br from-slate-50 to-blue-50 py-3.75rem px-6 relative overflow-hidden data-aosfade-up>  !-- Subtle Background Pattern -->  div classabsolute inset-0 opacity-5>    div classabsolute top-20 left-10 w-32 h-32 bg-var(--secondary) rounded-full blur-3xl>/div>    div classabsolute bottom-20 right-10 w-40 h-40 bg-var(--accent) rounded-full blur-3xl>/div>    div classabsolute top-1/2 left-1/2 w-24 h-24 bg-var(--success) rounded-full blur-2xl>/div>  /div>    div classmax-w-7xl mx-auto relative z-10>    !-- Header Section -->    div classtext-center mb-20 data-aosfade-in data-aos-delay100>            h2 classtext-4xl md:text-6xl font-black font-poppins text-var(--primary) mb-4 tracking-tight>        One Dashboard. Total Control.      /h2>      h3 classtext-2xl md:text-3xl font-bold text-var(--accent) mb-8>        The EziStack Dashboard      /h3>      p classtext-xl md:text-2xl text-var(--text) max-w-4xl mx-auto leading-relaxed font-medium>        Heres what youll see when you log in — span classtext-var(--secondary) font-bold>Everything You Need to Build, Manage, and Scale Traffic Assets/span>      /p>	     /div>     !-- Zigzag Feature Showcase -->    div classspace-y-24>      !-- Feature 1 - Image Left, Content Right -->      div classgrid lg:grid-cols-2 gap-16 items-center data-aosfade-up data-aos-delay200>        div classrelative group>          div classabsolute -inset-4 bg-gradient-to-r from-var(--secondary) to-var(--primary) rounded-3xl blur-lg opacity-20 group-hover:opacity-30 transition-opacity duration-300>/div>          div classrelative bg-white rounded-3xl shadow-2xl border border-gray-200 p-2 overflow-hidden>            !-- Dashboard Screenshot Container -->      div classbg-gray-50 rounded-2xl min-h-300px flex flex-col items-center justify-center border-2 border-dashed border-gray-300> video classdemo-video w-full h-full object-contain rounded-lg cursor-zoom-in lightbox-trigger muted autoplay loop playsinline preloadmetadata styleaspect-ratio:586/329 posterdata:image/svg+xml,%3Csvg xmlnshttp://www.w3.org/2000/svg viewBox0 0 586 329%3E%3Crect width586 height329 fill%23f3f4f6/%3E%3Ccircle cx293 cy164 r46 fillnone stroke%239ca3af stroke-width4/%3E%3Cpolygon points280,146 320,164 280,182 fill%239ca3af/%3E%3C/svg%3E data-video-webmimg/dashboard-gif.webm data-video-mp4img/dashboard-gif.mp4 aria-labelMultiple Site Management>/video> /div>div classflex justify-center>      div classinline-flex items-center bg-white bg-opacity-80 rounded-full shadow-lg border border-white>        i classph-bold ph-magnifying-glass-plus text-red-600 text-lg>/i>        span classtext-sm font-medium text-red-600 >Click to Enlarge/span>      /div>	  /div>          /div>          !-- Floating Icon -->          div classabsolute -top-6 -right-6 w-16 h-16 bg-gradient-to-br from-var(--secondary) to-blue-400 rounded-2xl shadow-xl flex items-center justify-center>            i classph-bold ph-squares-four text-2xl text-white>/i>          /div>        /div>        div classspace-y-6>          h3 classtext-3xl md:text-4xl font-bold text-var(--primary) leading-tight>            Manage Your Entire Portfolio          /h3>          p classtext-lg md:text-xl text-var(--text-light) leading-relaxed> Control all your sites across AWS, Azure, GCP, and more — from one simple dashboard. Select, edit, and deploy with ease.          /p>          div classspace-y-4>            div classflex items-center gap-4>              div classw-8 h-8 bg-var(--secondary) rounded-lg flex items-center justify-center>                i classph-bold ph-check text-white text-sm>/i>              /div>              span classtext-lg text-var(--text)>Multi-Cloud Site Management/span>            /div>            div classflex items-center gap-4>              div classw-8 h-8 bg-var(--secondary) rounded-lg flex items-center justify-center>                i classph-bold ph-check text-white text-sm>/i>              /div>              span classtext-lg text-var(--text)>Edit & Update Sites Instantly/span>            /div>            div classflex items-center gap-4>              div classw-8 h-8 bg-var(--secondary) rounded-lg flex items-center justify-center>                i classph-bold ph-check text-white text-sm>/i>              /div>              span classtext-lg text-var(--text)>One-Click Deployment/span>            /div>          /div>        /div>      /div>      !-- Feature 2 - Content Left, Image Right -->      div classgrid lg:grid-cols-2 gap-16 items-center data-aosfade-up data-aos-delay300>        div classspace-y-6>          h3 classtext-3xl md:text-4xl font-bold text-var(--primary) leading-tight>            Simple 3-Step Workflow          /h3>          p classtext-lg md:text-xl text-var(--text-light) leading-relaxed>     Go from setup to a live site in minutes. No coding or technical skills required.          /p>          div classspace-y-4>            div classflex items-center gap-4>              div classw-8 h-8 bg-var(--accent) rounded-lg flex items-center justify-center>                span classtext-white text-sm font-bold>1/span>              /div>              span classtext-lg text-var(--text)>Enter Your Site Details/span>            /div>            div classflex items-center gap-4>              div classw-8 h-8 bg-var(--accent) rounded-lg flex items-center justify-center>                span classtext-white text-sm font-bold>2/span>              /div>              span classtext-lg text-var(--text)>Pick a Template Style/span>            /div>            div classflex items-center gap-4>              div classw-8 h-8 bg-var(--accent) rounded-lg flex items-center justify-center>                span classtext-white text-sm font-bold>3/span>              /div>              span classtext-lg text-var(--text)>Add Keyword, Configure Posts & Go Live/span>            /div>          /div>        /div>        div classrelative group>          div classabsolute -inset-4 bg-gradient-to-r from-var(--accent) to-orange-400 rounded-3xl blur-lg opacity-20 group-hover:opacity-30 transition-opacity duration-300>/div>          div classrelative bg-white rounded-3xl shadow-2xl border border-gray-200 p-2 overflow-hidden>            !-- 3-Step Process GIF Container -->            div classbg-gray-50 rounded-2xl min-h-300px flex flex-col items-center justify-center border-2 border-dashed border-gray-300>         video classdemo-video w-full h-full object-contain rounded-lg cursor-zoom-in lightbox-trigger muted autoplay loop playsinline preloadmetadata styleaspect-ratio:586/329 posterdata:image/svg+xml,%3Csvg xmlnshttp://www.w3.org/2000/svg viewBox0 0 586 329%3E%3Crect width586 height329 fill%23f3f4f6/%3E%3Ccircle cx293 cy164 r46 fillnone stroke%239ca3af stroke-width4/%3E%3Cpolygon points280,146 320,164 280,182 fill%239ca3af/%3E%3C/svg%3E data-video-webmimg/3step-gif.webm data-video-mp4img/3step-gif.mp4 aria-label3 step site creation>/video>            			/div>			div classflex justify-center>      div classinline-flex items-center bg-white bg-opacity-80 rounded-full shadow-lg border border-white>        i classph-bold ph-magnifying-glass-plus text-red-600 text-lg>/i>        span classtext-sm font-medium text-red-600 >Click to Enlarge/span>      /div>	  /div>          /div>          !-- Floating Icon -->          div classabsolute -top-6 -right-6 w-16 h-16 bg-gradient-to-br from-var(--accent) to-orange-400 rounded-2xl shadow-xl flex items-center justify-center>            i classph-bold ph-steps text-2xl text-white>/i>          /div>        /div>      /div>      !-- Feature 3 - Image Left, Content Right -->      div classgrid lg:grid-cols-2 gap-16 items-center data-aosfade-up data-aos-delay400>        div classrelative group order-2 lg:order-1>          div classabsolute -inset-4 bg-gradient-to-r from-var(--success) to-green-400 rounded-3xl blur-lg opacity-20 group-hover:opacity-30 transition-opacity duration-300>/div>          div classrelative bg-white rounded-3xl shadow-2xl border border-gray-200 p-2 overflow-hidden>            !-- Visual Editor Screenshot/GIF Container -->            div classbg-gray-50 rounded-2xl min-h-300px flex flex-col items-center justify-center border-2 border-dashed border-gray-300>         video classdemo-video w-full h-full object-contain rounded-lg cursor-zoom-in lightbox-trigger muted autoplay loop playsinline preloadmetadata styleaspect-ratio:586/329 posterdata:image/svg+xml,%3Csvg xmlnshttp://www.w3.org/2000/svg viewBox0 0 586 329%3E%3Crect width586 height329 fill%23f3f4f6/%3E%3Ccircle cx293 cy164 r46 fillnone stroke%239ca3af stroke-width4/%3E%3Cpolygon points280,146 320,164 280,182 fill%239ca3af/%3E%3C/svg%3E data-video-webmimg/builder-gif.webm data-video-mp4img/builder-gif.mp4 aria-labelNo code editor>/video>            /div>			div classflex justify-center>      div classinline-flex items-center bg-white bg-opacity-80 rounded-full shadow-lg border border-white>        i classph-bold ph-magnifying-glass-plus text-red-600 text-lg>/i>        span classtext-sm font-medium text-red-600 >Click to Enlarge/span>      /div>	  /div>          /div>          !-- Floating Icon -->          div classabsolute -top-6 -right-6 w-16 h-16 bg-gradient-to-br from-var(--success) to-green-400 rounded-2xl shadow-xl flex items-center justify-center>            i classph-bold ph-mouse text-2xl text-white>/i>          /div>        /div>        div classspace-y-6 order-1 lg:order-2>          h3 classtext-3xl md:text-4xl font-bold text-var(--primary) leading-tight>            No-Code Visual Editor          /h3>          p classtext-lg md:text-xl text-var(--text-light) leading-relaxed>         Design pages with complete freedom. Edit on a live canvas or fine-tune layouts with the absolute positioning editor - all with instant previews.          /p>          div classspace-y-4>            div classflex items-center gap-4>              div classw-8 h-8 bg-var(--success) rounded-lg flex items-center justify-center>                i classph-bold ph-check text-white text-sm>/i>              /div>              span classtext-lg text-var(--text)>Point, Click & Edit/span>            /div>            div classflex items-center gap-4>              div classw-8 h-8 bg-var(--success) rounded-lg flex items-center justify-center>                i classph-bold ph-check text-white text-sm>/i>              /div>              span classtext-lg text-var(--text)>Precision Layout Control/span>            /div>            div classflex items-center gap-4>              div classw-8 h-8 bg-var(--success) rounded-lg flex items-center justify-center>                i classph-bold ph-check text-white text-sm>/i>              /div>              span classtext-lg text-var(--text)>One-Click Save & Publish/span>            /div>          /div>        /div>      /div>	  	  !--Image editing-->	   div classgrid lg:grid-cols-2 gap-16 items-center data-aosfade-up data-aos-delay300>        div classspace-y-6>          h3 classtext-3xl md:text-4xl font-bold text-var(--primary) leading-tight>            Powerful Media Manager          /h3>          p classtext-lg md:text-xl text-var(--text-light) leading-relaxed>    Quickly organize, edit, and enhance your images—no extra software needed.          /p>          div classspace-y-4>            div classflex items-center gap-4>                             div classw-8 h-8 bg-var(--secondary) rounded-lg flex items-center justify-center>                i classph-bold ph-check text-white text-sm>/i>              /div>                         span classtext-lg text-var(--text)>Crop & resize in seconds/span>            /div>            div classflex items-center gap-4>                            div classw-8 h-8 bg-var(--secondary) rounded-lg flex items-center justify-center>                i classph-bold ph-check text-white text-sm>/i>                      /div>              span classtext-lg text-var(--text)>Add text or captions/span>            /div>            div classflex items-center gap-4>                      div classw-8 h-8 bg-var(--secondary) rounded-lg flex items-center justify-center>                i classph-bold ph-check text-white text-sm>/i>              /div>                            span classtext-lg text-var(--text)>Save & Use Instantly/span>            /div>          /div>        /div>        div classrelative group>          div classabsolute -inset-4 bg-gradient-to-r from-var(--secondary) to-blue-400 rounded-3xl blur-lg opacity-20 group-hover:opacity-30 transition-opacity duration-300>/div>          div classrelative bg-white rounded-3xl shadow-2xl border border-gray-200 p-2 overflow-hidden>            !-- 3-Step Process GIF Container -->            div classbg-gray-50 rounded-2xl min-h-300px flex flex-col items-center justify-center border-2 border-dashed border-gray-300>     video classdemo-video w-full h-full object-contain rounded-lg cursor-zoom-in lightbox-trigger muted autoplay loop playsinline preloadmetadata styleaspect-ratio:586/329 posterdata:image/svg+xml,%3Csvg xmlnshttp://www.w3.org/2000/svg viewBox0 0 586 329%3E%3Crect width586 height329 fill%23f3f4f6/%3E%3Ccircle cx293 cy164 r46 fillnone stroke%239ca3af stroke-width4/%3E%3Cpolygon points280,146 320,164 280,182 fill%239ca3af/%3E%3C/svg%3E data-video-webmimg/edit-images-gif.webm data-video-mp4img/edit-images-gif.mp4 aria-labelEdit Images>/video>            /div>			div classflex justify-center>      div classinline-flex items-center bg-white bg-opacity-80 rounded-full shadow-lg border border-white>        i classph-bold ph-magnifying-glass-plus text-red-600 text-lg>/i>        span classtext-sm font-medium text-red-600 >Click to Enlarge/span>      /div>	  /div>          /div>          !-- Floating Icon -->          div classabsolute -top-6 -right-6 w-16 h-16 bg-gradient-to-br from-var(--secondary) to-blue-400 rounded-2xl shadow-xl flex items-center justify-center>            i classph-bold ph-steps text-2xl text-white>/i>          /div>        /div>      /div>	  	   !-- Edit Posts -->      div classgrid lg:grid-cols-2 gap-16 items-center data-aosfade-up data-aos-delay400>        div classrelative group order-2 lg:order-1>          div classabsolute -inset-4 bg-gradient-to-r from-var(--accent) to-orange-400 rounded-3xl blur-lg opacity-20 group-hover:opacity-30 transition-opacity duration-300>/div>          div classrelative bg-white rounded-3xl shadow-2xl border border-gray-200 p-2 overflow-hidden>            !-- Visual Editor Screenshot/GIF Container -->            div classbg-gray-50 rounded-2xl min-h-300px flex flex-col items-center justify-center border-2 border-dashed border-gray-300>             video classdemo-video w-full h-full object-contain rounded-lg cursor-zoom-in lightbox-trigger muted autoplay loop playsinline preloadmetadata styleaspect-ratio:586/329 posterdata:image/svg+xml,%3Csvg xmlnshttp://www.w3.org/2000/svg viewBox0 0 586 329%3E%3Crect width586 height329 fill%23f3f4f6/%3E%3Ccircle cx293 cy164 r46 fillnone stroke%239ca3af stroke-width4/%3E%3Cpolygon points280,146 320,164 280,182 fill%239ca3af/%3E%3C/svg%3E data-video-webmimg/edit-post-gif.webm data-video-mp4img/edit-post-gif.mp4 aria-labelEdit Post Demo>/video>            /div>			div classflex justify-center>      div classinline-flex items-center bg-white bg-opacity-80 rounded-full shadow-lg border border-white>        i classph-bold ph-magnifying-glass-plus text-red-600 text-lg>/i>        span classtext-sm font-medium text-red-600 >Click to Enlarge/span>      /div>	  /div>          /div>          !-- Floating Icon -->          div classabsolute -top-6 -right-6 w-16 h-16 bg-gradient-to-br from-var(--accent) to-orange-400 rounded-2xl shadow-xl flex items-center justify-center>            i classph-bold ph-mouse text-2xl text-white>/i>          /div>        /div>        div classspace-y-6 order-1 lg:order-2>          h3 classtext-3xl md:text-4xl font-bold text-var(--primary) leading-tight>           Intuitive Post Editor          /h3>          p classtext-lg md:text-xl text-var(--text-light) leading-relaxed>         Write, edit, and optimize content with ease - no learning curve required.          /p>          div classspace-y-4>            div classflex items-center gap-4>              div classw-8 h-8 bg-var(--accent) rounded-lg flex items-center justify-center>                i classph-bold ph-check text-white text-sm>/i>              /div>              span classtext-lg text-var(--text)>Familiar WYSIWYG editing/span>            /div>            div classflex items-center gap-4>              div classw-8 h-8 bg-var(--accent) rounded-lg flex items-center justify-center>                i classph-bold ph-check text-white text-sm>/i>              /div>              span classtext-lg text-var(--text)>Change images, categories & metadata/span>            /div>            div classflex items-center gap-4>              div classw-8 h-8 bg-var(--accent) rounded-lg flex items-center justify-center>                i classph-bold ph-check text-white text-sm>/i>              /div>              span classtext-lg text-var(--text)>Publish instantly with one click/span>            /div>          /div>        /div>      /div>	      /div>    !-- Bottom CTA Section -->    div classtext-center mt-20 data-aosfade-up data-aos-delay500>      p classtext-xl md:text-2xl font-bold text-var(--primary) mb-8 flex items-center justify-center gap-3>        i classph-bold ph-sparkle text-var(--accent) text-3xl>/i>        Everything You Need in One Intuitive Interface — No Juggling Multiple Tools      /p>        /div>		button onclicksmoothScrollToGetStarted() styledisplay:block;width:100%;max-width:420px;background:var(--accent);color:white;font-family:Poppins,sans-serif;font-weight:700;font-size:18px;padding:18px 32px;border-radius:50px;text-align:center;border:2px solid var(--primary);cursor:pointer;transition:all 0.3s ease;margin:4rem auto 0 auto;box-shadow:0 8px 24px rgba(30,64,175,0.3);position:relative;z-index:10;>  Get Instant Access to EziStack/button>	  /div>/section>script>(function () {  // 🔧 TUNING KNOBS  const ACTIVATE_THRESHOLD  0.40;   // was 0.60 → start ~10% earlier  const DEBOUNCE_MS         150;    // leave as-is unless you see flicker  const BOTTOM_GUARD        -10%; // was -30% → allow activation earlier  const HYDRATE_MARGIN      600px 0px 600px 0px; // start buffering when ~600px away  const vids  Array.from(document.querySelectorAll(video.demo-video));  const reduceMotion  window.matchMedia((prefers-reduced-motion: reduce)).matches;  let active  null, switchTmr  null;  function hydrate(v){    if (v.dataset.hydrated) return;    v.muted  true; v.defaultMuted  true;    v.setAttribute(playsinline,); v.setAttribute(webkit-playsinline,);    const wv.dataset.videoWebm, mv.dataset.videoMp4;    if (w){ const sdocument.createElement(source); s.srcw; s.typevideo/webm; v.appendChild(s); }    if (m){ const sdocument.createElement(source); s.srcm; s.typevideo/mp4;  v.appendChild(s); }    v.dataset.hydrated1;    v.load();  }  function hideSkeleton(v){    const skel  v.parentElement.querySelector(.video-skeleton);    if (skel) skel.classList.add(hidden);  }  function playIfAllowed(v){    if (reduceMotion || document.visibilityState ! visible) return;    v.play().catch(()>{});  }  function activate(next){    if (next && next ! active){      hydrate(next);      hideSkeleton(next);      playIfAllowed(next);      if (active && active ! next) active.pause();      active  next;    }  }  // 1) Early HYDRATION (starts download before it comes into view)  const ioHydrate  new IntersectionObserver((entries) > {    entries.forEach(e > { if (e.isIntersecting) hydrate(e.target); });  }, { root: null, rootMargin: HYDRATE_MARGIN, threshold: 0 });  // 2) ACTIVATION (pick the one to play)  const ioActive  new IntersectionObserver((entries) > {    entries.forEach(e > { e.target._ratio  e.intersectionRatio; });    clearTimeout(switchTmr);    switchTmr  setTimeout(() > {      const candidate  vids        .filter(v > (v._ratio || 0) > ACTIVATE_THRESHOLD)        .sort((a,b) > (b._ratio||0) - (a._ratio||0))0 || null;      if (candidate) activate(candidate);      else { vids.forEach(v > v.pause()); active  null; }    }, DEBOUNCE_MS);  }, { root: null, rootMargin: `0px 0px ${BOTTOM_GUARD} 0px`, threshold: 0,.25,.5,.75,1 });  vids.forEach(v > {    v.addEventListener(loadeddata, () > hideSkeleton(v), { once: true });    v.addEventListener(play, () > hideSkeleton(v), { once: true });    v.addEventListener(ended, () > { v.currentTime  0; v.play().catch(()>{}); });    ioHydrate.observe(v); // start fetching early    ioActive.observe(v);  // control play/pause  });  document.addEventListener(visibilitychange, () > {    if (document.visibilityState ! visible) vids.forEach(v > v.pause());    else if (active && !reduceMotion) active.play().catch(()>{});  }, { passive: true });})();/script>dialog idvideoLightbox classbackdrop:bg-black/70 p-0 rounded-xl styleborder: none;>  div classrelative bg-black rounded-xl overflow-hidden flex items-center justify-center stylemax-width: 90vw; max-height: 90vh; >    button typebutton idvideoLightboxClose aria-labelClose classabsolute top-2 right-2 z-10 bg-white/80 hover:bg-white text-black rounded-full px-3 py-1 text-sm >      ✕    /button>    video idvideoLightboxPlayer classw-full h-full object-contain autoplay loop muted playsinline>/video>  /div>/dialog>script>  const dlg  document.getElementById(videoLightbox);  const player  document.getElementById(videoLightboxPlayer);  document.addEventListener(click, (e) > {    const trigger  e.target.closest(.lightbox-video);    if (!trigger) return;    // Clear old sources    player.innerHTML  ;    // Add sources from data attributes    if (trigger.dataset.videoWebm) {      player.insertAdjacentHTML(beforeend,        `source src${trigger.dataset.videoWebm} typevideo/webm>`);    }    if (trigger.dataset.videoMp4) {      player.insertAdjacentHTML(beforeend,        `source src${trigger.dataset.videoMp4} typevideo/mp4>`);    }    player.load();    player.play().catch(()>{});    dlg.showModal();  });  // Close when clicking backdrop or pressing Escape  dlg.addEventListener(click, (e) > { if (e.target  dlg) dlg.close(); });  window.addEventListener(keydown, (e) > {    if (e.key  Escape && dlg.open) dlg.close();  });/script>section classbreakthrough-tech-section py-10 relative overflow-hidden data-aosfade-up>    !-- Background Elements -->    div classabsolute inset-0 bg-gradient-to-br from-slate-900 via-blue-900 to-slate-800>/div>    div classabsolute inset-0 bg-radial-gradient(circle_at_30%_20%,rgba(120,119,198,0.1),transparent) opacity-60>/div>        div classmax-w-7xl mx-auto px-6 lg:px-8 relative z-10>                !-- Header -->      !--   div classtext-center mb-20 data-aosfade-down data-aos-delay200>            h3 classfont-poppins text-4xl lg:text-5xl font-black text-white mb-6 leading-tight>                The span stylecolor: var(--accent);>EziStack/span> Advantage            /h3>            p classtext-xl lg:text-2xl text-slate-300 font-light max-w-3xl mx-auto leading-relaxed>                Four breakthrough technologies that make traditional site building obsolete.            /p>        /div>     -->	 	 div classtext-center mb-20 data-aosfade-down data-aos-delay200>    !-- Bridge Text --> p classtext-lg lg:text-xl text-slate-300 font-light max-w-3xl mx-auto mb-8 leading-relaxed> What makes EziStack different from Traditional Site Builders?br>    span classmb-2	stylecolor: var(--accent); font-weight: 600;>u>Its all in the Technology/u>/span>/p>div styledisplay: inline-flex; align-items: center; gap: 0.5rem;margin-bottom:1rem;>     !-- i classph-bold ph-arrow-down stylecolor: var(--success); font-size: 1.6rem;>/i>-->    /div>        !-- Main Heading -->    h3 classfont-poppins text-4xl lg:text-5xl font-black text-white mb-6 leading-tight>        The span stylecolor: var(--accent);>EziStack/span> Advantage    /h3>        !-- Subheading -->    p classtext-xl lg:text-2xl text-slate-300 font-light max-w-3xl mx-auto leading-relaxed>        Four breakthrough technologies that make traditional site building obsolete.    /p>/div>        !-- Features Grid -->        div classgrid lg:grid-cols-2 gap-8 lg:gap-10>                        !-- Static Power -->            div classgroup feature-card bg-white/5 backdrop-blur-sm border border-white/10 p-10 rounded-3xl hover:bg-white/8 hover:border-white/20 transition-all duration-500 hover:scale-1.02 hover:shadow-2xl hover:shadow-emerald-500/10 data-aosfade-right data-aos-delay300>                div classflex items-start space-x-6>                    div classflex-shrink-0>                        img srcimg/webpage.png width128 height128 altStatic website classw-32 h-32 p-2 mb-2 loadinglazy decodingasync>                    /div>                    div classflex-1>                        h4 classtext-2xl lg:text-3xl font-bold text-white mb-4 group-hover:text-emerald-300 transition-colors>                            Static Power                        /h4>                        p classtext-lg text-slate-300 leading-relaxed group-hover:text-slate-200 transition-colors>                            Lightning-fast sites that never break, never get hacked, never need updates.                        /p>                    /div>                /div>            /div>                   !-- Smart Dynamics -->            div classgroup feature-card bg-white/5 backdrop-blur-sm border border-white/10 p-10 rounded-3xl hover:bg-white/8 hover:border-white/20 transition-all duration-500 hover:scale-1.02 hover:shadow-2xl hover:shadow-blue-500/10 data-aosfade-left data-aos-delay350>                div classflex items-start space-x-6>                    div classflex-shrink-0>                        img srcimg/content.png width128 height128 altLaunch Sites Fast classw-32 h-32 p-2 mb-2 loadinglazy decodingasync>                    /div>                    div classflex-1>                        h4 classtext-2xl lg:text-3xl font-bold text-white mb-4 group-hover:text-blue-300 transition-colors>                           Dynamic SEO                        /h4>                        p classtext-lg text-slate-300 leading-relaxed group-hover:text-slate-200 transition-colors>                          							Categories, scheduling, auto updates, interlinking, schema - all the structure Google loves, without the WordPress mess.                        /p>                    /div>                /div>            /div>                     !-- AI Personalization -->            div classgroup feature-card bg-white/5 backdrop-blur-sm border border-white/10 p-10 rounded-3xl hover:bg-white/8 hover:border-white/20 transition-all duration-500 hover:scale-1.02 hover:shadow-2xl hover:shadow-purple-500/10 data-aosfade-right data-aos-delay400>                div classflex items-start space-x-6>                    div classflex-shrink-0>                         img srcimg/paint.png width128 height128 altAI Personalization classw-32 h-32 p-2 mb-2 loadinglazy decodingasync>                    /div>                    div classflex-1>                        h4 classtext-2xl lg:text-3xl font-bold text-white mb-4 group-hover:text-purple-300 transition-colors>                            AI-Driven Scale                        /h4>                        p classtext-lg text-slate-300 leading-relaxed group-hover:text-slate-200 transition-colors>                           							Custom logos, voices, and branding for every site - personalized automatically, so no two look alike.                        /p>                    /div>                /div>            /div>                     !-- Cloud Economics -->            div classgroup feature-card bg-white/5 backdrop-blur-sm border border-white/10 p-10 rounded-3xl hover:bg-white/8 hover:border-white/20 transition-all duration-500 hover:scale-1.02 hover:shadow-2xl hover:shadow-cyan-500/10 data-aosfade-left data-aos-delay450>                div classflex items-start space-x-6>                    div classflex-shrink-0>                         img srcimg/cloud.png width128 height128 altcheap cloud hosting classw-32 h-32 p-2 mb-2 loadinglazy decodingasync>                    /div>                    div classflex-1>                        h4 classtext-2xl lg:text-3xl font-bold text-white mb-4 group-hover:text-cyan-300 transition-colors>                            Cloud Economics                        /h4>                        p classtext-lg text-slate-300 leading-relaxed group-hover:text-slate-200 transition-colors>                            Deploy anywhere — AWS, Azure, GCP, your own servers — for pennies per site.                        /p>                    /div>                /div>            /div>        /div>                  /div>/section>!-- 12-Step Assembly Line Section -->section classassembly-line-section>    div classmax-w-7xl mx-auto px-6 lg:px-8> 	p class text-center pt-10 stylefont-family: Poppins, sans-serif; font-weight: 700; font-size: 1.7rem; color: var(--text-light); margin-bottom: 2rem; line-height: 1.4;   data-aosfade-up>Here’s how EziStack makes the Magic happen…  /p>  div class py-10>		div classtext-center mb-16 data-aosfade-up>	    h2 classfont-poppins text-4xl lg:text-5xl font-black mb-6 stylecolor: var(--text);>        🚀 The 12-Step Traffic Asset         span stylecolor: var(--primary);>Assembly Line/span>    /h2>    p classtext-xl lg:text-2xl font-medium max-w-3xl mx-auto mb-8 stylecolor: var(--text-light);>   From Keyword to Fully Personalized Traffic Asset in Under        span classfont-bold stylecolor: var(--accent);>5 Minutes./span>    /p>        div classflex flex-col sm:flex-row items-center justify-center gap-6 sm:gap-12 mb-8 data-aosfade-up data-aos-delay200>        div classstats-item text-center>            div classtext-3xl lg:text-4xl font-black mb-2 stylecolor: var(--primary);>90-100/div>            div classtext-sm lg:text-base font-semibold uppercase tracking-wider stylecolor: var(--text-light);>AI Prompts DFY/div>        /div>                div classhidden sm:block w-px h-12 stylebackground-color: var(--text-light); opacity: 0.3;>/div>                div classstats-item text-center>            div classtext-3xl lg:text-4xl font-black mb-2 stylecolor: var(--secondary);>12/div>            div classtext-sm lg:text-base font-semibold uppercase tracking-wider stylecolor: var(--text-light);>Automated Steps/div>        /div>                div classhidden sm:block w-px h-12 stylebackground-color: var(--text-light); opacity: 0.3;>/div>                div classstats-item text-center>            div classtext-3xl lg:text-4xl font-black mb-2 stylecolor: var(--accent);>5/div>            div classtext-sm lg:text-base font-semibold uppercase tracking-wider stylecolor: var(--text-light);>Minutes Total/div>        /div>    /div>        div classw-32 h-1 bg-gradient-to-r from-blue-500 to-orange-500 mx-auto rounded-full>/div>/div>              div classtimeline-wrapper relative>			    div classabsolute inset-0 overflow-hidden pointer-events-none stylez-index: 0;>          div classabsolute w-32 h-32 rounded-full opacity-15 stylebackground: radial-gradient(circle, var(--primary), transparent); top: 7%; left: 1%; animation: float-slow 15s ease-in-out infinite;>/div>                div classabsolute w-20 h-20 rounded-full opacity-30 stylebackground: radial-gradient(circle, var(--accent), transparent); top: 23%; right: 8%; animation: float-slow 12s ease-in-out infinite reverse;>/div>                     div classabsolute w-28 h-28 opacity-15 stylebackground: linear-gradient(45deg, var(--success), transparent); top: 48%; left: 35%; border-radius: 20px; transform: rotate(45deg); animation: rotate-float 20s linear infinite;>/div>                              div classabsolute w-36 h-36 rounded-full opacity-15 stylebackground: radial-gradient(circle, var(--primary), transparent); top: 72%; left: 70%; animation: float-slow 14s ease-in-out infinite reverse;>/div>                   /div>               div classtimeline-line hidden md:block>/div>                     div classtimeline-item left data-aosfade-right data-aos-delay100>                div classstep-number-circle step-1>1/div>                div classstep-card-wide left>                    div classstep-header-inline>                                                h3 classstep-title stylecolor: var(--text);>Brand DNA Creation/h3>                    /div>                    p classstep-description stylecolor: var(--text-light);>                        EziStack Takes the Simple Details You Provide and Expands Them into Comprehensive Business Data - Mission, Values, Niche Details - Everything Needed to Personalize Your Site at Scale.                    /p>                /div>            /div>                    div classtimeline-item right data-aosfade-left data-aos-delay150>                div classstep-number-circle step-2>2/div>                div classstep-card-wide right>                    div classstep-header-inline>                                               h3 classstep-title stylecolor: var(--text);>Signature Color Palette/h3>                    /div>                    p classstep-description stylecolor: var(--text-light);>                       AI Analyzes Your Business and Niche, Then Designs a Custom Brand Color Palette. These Colors Flow Across Your Site, Creating Instant Consistency and Brand Identity.                    /p>                /div>            /div>                       div classtimeline-item left data-aosfade-right data-aos-delay200>                div classstep-number-circle step-3>3/div>                div classstep-card-wide left>                    div classstep-header-inline>                                               h3 classstep-title stylecolor: var(--text);>Voice Blueprint/h3>                    /div>                    p classstep-description stylecolor: var(--text-light);>                    EziStack Researches Top Blogs in Your Niche and Builds a Unique Writing Style for Your Site. Every Article, Widget, and Future Post Sounds Consistent — Giving Your Site a Recognizable Voice.                    /p>                /div>            /div>                    div classtimeline-item right data-aosfade-left data-aos-delay250>                div classstep-number-circle step-4>4/div>                div classstep-card-wide right>                    div classstep-header-inline>                                                h3 classstep-title stylecolor: var(--text);>Author Authority/h3>                    /div>                    p classstep-description stylecolor: var(--text-light);>                        Your Site Gets a Realistic, Expertise-Driven Author Profile (With Bio, Credentials, and AI-Generated Images). This Boosts Trust, EEAT Signals, and Makes Your Content Feel Authored by a True Expert.                    /p>                /div>            /div>                     div classtimeline-item left data-aosfade-right data-aos-delay300>                div classstep-number-circle step-5>5/div>                div classstep-card-wide left>                    div classstep-header-inline>                                                h3 classstep-title stylecolor: var(--text);>Core Trust Pages/h3>                    /div>                    p classstep-description stylecolor: var(--text-light);>                        EziStack Generates a Fully Personalized About Us Page That Matches Your Business and Builds Visitor Trust. Privacy Policy Pages Are Automatically Customized with Your Site Details and Compliance Requirements.                    /p>                /div>            /div>                 div classtimeline-item right data-aosfade-left data-aos-delay350>                div classstep-number-circle step-6>6/div>                div classstep-card-wide right>                    div classstep-header-inline>                                                h3 classstep-title stylecolor: var(--text);>Keyword Intelligence/h3>                    /div>                    p classstep-description stylecolor: var(--text-light);>                      Advanced AI-Driven Keyword Research & Clustering Uncovers High-Traffic Opportunities, Groups Them into Categories, and Creates Optimized Blog Post Titles — Laying the Foundation for Growth.                    /p>                /div>            /div>                 div classtimeline-item left data-aosfade-right data-aos-delay400>                div classstep-number-circle step-7>7/div>                div classstep-card-wide left>                    div classstep-header-inline>                                                h3 classstep-title stylecolor: var(--text);>Logo Forge/h3>                    /div>                    p classstep-description stylecolor: var(--text-light);>                       EziStack Designs a Professional, Niche-Specific Logo Using Your Brand Palette. Logos Are Automatically Resized, Background-Removed, and Optimized for Every Device.                    /p>                /div>            /div>                   div classtimeline-item right data-aosfade-left data-aos-delay450>                div classstep-number-circle step-8>8/div>                div classstep-card-wide right>                    div classstep-header-inline>                                                h3 classstep-title stylecolor: var(--text);>Site Personalization Engine/h3>                    /div>                    p classstep-description stylecolor: var(--text-light);>                        From Headers and Footers to Custom Images, Sidebars, and Layouts — EziStack Applies Your Brand Across the Entire Site, Turning a Generic Template into a Unique, Polished Asset.                    /p>                /div>            /div>                   div classtimeline-item left data-aosfade-right data-aos-delay500>                div classstep-number-circle step-9>9/div>                div classstep-card-wide left>                    div classstep-header-inline>                                                h3 classstep-title stylecolor: var(--text);>Smart Content Production/h3>                    /div>                    p classstep-description stylecolor: var(--text-light);>                       AI Generates Authority-Level Blog Posts with Embedded Media, Interlinking, and Your Custom Voice. Each Post Includes Optimized Images and Schema, Scheduled for Ongoing Freshness.                    /p>                /div>            /div>                 div classtimeline-item right data-aosfade-left data-aos-delay550>                div classstep-number-circle step-10>10/div>                div classstep-card-wide right>                    div classstep-header-inline>                                                h3 classstep-title stylecolor: var(--text);>Auto-Scheduling System/h3>                    /div>                    p classstep-description stylecolor: var(--text-light);>                       Posts Are Placed on a Content Calendar (Daily, Weekly, Monthly). EziStack Handles Publishing Tasks Automatically, Keeping Your Site Fresh and Active Without You Lifting a Finger.                    /p>                /div>            /div>                     div classtimeline-item left data-aosfade-right data-aos-delay600>                div classstep-number-circle step-11>11/div>                div classstep-card-wide left>                    div classstep-header-inline>                                                h3 classstep-title stylecolor: var(--text);>Optimized Media Pipeline/h3>                    /div>                    p classstep-description stylecolor: var(--text-light);>                        Every Image Is Compressed, Resized, Converted to Modern Formats (WebP), and Optimized with Metadata. Result: Lightning-Fast Load Speeds with Crystal-Clear Visuals.                    /p>                /div>            /div>               div classtimeline-item right data-aosfade-left data-aos-delay650>                div classstep-number-circle step-12>12/div>                div classstep-card-wide right>                    div classstep-header-inline>                                                h3 classstep-title stylecolor: var(--text);>Enterprise-Grade Deployment/h3>                    /div>                    p classstep-description stylecolor: var(--text-light);>                        Behind the Scenes, EziStacks Servers Handle 90–100 AI Prompts, Gluing Everything into Pages, Posts, Menus, and Layouts — Then Sync Directly to Your Cloud Host or FTP.                    /p>                /div>            /div>        /div>    /div>	/div>/section>section classmodern-result-section py-24 relative overflow-hidden stylebackground: linear-gradient(135deg, #1E40AF 0%, #3B82F6 100%);>    !-- Floating Brand Elements -->    div classabsolute w-24 h-24 rounded-full opacity-30 stylebackground: radial-gradient(circle, var(--accent), transparent); top: 10%; left: 5%; animation: float 6s ease-in-out infinite;>/div>    div classabsolute w-32 h-32 rounded-full opacity-20 stylebackground: radial-gradient(circle, var(--success), transparent); top: 20%; right: 10%; animation: float 7s ease-in-out infinite reverse;>/div>    div classabsolute w-20 h-20 rounded-full opacity-15 stylebackground: radial-gradient(circle, var(--secondary), transparent); bottom: 25%; left: 20%; animation: float 8s ease-in-out infinite;>/div>    div classabsolute w-28 h-28 rounded-full opacity-30 stylebackground: radial-gradient(circle, var(--accent), transparent); bottom: 20%; right: 20%; animation: float 9s ease-in-out infinite reverse;>/div>    div classmax-w-7xl mx-auto px-6 lg:px-8 text-center relative z-10>                !-- Main Headline -->        div classmb-16 data-aosfade-up>            h2 classfont-poppins font-black mb-8 stylefont-size: clamp(2.5rem, 5vw, 4.0rem); color: #FFFFFF; letter-spacing: -0.03em; line-height: 0.9;>                The Results?            /h2>                        div classrelative max-w-6xl mx-auto>                p classfont-poppins font-semibold stylefont-size: clamp(1.4rem, 3.5vw, 2.25rem); color: #F9FAFB; line-height: 1.3; letter-spacing: -0.015em; margin-bottom: 2rem;>                    You Walk Away with a                     span classfont-black stylecolor: var(--success); text-shadow: 0 2px 4px rgba(16, 185, 129, 0.3);>Fully Branded, Fully Hosted, Traffic-Ready Site/span>                    That                     span classfont-black stylecolor: var(--accent); text-shadow: 0 2px 4px rgba(245, 158, 11, 0.3);>Looks Like It Took a Team Weeks to Build./span>                /p>            /div>        /div>                !-- Divider -->        div classw-32 h-1 bg-gradient-to-r from-var(--accent) to-orange-400 mx-auto mb-8 rounded-full>/div>                !-- Bottom Impact Statement -->        div classmax-w-5xl mx-auto data-aoszoom-in data-aos-delay400>            h3 classfont-poppins font-black mb-8 stylefont-size: clamp(2rem, 5vw, 3.25rem); color: #FFFFFF; letter-spacing: -0.025em; line-height: 1.1;>                EziStack does in                 span classinline-block px-4 py-2 rounded-xl stylebackground: var(--accent); color: white; font-size: inherit;>5 minutes/span>br>                what used to take weeks:            /h3>                      !-- Replace your current paragraph with this pill group -->!-- Chips row: 4 + 3 layout for balance -->div classflex flex-wrap justify-center gap-4 mt-10 stylerow-gap:14px;>  !-- CHIP -->  div classez-chip       styledisplay:flex;align-items:center;gap:10px;padding:12px 16px;              background:rgba(255,255,255,0.10); /* glass base */              border:1px solid rgba(255,255,255,0.22);              border-radius:14px;color:#FFFFFF;              font-weight:800;letter-spacing:.3px;              backdrop-filter:blur(8px);              box-shadow:0 6px 20px rgba(0,0,0,.18);>    span stylewidth:10px;height:10px;border-radius:9999px;background:#F59E0B;                 box-shadow:0 0 0 4px rgba(245,158,11,.28);display:inline-block;>/span>    Research  /div>  div classez-chip       styledisplay:flex;align-items:center;gap:10px;padding:12px 16px;              background:rgba(255,255,255,0.10);              border:1px solid rgba(255,255,255,0.22);              border-radius:14px;color:#FFFFFF;              font-weight:800;letter-spacing:.3px;              backdrop-filter:blur(8px);              box-shadow:0 6px 20px rgba(0,0,0,.18);>    span stylewidth:10px;height:10px;border-radius:9999px;background:#10B981;                 box-shadow:0 0 0 4px rgba(16,185,129,.28);display:inline-block;>/span>    Branding  /div>  div classez-chip       styledisplay:flex;align-items:center;gap:10px;padding:12px 16px;              background:rgba(255,255,255,0.10);              border:1px solid rgba(255,255,255,0.22);              border-radius:14px;color:#FFFFFF;              font-weight:800;letter-spacing:.3px;              backdrop-filter:blur(8px);              box-shadow:0 6px 20px rgba(0,0,0,.18);>    span stylewidth:10px;height:10px;border-radius:9999px;background:#3B82F6;                 box-shadow:0 0 0 4px rgba(59,130,246,.28);display:inline-block;>/span>    Design  /div>  div classez-chip       styledisplay:flex;align-items:center;gap:10px;padding:12px 16px;              background:rgba(255,255,255,0.10);              border:1px solid rgba(255,255,255,0.22);              border-radius:14px;color:#FFFFFF;              font-weight:800;letter-spacing:.3px;              backdrop-filter:blur(8px);              box-shadow:0 6px 20px rgba(0,0,0,.18);>    span stylewidth:10px;height:10px;border-radius:9999px;background:#1E40AF;                 box-shadow:0 0 0 4px rgba(30,64,175,.28);display:inline-block;>/span>    Content  /div>  !-- Row break for 4 + 3 layout -->  div styleflex-basis:100%;height:0;>/div>  div classez-chip       styledisplay:flex;align-items:center;gap:10px;padding:12px 16px;              background:rgba(255,255,255,0.10);              border:1px solid rgba(255,255,255,0.22);              border-radius:14px;color:#FFFFFF;              font-weight:800;letter-spacing:.3px;              backdrop-filter:blur(8px);              box-shadow:0 6px 20px rgba(0,0,0,.18);>    span stylewidth:10px;height:10px;border-radius:9999px;background:#F59E0B;                 box-shadow:0 0 0 4px rgba(245,158,11,.28);display:inline-block;>/span>    Scheduling  /div>  div classez-chip       styledisplay:flex;align-items:center;gap:10px;padding:12px 16px;              background:rgba(255,255,255,0.10);              border:1px solid rgba(255,255,255,0.22);              border-radius:14px;color:#FFFFFF;              font-weight:800;letter-spacing:.3px;              backdrop-filter:blur(8px);              box-shadow:0 6px 20px rgba(0,0,0,.18);>    span stylewidth:10px;height:10px;border-radius:9999px;background:#10B981;                 box-shadow:0 0 0 4px rgba(16,185,129,.28);display:inline-block;>/span>    Optimization  /div>  div classez-chip       styledisplay:flex;align-items:center;gap:10px;padding:12px 16px;              background:rgba(255,255,255,0.10);              border:1px solid rgba(255,255,255,0.22);              border-radius:14px;color:#FFFFFF;              font-weight:800;letter-spacing:.3px;              backdrop-filter:blur(8px);              box-shadow:0 6px 20px rgba(0,0,0,.18);>    span stylewidth:10px;height:10px;border-radius:9999px;background:#3B82F6;                 box-shadow:0 0 0 4px rgba(59,130,246,.28);display:inline-block;>/span>    Deployment  /div>/div>!-- Tiny polish for interaction; safe to keep inline with your page -->        /div>	    /div>		button onclicksmoothScrollToGetStarted() styledisplay:block;width:100%;max-width:420px;background:var(--accent);color:white;font-family:Poppins,sans-serif;font-weight:700;font-size:18px;padding:18px 32px;border-radius:50px;text-align:center;border:2px solid #1E40AF;cursor:pointer;transition:all 0.3s ease;margin:4rem auto 0 auto;>Get Instant Access to EziStack/button>/section>style>  .ez-chip{transition:transform .2s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;}  .ez-chip:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,0,0,.28);background:rgba(255,255,255,0.14);border-color:rgba(255,255,255,0.30);}  @media (max-width:640px){ .ez-chip{font-size:15px;padding:10px 14px;} }/style>!-- Everything You Need Section -->section classfeatures-complete-section>    div classfeatures-container>                !-- Header -->        div classfeatures-header data-aosfade-up>            h2 classfeatures-title>Everything You Need, Built Right In/h2>            p classfeatures-subtitle>                EziStack is More than a Site Builder — its Your Complete TRAFFIC Engine, from AI Research to Hosting, ALL in One Dashboard.            /p>        /div>        !-- Click Instruction -->        div classtext-center mb-8>            div classclick-instruction>                👆 Click any tab below to explore features            /div>        /div>        !-- Tabs Navigation -->        div classtabs-navigation data-aosfade-up data-aos-delay200>            button classtab-btn active data-targetsite-creation>                Site Creation & Builder            /button>            button classtab-btn data-targetai-power>                AI Power (Speed + Control)            /button>            button classtab-btn data-targetseo-engine>                SEO Engine (Baked In)            /button>            button classtab-btn data-targetcontent-automation>                Content Automation            /button>            button classtab-btn data-targetmedia-tools>                Media & Image Tools            /button>            button classtab-btn data-targethosting>                Hosting & Deployment            /button>            button classtab-btn data-targetscale-control>                Scale & Control            /button>            button classtab-btn data-targetwordpress>                WordPress Integration            /button>            button classtab-btn data-targetreliability>                Reliability & Ownership            /button>            button classtab-btn data-targetmonetization>                Monetization            /button>            button classtab-btn data-targetbranding>                Branding & Personalization            /button>        /div>        !-- Tab Content Area -->        div classtab-content-area data-aosfade-up data-aos-delay300>                        !-- Site Creation & Builder -->            div classtab-content active idsite-creation>                ul classfeature-list>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Launch in minutes — no code, no plugins, no headaches./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Drag-and-drop editor with pixel-perfect control./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Build blogs, funnels, opt-in pages, sales pages, webinars and more./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Import your own templates and let AI instantly brand & personalize them./span>                    /li>                /ul>            /div>            !-- AI Power -->            div classtab-content idai-power>                ul classfeature-list>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>AI keyword research that clusters topics & titles for you./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Each site gets its own unique writing style & voice./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Choose from multiple AI models (OpenAI, Claude, Gemini, Perplexity, OpenRouter) by strength or price./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Create or tweak your own AI strategies to match your workflow./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Never get stuck — free fallback images if you dont supply your own./span>                    /li>                /ul>            /div>            !-- SEO Engine -->            div classtab-content idseo-engine>                ul classfeature-list>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Smart silo structures for authority & rankings./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Full schema with advanced templates built in./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Auto-freshness updates to keep Google crawling your content./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Author & EEAT signals handled automatically./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Intelligent internal linking across posts and categories./span>                    /li>                /ul>            /div>            !-- Content Automation -->            div classtab-content idcontent-automation>                ul classfeature-list>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Curate from your favorite feeds and rewrite in your voice./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Schedule a year+ of content (daily, weekly, monthly)./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Auto in-content images added at your preferred rate./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Bulk import, schedule, rewrite — set & forget./span>                    /li>                /ul>            /div>            !-- Media & Image Tools -->            div classtab-content idmedia-tools>                ul classfeature-list>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Generate AI images, logos, and graphics in the right style./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Edit, resize, compress, convert to WebP automatically./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Add EXIF data for SEO signals./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Thumbnails & responsive sizes handled for every device./span>                    /li>                /ul>            /div>            !-- Hosting & Deployment -->            div classtab-content idhosting>                ul classfeature-list>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Deploy to AWS, GCP, Azure, Cloudflare, IBM, Backblaze, or FTP./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Free SSL included./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Multi-region IPs for stacks, networks & PBNs./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Static  fast, secure, unhackable./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>One-click sync straight to your cloud./span>                    /li>                /ul>            /div>            !-- Scale & Control -->            div classtab-content idscale-control>                ul classfeature-list>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Manage 1 site or 100+ from one dashboard./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Group sites by project, niche, or client./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Mass-create sites in parallel./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Run subdomain & cloud stack strategies with ease./span>                    /li>                /ul>            /div>            !-- WordPress Integration -->            div classtab-content idwordpress>                ul classfeature-list>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Post to your existing WordPress sites directly from EziStack./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Create, edit & schedule WP posts and pages in one place./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Custom plugin per site (randomized paths, zero footprints)./span>                    /li>                /ul>            /div>            !-- Reliability & Ownership -->            div classtab-content idreliability>                ul classfeature-list>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Automatic backups keep you safe./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>You own the files — sites live on your cloud, your keys./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>No lock-in, no callbacks./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Static architecture  no hacks, no downtime./span>                    /li>                /ul>            /div>            !-- Monetization -->            div classtab-content idmonetization>                ul classfeature-list>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Ads & banners injected by category or position./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Category-specific widgets for relevance & clicks./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Blazing-fast load speeds for better conversions & rankings./span>                    /li>                /ul>            /div>            !-- Branding & Personalization -->            div classtab-content idbranding>                ul classfeature-list>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Auto-generated author profiles with bio & images./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Business & brand details applied across the site./span>                    /li>                    li classfeature-item>                        span classfeature-check>✓/span>                        span>Custom color palettes & logos unique to every build./span>                    /li>                /ul>            /div>        /div>        !-- Bottom Statement -->        div classbottom-statement data-aoszoom-in data-aos-delay400>            div classbottom-statement-content>                h3>🚀 Complete Platform Replacement/h3>                p>                   span classhighlight-accent>Bottom Line:/span> EziStack Replaces Dozens of Tools — Builders, Hosting, AI Apps, SEO Plugins, Image Editors, Schedulers — with One Platform That Does It All, Faster and Cheaper.                /p>            /div>        /div>    /div>/section>script>// Enhanced Tab Functionalitydocument.addEventListener(DOMContentLoaded, function() {    const tabBtns  document.querySelectorAll(.tab-btn);    const tabContents  document.querySelectorAll(.tab-content);        tabBtns.forEach(btn > {        btn.addEventListener(click, function() {            const targetId  this.getAttribute(data-target);                        // Remove active class from all buttons            tabBtns.forEach(b > b.classList.remove(active));            // Add active class to clicked button            this.classList.add(active);                        // Hide all tab contents            tabContents.forEach(content > {                content.classList.remove(active);            });                        // Show target tab content with animation            const targetContent  document.getElementById(targetId);            if (targetContent) {                setTimeout(() > {                    targetContent.classList.add(active);                }, 50);            }        });    });});/script>!-- Perfect Audience Section -->section classperfect-audience-section>    div classperfect-audience-container>                !-- Header -->        div classperfect-audience-header data-aosfade-up>            h2 classperfect-audience-title>                Is EziStack Right for You?            /h2>            p classperfect-audience-subtitle>                Perfect for Marketers, Builders, and Entrepreneurs Who Want Speed, Scale, and Results — Without Technical Platform Problems.            /p>        /div>        !-- Top Row - 3 Cards -->        div classperfect-audience-grid data-aosfade-up data-aos-delay200>                        !-- Solo Affiliates -->            article classperfect-audience-card>			      h3 classperfect-audience-card-title >Solo Affiliates/h3>                 img srcimg/affiliate-marketing.png width112 height112 altsolo affiliate classw-28 h-28 p-2 mb-2 mx-auto loadinglazy decodingasync/>                          p classperfect-audience-card-description>            Turn Keywords into Money Sites in Minutes. Launch Review Sites, Niche Blogs, or Promo Funnels That Rank and Convert — Without Wasting Weeks on Setup.                /p>            /article>            !-- SEO Pros -->            article classperfect-audience-card>			  h3 classperfect-audience-card-title>SEO Pros/h3>                 img srcimg/seo.png width112 height112 altSEO Pros classw-28 h-28 p-2 mb-2 mx-auto loadinglazy decodingasync/>                              p classperfect-audience-card-description>                   Finally, Scale PBNs, Authority Sites, and Niche Networks at a Fraction of the Time and Cost. Control Silos, Schema, Internal Linking, and Freshness Updates Without Ever Touching WordPress.                /p>            /article>            !-- Local Lead Generators -->            article classperfect-audience-card>			h3 classperfect-audience-card-title>Local Lead Generators/h3>               img srcimg/local-l.png width112 height112 altlocal seo classw-28 h-28 p-2 mb-2 mx-auto loadinglazy decodingasync />                                p classperfect-audience-card-description>                    Dominate Your City or Multiple Service Areas with Fast-Deploy Local Business Sites. Add Branding, Authority Content, and Drip-Fed Posts — All Done-for-You by AI.                /p>            /article>        /div>        !-- Bottom Row - 2 Cards Centered -->        div classperfect-audience-row2 data-aosfade-up data-aos-delay350>                        !-- Agencies -->            article classperfect-audience-card>			    h3 classperfect-audience-card-title>Agencies/h3>                 img srcimg/public-relations.png width112 height112 altSEO agencies classw-28 h-28 p-2 mb-2 mx-auto loadinglazy decodingasync/>                            p classperfect-audience-card-description>                   Offer Instant Websites as a Premium Service. Build, Brand, and Hand Over Polished Sites to Clients in a Single Afternoon — Complete with Logos, Content, and SEO.                /p>            /article>            !-- Technical Marketers -->            article classperfect-audience-card>                                h3 classperfect-audience-card-title>Technical Marketers & Builders/h3>                 img srcimg/developer.png width112 height112 altOnline marketers classw-28 h-28 p-2 mb-2 mx-auto loadinglazy decodingasync/>				p classperfect-audience-card-description>                    Harness the Power of Static Speed with Dynamic Flexibility. Deploy on Your Own Cloud (AWS, GCP, Azure, Backblaze, FTP) for Pennies, No Plugins, No Vulnerabilities.                /p>            /article>        /div>        !-- Closing Statement -->        div classperfect-audience-closing mt-16 data-aoszoom-in data-aos-delay500>            h3>✅ Built for Success/h3>            p>                In Short: If Youre Tired of Wasting Hours Wrestling with WordPress, Plugins, and Hosting Bills — and You Want a System That Builds span classhighlight-accent>Ready-to-Go Traffic Assets in Minutes/span> — EziStack Is Built for You.            /p>        /div>    /div>/section>!-- Video Testimonial 2 - Geoff (Enhanced with distinct background) -->section stylebackground: linear-gradient(135deg, #0F172A 0%, #1E293B 50%, #334155 100%); padding: 5rem 1.5rem; position: relative; overflow: hidden; data-aosfade-up>    !-- Dynamic Background Elements -->  div styleposition: absolute; inset: 0; overflow: hidden;>    !-- Large floating circles -->    div styleposition: absolute; top: -10%; left: -5%; width: 300px; height: 300px; background: radial-gradient(circle, rgba(16, 185, 129, 0.15) 0%, transparent 70%); border-radius: 50%; animation: float 20s ease-in-out infinite;>/div>    div styleposition: absolute; top: 20%; right: -10%; width: 250px; height: 250px; background: radial-gradient(circle, rgba(59, 130, 246, 0.12) 0%, transparent 70%); border-radius: 50%; animation: float 25s ease-in-out infinite reverse;>/div>    div styleposition: absolute; bottom: -15%; left: 30%; width: 200px; height: 200px; background: radial-gradient(circle, rgba(245, 158, 11, 0.1) 0%, transparent 70%); border-radius: 50%; animation: float 22s ease-in-out infinite;>/div>        !-- Grid pattern overlay -->    div styleposition: absolute; inset: 0; background-image: radial-gradient(circle at 20% 50%, rgba(16, 185, 129, 0.03) 2px, transparent 2px), radial-gradient(circle at 80% 20%, rgba(59, 130, 246, 0.03) 2px, transparent 2px), radial-gradient(circle at 40% 80%, rgba(245, 158, 11, 0.03) 2px, transparent 2px); background-size: 80px 80px, 100px 100px, 120px 120px;>/div>  /div>    div stylemax-width: 1200px; margin: 0 auto; position: relative; z-index: 10;>        !-- Header Section with glassmorphism -->    div styletext-align: center; margin-bottom: 4rem;>      div styledisplay: inline-flex; align-items: center; gap: 0.75rem; background: rgba(16, 185, 129, 0.15); border: 1px solid rgba(16, 185, 129, 0.3); padding: 0.75rem 1.5rem; border-radius: 30px; margin-bottom: 2rem; backdrop-filter: blur(10px); box-shadow: 0 8px 32px rgba(16, 185, 129, 0.1);>        span stylefont-size: 1.3rem;>🎯/span>        span stylecolor: #6EE7B7; font-weight: 700; font-size: 0.95rem; letter-spacing: 0.5px; text-transform: uppercase;>Live Dashboard Demonstration/span>      /div>          h3 stylefont-family: Poppins, sans-serif; font-size: clamp(2.5rem, 5vw, 3.75rem); font-weight: 900; color: white; margin: 0 0 1.5rem 0; line-height: 1.1; letter-spacing: -0.025em; text-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);>        Marketing Veteran Shows His        span stylecolor: #10B981; display: block; margin-top: 0.5rem; text-shadow: 0 0 30px rgba(16, 185, 129, 0.5);>50+ Live Websites/span>      /h3>            p stylecolor: rgba(255, 255, 255, 0.9); font-size: 1.3rem; font-weight: 500; margin: 0 0 1rem 0; max-width: 850px; margin-left: auto; margin-right: auto; line-height: 1.6;>        Watch Geoff walk through his live dashboard with 50+ active websites      /p>            div stylebackground: rgba(245, 158, 11, 0.15); border: 1px solid rgba(245, 158, 11, 0.3); padding: 1rem 2rem; border-radius: 50px; display: inline-block; margin-top: 1rem; backdrop-filter: blur(10px);>        span stylecolor: #FCD34D; font-weight: 700; font-size: 1rem;>4 minutes of screen-recorded proof/span>      /div>    /div>    !-- Video Container with enhanced styling -->    div stylemax-width: 950px; margin: 0 auto 4rem auto;>      div styleposition: relative; background: linear-gradient(145deg, #000000, #1a1a1a); border-radius: 28px; overflow: hidden; box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6), 0 0 50px rgba(16, 185, 129, 0.15); border: 2px solid rgba(16, 185, 129, 0.3);>        div styleposition: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;>          iframe             srchttps://www.youtube.com/embed/EzbWp_XpmpI             frameborder0             allowfullscreen            styleposition: absolute; top: 0; left: 0; width: 100%; height: 100%;>          /iframe>        /div>                !-- Enhanced video badges -->        div styleposition: absolute; top: 1.5rem; left: 1.5rem; display: flex; gap: 0.75rem;>          div stylebackground: rgba(16, 185, 129, 0.9); color: white; padding: 0.6rem 1.2rem; border-radius: 20px; font-size: 0.9rem; font-weight: 700; box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3); backdrop-filter: blur(10px);>            Live Screen Recording          /div>          div stylebackground: rgba(245, 158, 11, 0.9); color: white; padding: 0.6rem 1.2rem; border-radius: 20px; font-size: 0.9rem; font-weight: 700; box-shadow: 0 4px 12px rgba(245, 158, 11, 0.3);>            Real Dashboard          /div>        /div>                div styleposition: absolute; bottom: 1.5rem; right: 1.5rem; background: rgba(0, 0, 0, 0.8); color: white; padding: 0.6rem 1.2rem; border-radius: 25px; font-size: 0.95rem; font-weight: 600; backdrop-filter: blur(10px);>          4:03 - Complete Walkthrough        /div>      /div>    /div>    !-- Stats Grid with glassmorphism -->    div styledisplay: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 2rem; margin-bottom: 4rem;>            !-- Stats Card 1 -->      div stylebackground: rgba(255, 255, 255, 0.05); backdrop-filter: blur(15px); border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 24px; padding: 2.5rem 2rem; text-align: center; box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);>        div stylefont-size: 4rem; font-weight: 900; color: #10B981; line-height: 1; margin-bottom: 0.5rem; text-shadow: 0 0 20px rgba(16, 185, 129, 0.5);>50+/div>        div stylefont-size: 1.3rem; font-weight: 700; color: white; margin-bottom: 0.5rem;>Real Websites/div>        div stylefont-size: 1rem; color: rgba(255, 255, 255, 0.8);>Personal + client projects/div>      /div>            !-- Stats Card 2 -->      div stylebackground: rgba(59, 130, 246, 0.1); backdrop-filter: blur(15px); border: 1px solid rgba(59, 130, 246, 0.2); border-radius: 24px; padding: 2.5rem 2rem; text-align: center; box-shadow: 0 15px 35px rgba(59, 130, 246, 0.1);>        div stylefont-size: 3.5rem; font-weight: 900; color: #60A5FA; line-height: 1; margin-bottom: 0.5rem; text-shadow: 0 0 20px rgba(96, 165, 250, 0.5);>30/div>        div stylefont-size: 1.3rem; font-weight: 700; color: white; margin-bottom: 0.5rem;>Minutes/div>        div stylefont-size: 1rem; color: rgba(255, 255, 255, 0.8);>5-site tiered stack/div>      /div>            !-- Stats Card 3 -->      div stylebackground: rgba(245, 158, 11, 0.1); backdrop-filter: blur(15px); border: 1px solid rgba(245, 158, 11, 0.2); border-radius: 24px; padding: 2.5rem 2rem; text-align: center; box-shadow: 0 15px 35px rgba(245, 158, 11, 0.1);>        div stylefont-size: 3.5rem; font-weight: 900; color: #FCD34D; line-height: 1; margin-bottom: 0.5rem; text-shadow: 0 0 20px rgba(252, 211, 77, 0.5);>82/div>        div stylefont-size: 1.3rem; font-weight: 700; color: white; margin-bottom: 0.5rem;>Years Old/div>        div stylefont-size: 1rem; color: rgba(255, 255, 255, 0.8);>Easy enough for anyone/div>      /div>    /div>    !-- What Youll See Section with enhanced styling -->    div stylebackground: rgba(255, 255, 255, 0.02); backdrop-filter: blur(20px); border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 28px; padding: 3.5rem; box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3); margin-bottom: 3rem;>      h4 stylefont-family: Poppins, sans-serif; font-size: 2.2rem; font-weight: 800; color: white; margin: 0 0 2.5rem 0; text-align: center; text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);>        What Geoff Demonstrates Live:      /h4>            div styledisplay: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 2.5rem;>                div styledisplay: flex; align-items: flex-start; gap: 1.2rem;>          div stylewidth: 60px; height: 60px; background: linear-gradient(135deg, #10B981, #047857); border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; box-shadow: 0 8px 25px rgba(16, 185, 129, 0.3);>            span stylecolor: white; font-size: 1.8rem;>🖥️/span>          /div>          div>            h5 stylefont-weight: 700; color: #6EE7B7; margin: 0 0 0.5rem 0; font-size: 1.2rem;>Live Dashboard Tour/h5>            p stylecolor: rgba(255, 255, 255, 0.8); font-size: 1rem; margin: 0; line-height: 1.6;>His actual EziStack dashboard showing all 50+ websites in real-time/p>          /div>        /div>                div styledisplay: flex; align-items: flex-start; gap: 1.2rem;>          div stylewidth: 60px; height: 60px; background: linear-gradient(135deg, #3B82F6, #1E40AF); border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; box-shadow: 0 8px 25px rgba(59, 130, 246, 0.3);>            span stylecolor: white; font-size: 1.8rem;>🏢/span>          /div>          div>            h5 stylefont-weight: 700; color: #93C5FD; margin: 0 0 0.5rem 0; font-size: 1.2rem;>Real Client Work/h5>            p stylecolor: rgba(255, 255, 255, 0.8); font-size: 1rem; margin: 0; line-height: 1.6;>Live sites for local plumbers and his own business ventures/p>          /div>        /div>                div styledisplay: flex; align-items: flex-start; gap: 1.2rem;>          div stylewidth: 60px; height: 60px; background: linear-gradient(135deg, #F59E0B, #D97706); border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; box-shadow: 0 8px 25px rgba(245, 158, 11, 0.3);>            span stylecolor: white; font-size: 1.8rem;>⚡/span>          /div>          div>            h5 stylefont-weight: 700; color: #FCD34D; margin: 0 0 0.5rem 0; font-size: 1.2rem;>Speed Demonstration/h5>            p stylecolor: rgba(255, 255, 255, 0.8); font-size: 1rem; margin: 0; line-height: 1.6;>5-site tiered stack created in under 30 minutes using wizard/p>          /div>        /div>                !-- div styledisplay: flex; align-items: flex-start; gap: 1.2rem;> -->          !-- div stylewidth: 60px; height: 60px; background: linear-gradient(135deg, #8B5CF6, #7C3AED); border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; box-shadow: 0 8px 25px rgba(139, 92, 246, 0.3);> -->            !-- span stylecolor: white; font-size: 1.8rem;>✏️/span> -->          !-- /div> -->          !-- div> -->            !-- h5 stylefont-weight: 700; color: #C4B5FD; margin: 0 0 0.5rem 0; font-size: 1.2rem;>Page Builder In Action/h5> -->            !-- p stylecolor: rgba(255, 255, 255, 0.8); font-size: 1rem; margin: 0; line-height: 1.6;>Creating service pages, FAQs, and contact forms with the editor/p> -->          !-- /div> -->        !-- /div> -->      /div>    /div>    !-- Final Quote with enhanced styling -->    div stylemax-width: 900px; margin: 0 auto; background: rgba(16, 185, 129, 0.1); backdrop-filter: blur(20px); border: 1px solid rgba(16, 185, 129, 0.2); border-radius: 28px; padding: 3.5rem; color: white; text-align: center; box-shadow: 0 25px 60px rgba(16, 185, 129, 0.1);>      div stylefont-size: 3rem; margin-bottom: 2rem; opacity: 0.7;>💬/div>      blockquote stylefont-style: italic; font-size: 1.4rem; margin: 0 0 2.5rem 0; line-height: 1.7; font-weight: 500; color: rgba(255, 255, 255, 0.95);>        All in all, its a brilliant system and with a little practice, its a breeze to work with. I would highly recommend this product to anyone who is serious about creating websites.      /blockquote>      div styleborder-top: 1px solid rgba(255, 255, 255, 0.1); padding-top: 2rem;>        div stylefont-weight: 700; font-size: 1.3rem; color: #6EE7B7; margin-bottom: 0.5rem;>— Geoff Lord/div>        div stylefont-size: 1.1rem; color: rgba(255, 255, 255, 0.8);>The Marketing Tutor • Age 82 • 50+ EziStack Websites/div>      /div>    /div>  /div>/section>style>@keyframes float {  0%, 100% { transform: translateY(0px) rotate(0deg); }  33% { transform: translateY(-20px) rotate(1deg); }  66% { transform: translateY(10px) rotate(-1deg); }}/style>!-- User Testimonials & Activity Section -->section classtestimonials-showcase-section>    div classtestimonials-container>                !-- Header -->        div classtestimonials-header data-aosfade-up>            h2 classtestimonials-title>                See What Others Are Building with EziStack            /h2>            p classtestimonials-subtitle>                Real people. Real sites. Real results — built in minutes, not weeks.            /p>        /div>      			div data-aosfade-up data-aos-delay300     stylemax-width:760px;margin:8px auto 48px auto;display:flex;flex-direction:column;gap:12px;>  !-- 1 -->  div styledisplay:flex;gap:12px;align-items:flex-start;padding:16px 18px;              background:linear-gradient(180deg,#2456d8,#3B82F6); /* lighter blue */              border:3px solid var(--accent);border-radius:16px;              box-shadow:0 10px 24px rgba(30,64,175,.28);              transition:transform .2s ease, box-shadow .2s ease;>    div styleflex-shrink:0;width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;                background:var(--accent);color:#fff;font-size:20px;>🚀/div>    div styleline-height:1.35;>      h3 stylemargin:0 0 4px;color:#fff;font-size:1.15rem;font-weight:900;letter-spacing:-.01em;>        Launch dormant domains into monetized sites span stylecolor:var(--accent);>in minutes/span>.      /h3>      p stylemargin:0;color:#E0E7FF;font-size:.96rem;>Full builds with branding, pages, and posts—ready to grow./p>    /div>  /div>  !-- 2 -->  div styledisplay:flex;gap:12px;align-items:flex-start;padding:16px 18px;              background:linear-gradient(180deg,#2456d8,#3B82F6);              border:3px solid var(--secondary);border-radius:16px;              box-shadow:0 10px 24px rgba(30,64,175,.28);              transition:transform .2s ease, box-shadow .2s ease;>    div styleflex-shrink:0;width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;                background:var(--secondary);color:#fff;font-size:20px;>🔗/div>    div styleline-height:1.35;>      h3 stylemargin:0 0 4px;color:#fff;font-size:1.15rem;font-weight:900;letter-spacing:-.01em;>        Build PBNs with span stylecolor:var(--accent);>zero WordPress footprints/span>.      /h3>      p stylemargin:0;color:#E0E7FF;font-size:.96rem;>Static deploys. No plugins. Minimal attack surface./p>    /div>  /div>  !-- 3 -->  div styledisplay:flex;gap:12px;align-items:flex-start;padding:16px 18px;              background:linear-gradient(180deg,#2456d8,#3B82F6);              border:3px solid var(--success);border-radius:16px;              box-shadow:0 10px 24px rgba(30,64,175,.28);              transition:transform .2s ease, box-shadow .2s ease;>    div styleflex-shrink:0;width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;                background:var(--success);color:#fff;font-size:20px;>📈/div>    div styleline-height:1.35;>      h3 stylemargin:0 0 4px;color:#fff;font-size:1.15rem;font-weight:900;letter-spacing:-.01em;>        Scale authority blogs with span stylecolor:var(--accent);>scheduled daily posting/span>.      /h3>      p stylemargin:0;color:#E0E7FF;font-size:.96rem;>Smart silos, interlinking, and freshness updates built in./p>    /div>  /div>  !-- 4 -->  div styledisplay:flex;gap:12px;align-items:flex-start;padding:16px 18px;              background:linear-gradient(180deg,#2456d8,#3B82F6);              border:3px solid var(--accent);border-radius:16px;              box-shadow:0 10px 24px rgba(30,64,175,.28);              transition:transform .2s ease, box-shadow .2s ease;>    div styleflex-shrink:0;width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;                background:var(--primary);color:#fff;font-size:20px;>💼/div>    div styleline-height:1.35;>      h3 stylemargin:0 0 4px;color:#fff;font-size:1.15rem;font-weight:900;letter-spacing:-.01em;>        Deliver client sites span stylecolor:var(--accent);>in under an hour/span> — and charge premium rates.      /h3>      p stylemargin:0;color:#E0E7FF;font-size:.96rem;>Logos, pages, content, and SEO—handed over same day./p>    /div>  /div>/div>        !-- Call to Action -->        div classcall-to-action-banner data-aoszoom-in data-aos-delay400>            div classcall-to-action-content>                h3>🎯 Your Turn to Build/h3>                p>                   Your Domain Portfolio, Your PBN, Your Next Authority Blog — span classhighlight-accent-text>EziStack Turns Them into Real Traffic Assets in Minutes/span>. Youve Seen How Theyre Using It… Now Its Your Turn.                /p>            /div>        /div>    /div>/section>!-- Video Testimonial 3 - Dragan (Updated) -->section classrelative flex items-center hero-gradient stylepadding: 4rem 1.5rem; margin-bottom: 4rem; data-aosfade-up>    !-- Floating shapes (matching hero section) -->  div classfloating-shapes>    div classshape shape-1>/div>    div classshape shape-2>/div>    div classshape shape-3>/div>    div classshape shape-4>/div>  /div>    div stylemax-width: 1200px; margin: 0 auto; position: relative; z-index: 10; width: 100%;>        !-- Header Section -->    div styletext-align: center; margin-bottom: 3rem;>      div styledisplay: inline-flex; align-items: center; gap: 0.75rem; background: rgba(59, 130, 246, 0.15); border: 1px solid rgba(59, 130, 246, 0.3); padding: 0.6rem 1.2rem; border-radius: 25px; margin-bottom: 1.5rem; backdrop-filter: blur(10px);>        span stylefont-size: 1.2rem;>🔥/span>        span stylecolor: #93C5FD; font-weight: 700; font-size: 0.85rem; letter-spacing: 0.5px; text-transform: uppercase;>Comprehensive Review/span>      /div>            h3 stylefont-family: Poppins, sans-serif; font-size: clamp(2rem, 4vw, 2.75rem); font-weight: 900; color: white; margin: 0 0 1rem 0; line-height: 1.1; letter-spacing: -0.025em;>        We All Need Websites —        span stylecolor: var(--accent); display: block; margin-top: 0.5rem;>EziStack Does It Fast & Cheap/span>      /h3>            p stylecolor: rgba(255, 255, 255, 0.9); font-size: 1.1rem; font-weight: 500; margin: 0 0 1rem 0; max-width: 750px; margin-left: auto; margin-right: auto; line-height: 1.5;>        A 6-minute deep-dive review covering everything you need to know about EziStacks capabilities      /p>            div stylebackground: rgba(245, 158, 11, 0.15); border: 1px solid rgba(245, 158, 11, 0.3); padding: 1rem 2rem; border-radius: 50px; display: inline-block; margin-top: 1rem; backdrop-filter: blur(10px);>        span stylecolor: #FDE68A; font-weight: 700; font-size: 1rem;>2+ years of beta testing experience/span>      /div>    /div>    !-- Video Container - Matching Geoffs sizing -->    div stylemax-width: 950px; margin: 0 auto 3rem auto;>      div styleposition: relative; background: linear-gradient(145deg, #000000, #1a1a1a); border-radius: 28px; overflow: hidden; box-shadow: 0 30px 80px rgba(0, 0, 0, 0.6), 0 0 50px rgba(245, 158, 11, 0.15); border: 2px solid rgba(245, 158, 11, 0.3);>        div styleposition: relative; padding-bottom: 56.25%; height: 0; overflow: hidden;>          iframe             srchttps://www.youtube.com/embed/nxi34nJRHrE             frameborder0             allowfullscreen            styleposition: absolute; top: 0; left: 0; width: 100%; height: 100%;>          /iframe>        /div>                !-- Video badges -->        div styleposition: absolute; top: 1.5rem; left: 1.5rem; display: flex; gap: 0.75rem;>          div stylebackground: rgba(245, 158, 11, 0.9); color: white; padding: 0.6rem 1.2rem; border-radius: 20px; font-size: 0.9rem; font-weight: 700; box-shadow: 0 4px 12px rgba(245, 158, 11, 0.3);>            2+ Years Beta Testing          /div>        /div>                div styleposition: absolute; bottom: 1.5rem; right: 1.5rem; background: rgba(0, 0, 0, 0.8); color: white; padding: 0.6rem 1.2rem; border-radius: 25px; font-size: 0.95rem; font-weight: 600;>          6:02 - Complete Review        /div>      /div>    /div>    !-- Single Quote Section -->    div stylemax-width: 800px; margin: 0 auto 3rem auto; background: rgba(255, 255, 255, 0.1); border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 20px; padding: 2.5rem; color: white; text-align: center; backdrop-filter: blur(15px);>      div stylefont-size: 2.5rem; margin-bottom: 1.5rem; opacity: 0.7;>💬/div>      blockquote stylefont-style: italic; font-size: 1.3rem; margin: 0 0 2rem 0; line-height: 1.6; font-weight: 500;>        We are all doing different stuff online... affiliate, local agency, providing services online. We all need websites and EziStack can build those websites for you for cents.      /blockquote>      div styleborder-top: 1px solid rgba(255, 255, 255, 0.1); padding-top: 1.5rem;>        div stylefont-weight: 700; color: var(--accent); font-size: 1.2rem; margin-bottom: 0.5rem;>— Dragan/div>        div stylefont-size: 1rem; color: rgba(255, 255, 255, 0.8);>Marketing Professional • 2+ Years Beta Testing/div>      /div>    /div>        !-- Bottom CTA Section -->    div styletext-center;>      div stylemax-width: 700px; margin: 0 auto;>        h4 stylefont-family: Poppins, sans-serif; font-size: 1.8rem; font-weight: 800; color: white; margin: 0 0 1rem 0;>          Ready to See What EziStack Can Build for You?        /h4>        p stylecolor: rgba(255, 255, 255, 0.8); font-size: 1.1rem; margin: 0 0 2rem 0; line-height: 1.6;>          Whether you need 1 website or 50 - EziStack builds what you need, fast and affordable.        /p>		      /div>	   div styletext-align: center;>        button onclicksmoothScrollToGetStarted() stylebackground: var(--accent); color: white; font-family: Poppins, sans-serif; font-weight: 700; font-size: 1.1rem; padding: 1.2rem 2.5rem; border-radius: 50px; border: 2px solid var(--primary); cursor: pointer; transition: all 0.3s ease; box-shadow: 0 10px 30px rgba(245, 158, 11, 0.3);>          Get Your EziStack License Today        /button>		/div>    /div>  /div>/section>!-- Scaling Problem Section -->section classpy-16 lg:py-24 stylebackground: linear-gradient(135deg, var(--bg-light) 0%, var(--bg) 100%);>    div classmax-w-6xl mx-auto px-6 lg:px-8>        !-- Main Headline -->        div classtext-center mb-16 data-aosfade-up>            h2 classfont-poppins text-3xl lg:text-5xl font-black mb-6 stylecolor: var(--text); line-height: 1.2;>                Heres Why Most Marketers Never Scale Past                 span stylecolor: var(--primary);>5 Sites/span>            /h2>            p classtext-xl lg:text-2xl font-medium max-w-4xl mx-auto stylecolor: var(--text-light);>                Its not content anymore—AI solved that. Its the span classfont-bold stylecolor: var(--accent);>infrastructure nightmare./span>            /p>        /div>        !-- The Real Bottlenecks -->        div classmb-16 data-aosfade-up data-aos-delay200>            h3 classfont-poppins text-2xl lg:text-3xl font-bold mb-8 text-center stylecolor: var(--text);>                The Real Bottlenecks            /h3>                        div classgrid grid-cols-1 md:grid-cols-2 gap-6 max-w-5xl mx-auto>                div classbg-white rounded-xl p-6 border-l-4 shadow-lg hover:shadow-xl transition-all duration-300 styleborder-left-color: var(--primary); data-aosfade-right data-aos-delay300>                    h4 classfont-bold text-lg mb-3 stylecolor: var(--primary);>Plugin Hell/h4>                    p stylecolor: var(--text-light); line-height: 1.6;>Every site needs 8–12 plugins. Each update risks breaking something. One bad update can crash your entire network./p>                /div>                                div classbg-white rounded-xl p-6 border-l-4 shadow-lg hover:shadow-xl transition-all duration-300 styleborder-left-color: var(--secondary); data-aosfade-left data-aos-delay350>                    h4 classfont-bold text-lg mb-3 stylecolor: var(--secondary);>Hosting Multiplication/h4>                    p stylecolor: var(--text-light); line-height: 1.6;>$20–30 per site adds up fast. Plus youre leaving footprints when hosting multiple sites on the same server/IP./p>                /div>                                div classbg-white rounded-xl p-6 border-l-4 shadow-lg hover:shadow-xl transition-all duration-300 styleborder-left-color: var(--accent); data-aosfade-right data-aos-delay400>                    h4 classfont-bold text-lg mb-3 stylecolor: var(--accent);>Dashboard Juggling/h4>                    p stylecolor: var(--text-light); line-height: 1.6;>Different logins for every site. WordPress updates, plugin conflicts, security patches. Constant maintenance stealing your time./p>                /div>                                div classbg-white rounded-xl p-6 border-l-4 shadow-lg hover:shadow-xl transition-all duration-300 styleborder-left-color: var(--success); data-aosfade-left data-aos-delay450>                    h4 classfont-bold text-lg mb-3 stylecolor: var(--success);>The Scaling Trap/h4>                    p stylecolor: var(--text-light); line-height: 1.6;>Each new site multiplies these problems. Site #10 takes longer to set up than Site #1 because youre managing nine others./p>                /div>            /div>        /div>        !-- Hidden Cost -->        div classtext-center mb-12 data-aosfade-up data-aos-delay500>            div classbg-white rounded-2xl p-8 lg:p-12 shadow-xl border-2 styleborder-color: var(--accent); max-width: 4xl; margin: 0 auto;>                h3 classfont-poppins text-2xl lg:text-3xl font-bold mb-6 stylecolor: var(--text);>                    The Hidden Cost of DIY Infrastructure                /h3>                p classtext-lg lg:text-xl mb-6 stylecolor: var(--text-light); line-height: 1.7;>                    Even with AI content, properly wiring strong>ONE/strong> professional site with branding, schema, automation, and secure hosting still takes span classfont-bold stylecolor: var(--primary);>15–20 hours/span>.                /p>                div classbg-gradient-to-r from-orange-50 to-blue-50 rounded-xl p-6 mb-6>                    p classtext-xl lg:text-2xl font-bold mb-2 stylecolor: var(--accent);>                        If your time is worth just $25/hour, thats $375–$500 per site in setup time alone.                    /p>                /div>                p classtext-lg stylecolor: var(--text-light); line-height: 1.6;>                    Multiply that by 10, 20, or 50 sites—and the cost isnt just money, its strong>momentum youll never get back./strong>                /p>            /div>        /div>        !-- How EziStack Breaks the Cycle -->        div classmb-12 data-aosfade-up data-aos-delay600>            h3 classfont-poppins text-2xl lg:text-3xl font-bold mb-8 text-center stylecolor: var(--text);>                How EziStack Breaks the Cycle            /h3>                        div classgrid grid-cols-1 md:grid-cols-2 gap-6 max-w-4xl mx-auto>                div classflex items-start space-x-4 bg-white rounded-xl p-6 shadow-lg data-aosfade-right data-aos-delay700>                    div classflex-shrink-0 w-8 h-8 rounded-full flex items-center justify-center stylebackground-color: var(--success);>                        span classtext-white font-bold text-sm>✓/span>                    /div>                    div>                        h4 classfont-bold text-lg mb-2 stylecolor: var(--text);>No plugins/h4>                        p stylecolor: var(--text-light);>No conflicts, no updates, no crashes/p>                    /div>                /div>                                div classflex items-start space-x-4 bg-white rounded-xl p-6 shadow-lg data-aosfade-left data-aos-delay750>                    div classflex-shrink-0 w-8 h-8 rounded-full flex items-center justify-center stylebackground-color: var(--success);>                        span classtext-white font-bold text-sm>✓/span>                    /div>                    div>                        h4 classfont-bold text-lg mb-2 stylecolor: var(--text);>Static hosting/h4>                        p stylecolor: var(--text-light);>Deploy anywhere for pennies, no server footprints/p>                    /div>                /div>                                div classflex items-start space-x-4 bg-white rounded-xl p-6 shadow-lg data-aosfade-right data-aos-delay800>                    div classflex-shrink-0 w-8 h-8 rounded-full flex items-center justify-center stylebackground-color: var(--success);>                        span classtext-white font-bold text-sm>✓/span>                    /div>                    div>                        h4 classfont-bold text-lg mb-2 stylecolor: var(--text);>One dashboard/h4>                        p stylecolor: var(--text-light);>Manage 100+ sites from a single interface/p>                    /div>                /div>                                div classflex items-start space-x-4 bg-white rounded-xl p-6 shadow-lg data-aosfade-left data-aos-delay850>                    div classflex-shrink-0 w-8 h-8 rounded-full flex items-center justify-center stylebackground-color: var(--success);>                        span classtext-white font-bold text-sm>✓/span>                    /div>                    div>                        h4 classfont-bold text-lg mb-2 stylecolor: var(--text);>Full automation/h4>                        p stylecolor: var(--text-light);>Schema, optimization, scheduling handled automatically/p>                    /div>                /div>            /div>        /div>div styletext-align: center; margin-top: 64px; margin-bottom: 32px; padding: 0 24px; data-aosfade-up data-aos-delay900>    div stylemax-width: 900px; margin: 0 auto;>        h3 stylefont-family: Poppins, sans-serif; font-size: clamp(28px, 4vw, 42px); font-weight: 900; margin-bottom: 32px; color: #1E40AF; letter-spacing: -0.025em; line-height: 1.1;>            Bottom Line        /h3>        div stylemax-width: 800px; margin: 0 auto; margin-bottom: 48px;>            p stylefont-size: clamp(18px, 2.5vw, 24px); font-weight: 500; line-height: 1.5; margin-bottom: 16px; color: #1F2937;>                Most marketers stall at 3–5 sites.            /p>            p stylefont-size: clamp(18px, 2.5vw, 24px); font-weight: 700; line-height: 1.5; margin-bottom: 16px; color: #F59E0B;>                EziStack eliminates the infrastructure headaches, pays for itself in just a couple of builds, and unlocks scale—            /p>            p stylefont-size: clamp(18px, 2.5vw, 24px); font-weight: 500; line-height: 1.5; margin-bottom: 0; color: #1F2937;>                so while others wrestle with WordPress, youre already deploying                 span stylefont-weight: 800; color: #1E40AF;>Site #50/span>.            /p>        /div>                !-- Elegant Transition -->        div stylemargin-top: 64px; margin-bottom: 32px; data-aosfade-up data-aos-delay1000>            p stylefont-size: clamp(18px, 2.5vw, 22px); font-weight: 600; margin-bottom: 16px; color: #1F2937;>                Ready to shatter the 5-site barrier?            /p>            p stylefont-family: Poppins, sans-serif; font-size: clamp(24px, 3.5vw, 32px); font-weight: 800; color: #F59E0B; letter-spacing: -0.025em; margin: 0; line-height: 1.2;>                Heres your breakthrough:            /p>        /div>    /div>/div>/div>    /div>/section>!--testimonials-->section classrelative py-24 overflow-hidden stylebackground: linear-gradient(135deg, #0F172A 0%, #1E293B 50%, #0F172A 100%);>        !-- Decorative grid pattern overlay -->    div classabsolute inset-0 opacity-5>        div classabsolute inset-0 stylebackground-image: radial-gradient(circle at 1px 1px, white 1px, transparent 0); background-size: 40px 40px;>/div>    /div>        !-- Gradient orbs for modern effect -->    div classabsolute top-0 left-1/4 w-96 h-96 bg-blue-500 rounded-full mix-blend-overlay filter blur-3xl opacity-20 animate-pulse>/div>    div classabsolute bottom-0 right-1/4 w-96 h-96 bg-purple-500 rounded-full mix-blend-overlay filter blur-3xl opacity-20 animate-pulse styleanimation-delay: 1s;>/div>        div classrelative z-10 max-w-7xl mx-auto px-4 sm:px-6 lg:px-8>                !-- Section Header - Modern & Bold -->        div classtext-center mb-20>            h2 classtext-5xl md:text-6xl lg:text-7xl font-black text-white mb-6 stylefont-family: Poppins, sans-serif; letter-spacing: -0.03em; line-height: 1.1;>                Trusted by                span classblock mt-3 bg-gradient-to-r from-blue-400 via-cyan-400 to-blue-500 bg-clip-text text-transparent>                    SEO Professionals                /span>            /h2>                        p classtext-xl md:text-2xl text-gray-300 max-w-3xl mx-auto font-medium>                See why experienced marketers whove built their own tools are choosing EziStack            /p>        /div>        !-- FEATURED: Earl Gardner - Text Below Image -->        div classmax-w-5xl mx-auto mb-12>            div classrelative bg-gradient-to-br from-blue-600 via-blue-500 to-cyan-500 rounded-3xl shadow-2xl overflow-hidden border border-blue-400/30>                !-- Shine effect -->                div classabsolute inset-0 bg-gradient-to-tr from-transparent via-white/10 to-transparent>/div>                                div classrelative p-10 md:p-12>                    !-- Top badges row -->                    div classflex flex-wrap items-center justify-center gap-6 mb-8>                        !-- White badge with better contrast -->                        div classinline-flex items-center gap-2.5 bg-white text-blue-900 text-sm font-black px-6 py-3 rounded-full shadow-lg>                            svg classw-5 h-5 text-yellow-500 fillcurrentColor viewBox0 0 20 20>                                path dM9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z/>                            /svg>                            span>SEO EXPERT SINCE 2007/span>                        /div>                                             !-- FIXED: Bright yellow stars -->                        div classflex gap-2>                            svg classw-7 h-7 fill-current drop-shadow-lg fill#FBBF24 viewBox0 0 24 24>                                path dM12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z/>                            /svg>                            svg classw-7 h-7 fill-current drop-shadow-lg fill#FBBF24 viewBox0 0 24 24>                                path dM12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z/>                            /svg>                            svg classw-7 h-7 fill-current drop-shadow-lg fill#FBBF24 viewBox0 0 24 24>                                path dM12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z/>                            /svg>                            svg classw-7 h-7 fill-current drop-shadow-lg fill#FBBF24 viewBox0 0 24 24>                                path dM12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z/>                            /svg>                            svg classw-7 h-7 fill-current drop-shadow-lg fill#FBBF24 viewBox0 0 24 24>                                path dM12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z/>                            /svg>                        /div>                    /div>                                        div classflex flex-col md:flex-row md:items-start gap-8>                        !-- FIXED: Author Info - Text Below Image -->                        div classflex-shrink-0>                            div classflex flex-col items-center text-center>                                img srcimg/earl-gardner.png altEarl Gardner classw-32 h-32 md:w-36 md:h-36 rounded-2xl object-cover border-4 border-white shadow-2xl mb-4>                                div>                                    h3 classfont-black text-white text-2xl md:text-3xl mb-2 stylefont-family: Poppins, sans-serif; text-shadow: 0 2px 10px rgba(0,0,0,0.3);>Earl Gardner/h3>                                    p classtext-white text-base font-bold mb-1>SEO Expert Since 2007/p>                                    p classtext-blue-100 text-sm>Tool Builder & Industry Veteran/p>                                /div>                            /div>                        /div>                                                !-- Testimonial Text -->                        div classflex-1>                            div classrelative>                                !-- Quote mark with spacing -->                               !-- svg classabsolute -top-8 -left-6 w-16 h-16 text-white opacity-20 fillcurrentColor viewBox0 0 32 32>                                    path dM10 8c-3.3 0-6 2.7-6 6v10h10V14H8c0-1.1.9-2 2-2h2V8h-2zm12 0c-3.3 0-6 2.7-6 6v10h10V14h-6c0-1.1.9-2 2-2h2V8h-2z/>                                /svg>-->                                                                p classrelative pt-2 text-white text-lg md:text-xl leading-relaxed font-medium styletext-shadow: 0 1px 3px rgba(0,0,0,0.2);>                                    Ive been doing SEO since around 2007, and during that time Ive not only tried and used countless website and SEO tools, strong classtext-yellow-300 font-bold>Ive also built a few of my own./strong> Ive been using EziStack for about a month now, and I can honestly say strong classtext-yellow-300 font-bold>its among, if not the best, website-building tool Ive ever come across./strong>                                    br>br>                                    Beyond its insane speed for building out the sites, what really stands out to me is the flexibility; you can either use your own SEO strategies or just make use of the built-in ones. Honestly, for the price its currently being offered at, strong classtext-yellow-300 font-bold>youd have to be crazy not to get it./strong>                                /p>                            /div>                        /div>                    /div>                /div>            /div>        /div>        !-- Middle Row: Rob & Harlon - FIXED: Vertically Centered -->        div classgrid grid-cols-1 md:grid-cols-2 gap-8 max-w-6xl mx-auto mb-12>                        !-- Testimonial: Rob Wells -->            div classgroup bg-gradient-to-br from-slate-800 to-slate-900 rounded-2xl shadow-xl hover:shadow-2xl transition-all duration-300 overflow-hidden border border-slate-700 hover:border-blue-500/50 h-full>                div classp-8 h-full flex>                    !-- FIXED: Vertically centered layout -->                    div classflex flex-col sm:flex-row gap-6 items-center>                        !-- Left side: Image + Info -->                        div classflex-shrink-0 flex flex-col items-center text-center sm:w-32>                            img srcimg/rob-wells.jpg altRob Wells classw-20 h-20 rounded-xl object-cover border-2 border-blue-400 group-hover:border-blue-300 transition-colors shadow-lg mb-4>                            h4 classfont-bold text-white text-base mb-1>Rob Wells/h4>                            p classtext-xs text-gray-400 mb-3>Web Developer & Marketer/p>                                                        !-- FIXED: Bright yellow stars -->                            div classflex gap-1>                                svg classw-4 h-4 fill-current fill#FBBF24 viewBox0 0 24 24>                                    path dM12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z/>                                /svg>                                svg classw-4 h-4 fill-current fill#FBBF24 viewBox0 0 24 24>                                    path dM12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z/>                                /svg>                                svg classw-4 h-4 fill-current fill#FBBF24 viewBox0 0 24 24>                                    path dM12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z/>                                /svg>                                svg classw-4 h-4 fill-current fill#FBBF24 viewBox0 0 24 24>                                    path dM12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z/>                                /svg>                                svg classw-4 h-4 fill-current fill#FBBF24 viewBox0 0 24 24>                                    path dM12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z/>                                /svg>                            /div>                        /div>                                                !-- Right side: Testimonial -->                        div classflex-1 sm:border-l sm:border-slate-700 sm:pl-6 flex >                            p classtext-gray-300 text-base md:text-lg leading-relaxed>                                EziStack makes launching cloud sites ridiculously fast, strong classtext-white>we can go from idea to live in minutes./strong> Its hands-down the smoothest setup weve ever used for getting projects online.                            /p>                        /div>                    /div>                /div>                                !-- Accent bar -->                div classh-1.5 bg-gradient-to-r from-blue-500 to-cyan-500>/div>            /div>            !-- Testimonial: Harlon Richards -->            div classgroup bg-gradient-to-br from-slate-800 to-slate-900 rounded-2xl shadow-xl hover:shadow-2xl transition-all duration-300 overflow-hidden border border-slate-700 hover:border-blue-500/50 h-full>                div classp-8 h-full flex>                    !-- FIXED: Vertically centered layout -->                    div classflex flex-col sm:flex-row gap-6 items-center>                        !-- Left side: Image + Info -->                        div classflex-shrink-0 flex flex-col items-center text-center sm:w-32>                            img srcimg/harlon-richards.png altHarlon Richards classw-20 h-20 rounded-xl object-cover border-2 border-blue-400 group-hover:border-blue-300 transition-colors shadow-lg mb-4>                            h4 classfont-bold text-white text-base mb-1>Harlon Richards/h4>                            p classtext-xs text-gray-400 mb-3>SEO Professional Since 2017/p>                                                        !-- FIXED: Bright yellow stars -->                            div classflex gap-1>                                svg classw-4 h-4 fill-current fill#FBBF24 viewBox0 0 24 24>                                    path dM12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z/>                                /svg>                                svg classw-4 h-4 fill-current fill#FBBF24 viewBox0 0 24 24>                                    path dM12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z/>                                /svg>                                svg classw-4 h-4 fill-current fill#FBBF24 viewBox0 0 24 24>                                    path dM12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z/>                                /svg>                                svg classw-4 h-4 fill-current fill#FBBF24 viewBox0 0 24 24>                                    path dM12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z/>                                /svg>                                svg classw-4 h-4 fill-current fill#FBBF24 viewBox0 0 24 24>                                    path dM12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z/>                                /svg>                            /div>                        /div>                                                !-- Right side: Testimonial -->                        div classflex-1 sm:border-l sm:border-slate-700 sm:pl-6>                            p classtext-gray-300 text-base md:text-lg leading-relaxed>                                Ive been in the SEO game since 2017, testing countless tools and even building a few myself. After using EziStack for a month, Im genuinely impressed—strong classtext-white>its easily one of the best site-building platforms Ive encountered./strong> The speed for creating sites is remarkable, and what I really appreciate is how it lets me apply my own SEO strategies. For the price, its an absolute no-brainer.                            /p>                        /div>                    /div>                /div>                                !-- Accent bar -->                div classh-1.5 bg-gradient-to-r from-blue-500 to-cyan-500>/div>            /div>        /div>        !-- Bottom: Pol vanRhee -->        div classmax-w-5xl mx-auto>            div classgroup bg-gradient-to-br from-slate-800 to-slate-900 rounded-2xl shadow-xl hover:shadow-2xl transition-all duration-300 overflow-hidden border border-slate-700 hover:border-purple-500/50 >                div classp-8 md:p-10>                    div classflex flex-col md:flex-row gap-8>                        !-- Left side: Badge + Stars + Author -->                        div classmd:w-64 flex-shrink-0 flex flex-col items-center text-center>                            !-- FIXED: Brighter, more visible badge -->                            div classinline-flex items-center gap-2 text-white text-xs font-bold px-4 py-2 rounded-full mb-4 shadow-lg stylebackground: linear-gradient(135deg, #8B5CF6 0%, #A78BFA 100%);>                                svg classw-4 h-4 fillcurrentColor viewBox0 0 20 20>                                    path fill-ruleevenodd dM6 6V5a3 3 0 013-3h2a3 3 0 013 3v1h2a2 2 0 012 2v3.57A22.952 22.952 0 0110 13a22.95 22.95 0 01-8-1.43V8a2 2 0 012-2h2zm2-1a1 1 0 011-1h2a1 1 0 011 1v1H8V5zm1 5a1 1 0 011-1h.01a1 1 0 110 2H10a1 1 0 01-1-1z clip-ruleevenodd/>                                    path dM2 13.692V16a2 2 0 002 2h12a2 2 0 002-2v-2.308A24.974 24.974 0 0110 15c-2.796 0-5.487-.46-8-1.308z/>                                /svg>                                AGENCY OWNER                            /div>                                                        !-- Profile Image -->                            img srcimg/pol-vanrhee.webp altPol vanRhee classw-24 h-24 rounded-xl object-cover border-2 border-pink-400 shadow-xl mb-4>                                                        !-- Author Info -->                            h4 classfont-bold text-white text-lg mb-1>Pol vanRhee/h4>                            p classtext-sm text-gray-400 mb-4>Agency Owner/p>                                                        !-- FIXED: Bright yellow stars -->                            div classflex gap-1>                                svg classw-5 h-5 fill-current fill#FBBF24 viewBox0 0 24 24>                                    path dM12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z/>                                /svg>                                svg classw-5 h-5 fill-current fill#FBBF24 viewBox0 0 24 24>                                    path dM12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z/>                                /svg>                                svg classw-5 h-5 fill-current fill#FBBF24 viewBox0 0 24 24>                                    path dM12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z/>                                /svg>                                svg classw-5 h-5 fill-current fill#FBBF24 viewBox0 0 24 24>                                    path dM12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z/>                                /svg>                                svg classw-5 h-5 fill-current fill#FBBF24 viewBox0 0 24 24>                                    path dM12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z/>                                /svg>                            /div>                        /div>                                                !-- Right side: Testimonial Text -->                        div classflex-1 md:border-l md:border-slate-700 md:pl-8>                            p classtext-gray-300 text-base md:text-lg leading-relaxed>                                I almost dont want anyone else to know about EziStack (or Abbas and his team)—I kind of want to keep this as my own secret weapon. Sure, the program is amazing and is actually getting better as we go along. And sure, strong classtext-white>I havent gotten this kind of support from any other product or service team./strong> They are on it right away and communicate with me so quickly and effectively I am flabbergasted.                                br>br>                                I knew close to nothing about AI, and just by using the tools strong classtext-white>I am seeming like an expert to my clients./strong> Anything I need to do, I can, because this program does it. My clients think I have superpowers. But I just ask support or watch the tons of videos showing everything. Some show them making the same mistakes I make and then how to fix them. Its almost like they are in my head.                                br>br>                                I dont consider this just a tool and a company, they are gurus helping me get new clients and making me money. So pardon me if I kinda want to keep them to myself. So, dont buy it. Let me keep this just for me. em classtext-gray-400>Sorry, no good reviews for you!/em>                            /p>                        /div>                    /div>                /div>                                !-- Accent bar -->                div classh-1.5 bg-gradient-to-r from-pink-500 to-rose-500>/div>            /div>        /div>    /div>/section>section idget-started stylepadding: 64px 24px; background: linear-gradient(135deg, #F8FAFC 0%, #FFFFFF 100%);>    div stylemax-width: 1200px; margin: 0 auto;>                !-- Header -->        div styletext-align: center; margin-bottom: 64px;>            div styledisplay: inline-block; background: linear-gradient(135deg, #8B5CF6 0%, #7C3AED 100%); color: white; padding: 8px 24px; border-radius: 25px; font-size: 14px; font-weight: 600; letter-spacing: 0.5px; margin-bottom: 24px; text-transform: uppercase;>                Simple, Transparent Pricing            /div>                        h2 stylefont-family: Poppins, sans-serif; font-size: 48px; font-weight: 900; color: #1E40AF; margin: 0 0 24px 0; line-height: 1.1; letter-spacing: -0.02em;>                Choose Your Plan.br>Build at Your Pace.            /h2>            p stylefont-size: 20px; color: #64748B; margin: 0; font-weight: 500; max-width: 720px; margin-left: auto; margin-right: auto; line-height: 1.6;>                12-month license with opt-in renewal. No surprises. Just credits, speed, and freedom to build.            /p>        /div>						!-- div stylemax-width: 900px; margin: 0 auto 80px auto;> -->    !-- div stylebackground: linear-gradient(135deg, #000000 0%, #DC2626 100%); padding: 32px; border-radius: 16px; color: white; box-shadow: 0 12px 28px rgba(220, 38, 38, 0.3); border: 2px solid #F59E0B; text-align: center;> -->        !-- div stylefont-size: 28px; margin-bottom: 8px;>🎁/div> -->        !-- h3 stylefont-family: Poppins, sans-serif; font-size: 28px; font-weight: 900; margin: 0 0 12px 0; color: #FCD34D;> -->            !-- Black Friday Exclusive Savings! -->        !-- /h3> -->        !-- p stylefont-size: 16px; margin: 0 0 24px 0; opacity: 0.95;> -->            !-- Use these coupon codes at checkout to unlock your discount -->        !-- /p> -->                      !-- div styledisplay: grid; grid-template-columns: 1fr 1fr; gap: 16px; max-width: 700px; margin: 0 auto;> -->                      !-- div stylebackground: rgba(252, 211, 77, 0.15); border: 2px dashed #FCD34D; padding: 20px; border-radius: 12px;> -->                !-- div stylefont-size: 14px; font-weight: 600; margin-bottom: 8px; opacity: 0.9;> -->                    !-- For Annual Plans -->                !-- /div> -->                !-- div stylebackground: rgba(0, 0, 0, 0.3); padding: 12px; border-radius: 8px; margin-bottom: 8px;> -->                    !-- code stylefont-size: 20px; font-weight: 800; color: #FCD34D; letter-spacing: 1px;>BFCM25-ANNUAL/code> -->                !-- /div> -->                !-- div stylefont-size: 18px; font-weight: 700; color: #10B981;> -->                    !-- Save $50 -->                !-- /div> -->            !-- /div> -->                                   !-- div stylebackground: rgba(252, 211, 77, 0.15); border: 2px dashed #FCD34D; padding: 20px; border-radius: 12px;> -->                !-- div stylefont-size: 14px; font-weight: 600; margin-bottom: 8px; opacity: 0.9;> -->                    !-- For Monthly & Split Plans -->                !-- /div> -->                !-- div stylebackground: rgba(0, 0, 0, 0.3); padding: 12px; border-radius: 8px; margin-bottom: 8px;> -->                    !-- code stylefont-size: 20px; font-weight: 800; color: #FCD34D; letter-spacing: 1px;>BFCM25-MONTHLY/code> -->                !-- /div> -->                !-- div stylefont-size: 18px; font-weight: 700; color: #10B981;> -->                    !-- Save 18% -->                !-- /div> -->            !-- /div> -->        !-- /div> -->                !-- div stylemargin-top: 20px; font-size: 13px; opacity: 0.85;> -->            !-- ⏰ Limited time offer — Sale ends December 2nd, 2025 -->        !-- /div> -->    !-- /div> -->!-- /div> -->!-- style> -->!-- @media (max-width: 768px) { -->    !-- /* Make coupon grid stack on mobile */ -->    !-- divstyle*grid-template-columns: 1fr 1fr { -->        !-- grid-template-columns: 1fr !important; -->    !-- } -->!-- } -->!-- /style> -->		        !-- Plans Grid -->     div styledisplay: grid; grid-template-columns: 1fr; gap: 32px; max-width: 1050px; margin: 0 auto 48px auto;>                        div styledisplay: grid; grid-template-columns: 1fr; gap: 32px; classplans-container>                                !-- Growth Plan -->                div stylebackground: #FFFFFF; border-radius: 24px; padding: 36px; box-shadow: 0 12px 24px rgba(30, 64, 175, 0.08); border: 2px solid rgba(30, 64, 175, 0.12); position: relative; overflow: hidden; classgrowth-plan>                    div styletext-align: center;>                        div styledisplay: inline-flex; align-items: center; gap: 8px; background: linear-gradient(135deg, #DBEAFE 0%, #EFF6FF 100%); color: #1E40AF; padding: 8px 16px; border-radius: 20px; font-weight: 600; font-size: 12px; letter-spacing: 0.3px; margin-bottom: 20px;>                            🚀 Perfect for Getting Started                        /div>                                                h3 stylefont-family: Poppins, sans-serif; font-size: 32px; font-weight: 800; color: #1F2937; margin: 0 0 12px 0;>Growth/h3>                        p stylecolor: #64748B; font-size: 16px; margin: 0 0 24px 0;>Build momentum with solid credit capacity/p>                                                div styledisplay: flex; align-items: baseline; justify-content: center; gap: 8px; margin: 0 0 24px 0;>                            span stylefont-family: Poppins, sans-serif; font-size: 56px; font-weight: 900; color: #1E40AF; line-height: 1;>$247/span>                            span stylefont-size: 17px; color: #64748B; font-weight: 600;>/ 12 months/span>                        /div>                                                div stylebackground: linear-gradient(135deg, #EBF8FF 0%, #DBEAFE 100%); border: 2px solid #3B82F6; padding: 18px; border-radius: 12px; text-align: center; margin-bottom: 20px;>                            span stylefont-size: 36px; font-weight: 900; color: #1E40AF; display: block;>400/span>                            span stylefont-size: 14px; color: #1E40AF; font-weight: 600;>Builder Credits/span>                        /div>                                                !-- Monthly Allowance Badges -->                        div styledisplay: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 28px;>                            div stylebackground: #10B981; padding: 10px 8px; border-radius: 12px; box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3); display: flex; flex-direction: column; align-items: center; justify-content: center;>                                div stylefont-size: 24px; font-weight: 800; color: #FFFFFF; line-height: 1;>30/div>                                div styletext-align: center; margin-top: 4px;>                                    div stylefont-size: 12px; color: #FFFFFF; font-weight: 700; line-height: 1.2;>Blogs FREE/div>                                    div stylefont-size: 9px; color: rgba(255,255,255,0.9); font-weight: 600; line-height: 1.2; margin-top: 2px;>Per Month/div>                                /div>                            /div>                            div stylebackground: #10B981; padding: 10px 8px; border-radius: 12px; box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3); display: flex; flex-direction: column; align-items: center; justify-content: center;>                                div stylefont-size: 24px; font-weight: 800; color: #FFFFFF; line-height: 1;>30/div>                                div styletext-align: center; margin-top: 4px;>                                    div stylefont-size: 12px; color: #FFFFFF; font-weight: 700; line-height: 1.2;>Pages FREE/div>                                    div stylefont-size: 9px; color: rgba(255,255,255,0.9); font-weight: 600; line-height: 1.2; margin-top: 2px;>Per Month/div>                                /div>                            /div>                            div stylebackground: #10B981; padding: 10px 8px; border-radius: 12px; box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3); display: flex; flex-direction: column; align-items: center; justify-content: center;>                                div stylefont-size: 24px; font-weight: 800; color: #FFFFFF; line-height: 1;>30/div>                                div styletext-align: center; margin-top: 4px;>                                    div stylefont-size: 12px; color: #FFFFFF; font-weight: 700; line-height: 1.2;>Posts FREE/div>                                    div stylefont-size: 9px; color: rgba(255,255,255,0.9); font-weight: 600; line-height: 1.2; margin-top: 2px;>Per Month/div>                                /div>                            /div>                        /div>                    /div>                    ul stylelist-style: none; padding: 0; margin: 0 0 32px 0; display: grid; gap: 12px; text-align: left;>                        li styledisplay: flex; align-items: center; gap: 12px;>                            span stylewidth: 22px; height: 22px; background: #10B981; color: #fff; font-weight: 700; font-size: 13px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;>✓/span>                            span stylefont-weight: 600; color: #1F2937; font-size: 15px;>All features, templates & Cloud Deployment/span>                        /li>                        li styledisplay: flex; align-items: center; gap: 12px;>                            span stylewidth: 22px; height: 22px; background: #10B981; color: #fff; font-weight: 700; font-size: 13px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;>✓/span>                            span stylefont-weight: 600; color: #1F2937; font-size: 15px;>Priority support & training/span>                        /li>                        li styledisplay: flex; align-items: center; gap: 12px;>                            span stylewidth: 22px; height: 22px; background: #10B981; color: #fff; font-weight: 700; font-size: 13px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;>✓/span>                            span stylefont-weight: 600; color: #1F2937; font-size: 15px;>WordPress integration & FTP Publishing/span>                        /li>                        li styledisplay: flex; align-items: center; gap: 12px;>                            span stylewidth: 22px; height: 22px; background: #10B981; color: #fff; font-weight: 700; font-size: 13px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;>✓/span>                            span stylefont-weight: 600; color: #1F2937; font-size: 15px;>17 premium templates + custom builder/span>                        /li>                    /ul>                    div styledisplay: flex; flex-direction: column; gap: 12px;>                        button classbtn-checkout data-checkoutstandard data-itemezistack-growth-annual stylewidth: 100%; background: #1E40AF; color: #fff; font-family: Poppins, sans-serif; font-weight: 700; font-size: 16px; padding: 16px 24px; border-radius: 12px; border: none; cursor: pointer; box-shadow: 0 6px 16px rgba(30, 64, 175, 0.2); transition: all 0.3s ease;>                            Get Growth — Start Building                        /button>                        button classbtn-checkout data-checkoutsplit data-itemezistack-growth-split stylewidth: 100%; background: #FFFFFF; color: #1E40AF; font-weight: 600; font-size: 14px; padding: 13px 20px; border-radius: 12px; border: 2px solid #CBD5E1; cursor: pointer; transition: all 0.3s ease;>                            Or Split Pay: 3 × $90                        /button>                        button classbtn-checkout data-checkoutsplit data-itemezistack-growth-monthly stylewidth: 100%; background: #FFFFFF; color: #1E40AF; font-weight: 600; font-size: 14px; padding: 13px 20px; border-radius: 12px; border: 2px solid #CBD5E1; cursor: pointer; transition: all 0.3s ease;>                            Or Monthly: $27 P/M                        /button>                                                !-- Fallback checkout link -->                        div styletext-align: center; margin-top: 8px;>                            a hrefhttps://ezistack.onfastspring.com/ target_blank  stylecolor: #64748B; font-size: 13px; text-decoration: underline; font-weight: 500;>                                Checkout not loading? Use direct link →                            /a>                        /div>                    /div>                /div>                !-- Pro Plan -->                div stylebackground: #FFFFFF; border-radius: 24px; padding: 40px; box-shadow: 0 25px 50px rgba(30, 64, 175, 0.18); border: 3px solid #F59E0B; position: relative; overflow: visible; transform: scale(1.02); classpro-plan>                    !-- Most Popular Badge -->                    div styleposition: absolute; top: -20px; left: 50%; transform: translateX(-50%); background: linear-gradient(135deg, #F59E0B 0%, #D97706 100%); color: white; padding: 10px 32px; border-radius: 24px; font-weight: 700; font-size: 13px; letter-spacing: 0.5px; box-shadow: 0 6px 20px rgba(245, 158, 11, 0.4); z-index: 10; white-space: nowrap;>                        ⭐ MOST POPULAR ⭐                    /div>                                        div stylemargin-top: 20px; text-align: center;>                        div styledisplay: inline-flex; align-items: center; gap: 8px; background: linear-gradient(135deg, #1E40AF 0%, #3B82F6 100%); color: white; padding: 8px 16px; border-radius: 20px; font-weight: 600; font-size: 12px; letter-spacing: 0.3px; margin-bottom: 20px;>                            💎 Maximum Power & Flexibility                        /div>                                                h3 stylefont-family: Poppins, sans-serif; font-size: 36px; font-weight: 900; color: #1F2937; margin: 0 0 12px 0;>Pro/h3>                        p stylecolor: #64748B; font-size: 16px; margin: 0 0 24px 0;>Serious credit capacity for ambitious builders/p>                                                div styledisplay: flex; align-items: baseline; justify-content: center; gap: 8px; margin: 0 0 24px 0;>                            span stylefont-family: Poppins, sans-serif; font-size: 64px; font-weight: 900; color: #1E40AF; line-height: 1;>$447/span>                            span stylefont-size: 18px; color: #64748B; font-weight: 600;>/ 12 months/span>                        /div>                                                div stylebackground: linear-gradient(135deg, #EBF8FF 0%, #DBEAFE 100%); border: 2px solid #3B82F6; padding: 20px; border-radius: 12px; text-align: center; margin-bottom: 20px;>                            span stylefont-size: 42px; font-weight: 900; color: #1E40AF; display: block;>1,000/span>                            span stylefont-size: 14px; color: #1E40AF; font-weight: 600;>Builder Credits/span>                        /div>                                                !-- Monthly Allowance Badges - Enhanced for Pro -->                        div styledisplay: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 28px;>                            div stylebackground: #F59E0B; padding: 12px 8px; border-radius: 12px; box-shadow: 0 4px 12px rgba(245, 158, 11, 0.4); display: flex; flex-direction: column; align-items: center; justify-content: center;>                                div stylefont-size: 28px; font-weight: 800; color: #FFFFFF; line-height: 1;>60/div>                                div styletext-align: center; margin-top: 4px;>                                    div stylefont-size: 12px; color: #FFFFFF; font-weight: 700; line-height: 1.2;>Blogs FREE/div>                                    div stylefont-size: 9px; color: rgba(255,255,255,0.95); font-weight: 600; line-height: 1.2; margin-top: 2px;>Per Month/div>                                /div>                            /div>                            div stylebackground: #10B981; padding: 12px 8px; border-radius: 12px; box-shadow: 0 4px 12px rgba(16, 185, 129, 0.4); display: flex; flex-direction: column; align-items: center; justify-content: center;>                                div stylefont-size: 28px; font-weight: 800; color: #FFFFFF; line-height: 1;>60/div>                                div styletext-align: center; margin-top: 4px;>                                    div stylefont-size: 12px; color: #FFFFFF; font-weight: 700; line-height: 1.2;>Pages FREE/div>                                    div stylefont-size: 9px; color: rgba(255,255,255,0.95); font-weight: 600; line-height: 1.2; margin-top: 2px;>Per Month/div>                                /div>                            /div>                            div stylebackground: #8B5CF6; padding: 12px 8px; border-radius: 12px; box-shadow: 0 4px 12px rgba(139, 92, 246, 0.4); display: flex; flex-direction: column; align-items: center; justify-content: center;>                                div stylefont-size: 28px; font-weight: 800; color: #FFFFFF; line-height: 1;>60/div>                                div styletext-align: center; margin-top: 4px;>                                    div stylefont-size: 12px; color: #FFFFFF; font-weight: 700; line-height: 1.2;>Posts FREE/div>                                    div stylefont-size: 9px; color: rgba(255,255,255,0.95); font-weight: 600; line-height: 1.2; margin-top: 2px;>Per Month/div>                                /div>                            /div>                        /div>                    /div>                    ul stylelist-style: none; padding: 0; margin: 0 0 32px 0; display: grid; gap: 12px; text-align: left;>                        li styledisplay: flex; align-items: center; gap: 12px;>                            span stylewidth: 24px; height: 24px; background: #10B981; color: #fff; font-weight: 800; font-size: 14px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;>✓/span>                            span stylefont-weight: 600; color: #1F2937; font-size: 15px;>All features, templates & Cloud Deployment/span>                        /li>                        li styledisplay: flex; align-items: center; gap: 12px;>                            span stylewidth: 24px; height: 24px; background: #10B981; color: #fff; font-weight: 800; font-size: 14px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;>✓/span>                            span stylefont-weight: 600; color: #1F2937; font-size: 15px;>Priority support & training/span>                        /li>                        li styledisplay: flex; align-items: center; gap: 12px;>                            span stylewidth: 24px; height: 24px; background: #10B981; color: #fff; font-weight: 800; font-size: 14px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;>✓/span>                            span stylefont-weight: 600; color: #1F2937; font-size: 15px;>WordPress integration & FTP Publishing/span>                        /li>                        li styledisplay: flex; align-items: center; gap: 12px;>                            span stylewidth: 24px; height: 24px; background: #10B981; color: #fff; font-weight: 800; font-size: 14px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0;>✓/span>                            span stylefont-weight: 600; color: #1F2937; font-size: 15px;>17 premium templates + custom builder/span>                        /li>                    /ul>                    div styledisplay: flex; flex-direction: column; gap: 12px;>                        button classbtn-checkout data-checkoutstandard data-itemezistack-pro-annual stylewidth: 100%; background: #1E40AF; color: #fff; font-family: Poppins, sans-serif; font-weight: 700; font-size: 17px; padding: 18px 24px; border-radius: 12px; border: none; cursor: pointer; box-shadow: 0 8px 20px rgba(30, 64, 175, 0.25); transition: all 0.3s ease;>                            Get Pro — Maximum Power                        /button>                        button classbtn-checkout data-checkoutsplit data-itemezistack-pro-split stylewidth: 100%; background: #FFFFFF; color: #1E40AF; font-weight: 600; font-size: 14px; padding: 14px 20px; border-radius: 12px; border: 2px solid #1E40AF; cursor: pointer; transition: all 0.3s ease;>                            Or Split Pay: 3 × $165                        /button>                        button classbtn-checkout data-checkoutsplit data-itemezistack-pro-monthly stylewidth: 100%; background: #FFFFFF; color: #1E40AF; font-weight: 600; font-size: 14px; padding: 14px 20px; border-radius: 12px; border: 2px solid #1E40AF; cursor: pointer; transition: all 0.3s ease;>                            Or Monthly: $47 P/M                        /button>                                                !-- Fallback checkout link -->                        div styletext-align: center; margin-top: 8px;>                            a hrefhttps://ezistack.onfastspring.com/ target_blank stylecolor: #64748B; font-size: 13px; text-decoration: underline; font-weight: 500;>                                Checkout not loading? Use direct link →                            /a>                        /div>                    /div>                /div>            /div>        /div>        !-- License Terms Note -->        div stylemax-width: 800px; margin: 0 auto 48px auto;>            div stylebackground: #FFFFFF; padding: 28px 32px; border-radius: 16px; border: 2px solid #E2E8F0; text-align: center; box-shadow: 0 4px 12px rgba(0,0,0,0.05);>                p stylefont-size: 16px; color: #475569; margin: 0; line-height: 1.8; font-weight: 500;>                    strong stylecolor: #1F2937; font-weight: 700; font-size: 17px;>12-Month License with Opt-In Renewal:/strong> Well email you strong stylecolor: #1F2937; background: #FEF3C7; padding: 2px 6px; border-radius: 4px;>30 days/strong> and strong stylecolor: #1F2937; background: #FEF3C7; padding: 2px 6px; border-radius: 4px;>7 days/strong> before your term ends to offer renewal at your current rate — totally your choice. No automatic rebills.                /p>            /div>        /div>        !-- Trust Badges -->        div styledisplay: flex; justify-content: center; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 64px;>            div styledisplay: flex; align-items: center; gap: 10px; background: linear-gradient(135deg, #DBEAFE 0%, #EFF6FF 100%); padding: 12px 18px; border-radius: 50px; box-shadow: 0 4px 12px rgba(30, 64, 175, 0.1); border: 1px solid #3B82F6;>                span stylefont-size: 18px;>🔒/span>                span stylefont-weight: 600; color: #1E40AF; font-size: 14px;>Secure Payment/span>            /div>            div styledisplay: flex; align-items: center; gap: 10px; background: linear-gradient(135deg, #DBEAFE 0%, #EFF6FF 100%); padding: 12px 18px; border-radius: 50px; box-shadow: 0 4px 12px rgba(30, 64, 175, 0.1); border: 1px solid #3B82F6;>                span stylefont-size: 18px;>⚡/span>                span stylefont-weight: 600; color: #1E40AF; font-size: 14px;>Instant Access/span>            /div>            div styledisplay: flex; align-items: center; gap: 10px; background: linear-gradient(135deg, #DBEAFE 0%, #EFF6FF 100%); padding: 12px 18px; border-radius: 50px; box-shadow: 0 4px 12px rgba(30, 64, 175, 0.1); border: 1px solid #3B82F6;>                span stylefont-size: 18px;>↩️/span>                span stylefont-weight: 600; color: #1E40AF; font-size: 14px;>30-Day Guarantee/span>            /div>            div styledisplay: flex; align-items: center; gap: 10px; background: linear-gradient(135deg, #DBEAFE 0%, #EFF6FF 100%); padding: 12px 18px; border-radius: 50px; box-shadow: 0 4px 12px rgba(30, 64, 175, 0.1); border: 1px solid #3B82F6;>                span stylefont-size: 18px;>🔑/span>                span stylefont-weight: 600; color: #1E40AF; font-size: 14px;>Bring Your Own Keys/span>            /div>        /div>        !-- How Credits Work -->        div styletext-align: center; margin-bottom: 48px;>            h3 stylefont-family: Poppins, sans-serif; font-size: 32px; font-weight: 700; color: #1E40AF; margin: 0 0 16px 0;>                How Builder Credits Work            /h3>            p stylefont-size: 18px; color: #64748B; margin: 0 0 48px 0; font-weight: 500;>                Simple, flexible, and designed for scale            /p>            div styledisplay: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 24px; max-width: 1000px; margin: 0 auto 48px auto;>                div stylebackground: #FFFFFF; border-radius: 16px; padding: 24px; box-shadow: 0 8px 20px rgba(30, 64, 175, 0.08); border: 1px solid #E2E8F0;>                    div stylefont-family: Poppins, sans-serif; font-size: 20px; font-weight: 700; color: #1E40AF; margin-bottom: 12px;>                        1 Full Post  1 Credit                    /div>                    p stylefont-size: 15px; color: #64748B; margin: 0; line-height: 1.6;>                        SEO-optimized blog post with keyword research, schema, video embeds, and multiple in-content images — all personalized to your brands voice.                    /p>                /div>                                div stylebackground: #FFFFFF; border-radius: 16px; padding: 24px; box-shadow: 0 8px 20px rgba(30, 64, 175, 0.08); border: 1px solid #E2E8F0;>                    div stylefont-family: Poppins, sans-serif; font-size: 20px; font-weight: 700; color: #1E40AF; margin-bottom: 12px;>                        1 Page  2 Credits                    /div>                    p stylefont-size: 15px; color: #64748B; margin: 0; line-height: 1.6;>                        Custom page built with AI content, multiple visuals, and your branding. Choose from professionally designed templates — or import your own.                    /p>                /div>                                div stylebackground: #FFFFFF; border-radius: 16px; padding: 24px; box-shadow: 0 8px 20px rgba(30, 64, 175, 0.08); border: 1px solid #E2E8F0;>                    div stylefont-family: Poppins, sans-serif; font-size: 20px; font-weight: 700; color: #1E40AF; margin-bottom: 12px;>                        1 Complete Site  10 Credits                    /div>                    p stylefont-size: 15px; color: #64748B; margin: 0; line-height: 1.6;>                        End-to-end website creation: keyword strategy, content clustering, business details, branding kit, kick-off posts for each category plus a full year of scheduled blog content.                    /p>                /div>            /div>            !-- Credits Usage Examples -->            div stylebackground: linear-gradient(135deg, #1E40AF 0%, #3B82F6 100%); border-radius: 20px; padding: 32px; margin-bottom: 48px; color: white;>                div stylefont-family: Poppins, sans-serif; font-size: 24px; font-weight: 700; margin-bottom: 32px;>                    What You Can Build With Your Credits                /div>                                div stylemax-width: 900px; margin: 0 auto;>                    !-- Growth Plan Examples -->                    div stylemargin-bottom: 24px;>                        div stylefont-size: 16px; font-weight: 600; margin-bottom: 16px; opacity: 0.9;>Growth Plan (400 Credits):/div>                        div styledisplay: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px;>                            div stylebackground: rgba(255,255,255,0.15); border-radius: 12px; padding: 16px; text-align: center; backdrop-filter: blur(10px);>                                div stylefont-weight: 700; font-size: 20px; margin-bottom: 4px;>40/div>                                div stylefont-size: 14px; opacity: 0.9;>Complete Sites/div>                            /div>                            div stylebackground: rgba(255,255,255,0.15); border-radius: 12px; padding: 16px; text-align: center; backdrop-filter: blur(10px);>                                div stylefont-weight: 700; font-size: 20px; margin-bottom: 4px;>400/div>                                div stylefont-size: 14px; opacity: 0.9;>Blog Posts/div>                            /div>                            div stylebackground: rgba(255,255,255,0.15); border-radius: 12px; padding: 16px; text-align: center; backdrop-filter: blur(10px);>                                div stylefont-weight: 700; font-size: 20px; margin-bottom: 4px;>Mix/div>                                div stylefont-size: 14px; opacity: 0.9;>20 Sites + 200 Posts/div>                            /div>                        /div>                    /div>                                        !-- Pro Plan Examples -->                    div>                        div stylefont-size: 16px; font-weight: 600; margin-bottom: 16px; opacity: 0.9;>Pro Plan (1,000 Credits):/div>                        div styledisplay: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px;>                            div stylebackground: rgba(255,255,255,0.2); border-radius: 12px; padding: 16px; text-align: center; backdrop-filter: blur(10px); border: 2px solid rgba(255,255,255,0.3);>                                div stylefont-weight: 700; font-size: 20px; margin-bottom: 4px;>100/div>                                div stylefont-size: 14px;>Complete Sites/div>                            /div>                            div stylebackground: rgba(255,255,255,0.2); border-radius: 12px; padding: 16px; text-align: center; backdrop-filter: blur(10px); border: 2px solid rgba(255,255,255,0.3);>                                div stylefont-weight: 700; font-size: 20px; margin-bottom: 4px;>1,000/div>                                div stylefont-size: 14px;>Blog Posts/div>                            /div>                            div stylebackground: rgba(255,255,255,0.2); border-radius: 12px; padding: 16px; text-align: center; backdrop-filter: blur(10px); border: 2px solid rgba(255,255,255,0.3);>                                div stylefont-weight: 700; font-size: 20px; margin-bottom: 4px;>Mix/div>                                div stylefont-size: 14px;>50 Sites + 500 Posts/div>                            /div>                        /div>                    /div>                /div>            /div>						  !-- Daily Allowance Explainer -->        div stylemax-width: 900px; margin: 0 auto 48px auto;>            div stylebackground: linear-gradient(135deg, #10B981 0%, #059669 100%); padding: 36px 40px; border-radius: 20px; color: white; box-shadow: 0 20px 40px rgba(16, 185, 129, 0.2);>                div styletext-align: center; margin-bottom: 28px;>                    div stylefont-size: 36px; margin-bottom: 12px;>🎁/div>                    h3 stylefont-family: Poppins, sans-serif; font-size: 28px; font-weight: 800; color: #FFFFFF; margin: 0 0 12px 0;>Build Every Day Without Using Credits/h3>                    p stylecolor: rgba(255,255,255,0.9); margin: 0; font-weight: 500;>Your daily allowance lets you create content credit-free — perfect for consistent growth/p>                /div>                                div styledisplay: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 28px;>                    div stylebackground: rgba(255,255,255,0.15); backdrop-filter: blur(10px); padding: 24px; border-radius: 16px; border: 2px solid rgba(255,255,255,0.2);>                        div stylefont-size: 16px; font-weight: 700; margin-bottom: 12px; opacity: 0.95;>Growth Example:/div>                        div styleline-height: 1.7; opacity: 0.9;>                            Create strong stylecolor: #FEF3C7;>1 blog + 1 page + 1 post daily/strong> for 30 days straight  strong stylecolor: #FEF3C7;>Zero credits used/strong>. Build your empire consistently without touching your 400-credit reserve.                        /div>                    /div>                                        div stylebackground: rgba(255,255,255,0.2); backdrop-filter: blur(10px); padding: 24px; border-radius: 16px; border: 2px solid rgba(255,255,255,0.3);>                        div stylefont-size: 16px; font-weight: 700; margin-bottom: 12px;>Pro Example:/div>                        div styleline-height: 1.7;>                            Create strong stylecolor: #FEF3C7;>2 blogs + 2 pages + 2 posts daily/strong> for 30 days  strong stylecolor: #FEF3C7;>Still zero credits/strong>. Double the daily output, perfect for scaling your portfolio fast.                        /div>                    /div>                /div>                                div stylebackground: rgba(255,255,255,0.1); backdrop-filter: blur(10px); padding: 20px; border-radius: 12px; border: 2px solid rgba(255,255,255,0.15); text-align: center;>                    div stylefont-weight: 600; margin-bottom: 8px; opacity: 0.95;>💡 How It Works:/div>                    div styleline-height: 1.7; opacity: 0.9;>                        Your allowance refreshes daily. Create 5 blogs today? First 1-2 are FREE (depending on your plan), then credits cover the rest. This means you can build consistently every single day without worrying about burning through your credit reserve.                    /div>                /div>            /div>        /div>            !-- Why It Works -->            div stylebackground: linear-gradient(135deg, #FFFFFF 0%, #F8FAFC 100%); border-radius: 20px; padding: 40px; max-width: 900px; margin: 0 auto; border: 2px solid #1E40AF; box-shadow: 0 20px 40px rgba(30, 64, 175, 0.1);>                h4 stylefont-family: Poppins, sans-serif; font-size: 28px; font-weight: 700; color: #1E40AF; margin: 0 0 24px 0; text-align: center; display: flex; align-items: center; justify-content: center; gap: 12px;>                    span stylefont-size: 32px;>🚀/span>                    One Price. Everything Included.                /h4>                div styletext-align: left; color: #1F2937; line-height: 1.7; font-size: 16px;>                    p stylemargin: 0 0 20px 0;>                        Forget paying bloated hosting fees, endless plugin subscriptions, and expensive freelancers.                    /p>                    p stylemargin: 0 0 20px 0;>                        With EziStack, you lock in one predictable 12-month price — less than most pay for just hosting — and unlock the entire site-building system, training, premium templates, community, and enough credits to launch a serious portfolio of traffic assets.                    /p>                    p styletext-align: center; font-size: 18px; color: #1E40AF; font-weight: 700; margin: 0; padding-top: 16px;>                        Ready to scale your traffic empire with zero WordPress headaches?br>                        span stylecolor: #3B82F6;>Choose your plan and start building today./span>                    /p>                /div>            /div>                        !-- Fair Usage Policy -->            div stylemax-width: 800px; margin: 64px auto 0 auto;>                div stylebackground: #FFFFFF; padding: 28px 32px; border-radius: 16px; border: 2px solid #E2E8F0; text-align: center; box-shadow: 0 4px 12px rgba(0,0,0,0.05);>                    div stylefont-size: 32px; margin-bottom: 12px;>⚖️/div>                    h3 stylefont-family: Poppins, sans-serif; font-size: 20px; font-weight: 700; color: #1E40AF; margin: 0 0 12px 0;>Fair Usage Policy/h3>                    p stylefont-size: 15px; color: #64748B; margin: 0; line-height: 1.7;>                        EziStack works on a fair-use policy — designed so you can build freely without worrying about hidden limits. Create, edit, and sync as much as you like. Credits are only consumed when you generate new sites, posts, or pages. Simple. Transparent. Fair.                    /p>                /div>            /div>        /div>          /div>/section>                                 style>    @media (min-width: 768px) {        .plans-container {            grid-template-columns: 0.9fr 1.1fr !important;        }        .pro-plan {            order: 2 !important;            transform: scale(1.05) !important;        }        .growth-plan {            order: 1 !important;            transform: scale(1) !important;        }    }        @media (max-width: 767px) {        .pro-plan {            order: 1 !important;        }        .growth-plan {            order: 2 !important;        }    }        button:hover {        transform: translateY(-2px) !important;        box-shadow: 0 12px 30px rgba(30, 64, 175, 0.3) !important;    }        button:active {        transform: translateY(0) !important;    }/style>!-- Distinctive Guarantee Section -->section classdistinctive-guarantee-section>    div classguarantee-container>                !-- Header -->        div classguarantee-header data-aosfade-up>            div classguarantee-badge>                🛡️ 100% RISK-FREE GUARANTEE            /div>            h2 classguarantee-title>                Try EziStack With Complete Confidence            /h2>            p classguarantee-subtitle>                Youve seen what EziStack can do. Now experience it with zero pressure.            /p>        /div>        !-- Promise Cards -->        div classguarantee-promises data-aosfade-up data-aos-delay200>            div classpromise-list>                                !-- 30-Day Guarantee -->                div classpromise-item>                    div classpromise-icon-container>                        i classph-fill ph-shield-check promise-icon>/i>                    /div>                   p>strong>30-Day, No-Hassle Guarantee./strong> Try EziStack for 30 days with complete peace of mind. Build up to two full sites, create a page, and publish a few posts, and keep everything you make. If it isn’t a fit, we’ll refund your payment within 30 days, no hassle./p>                /div>                !-- No Hidden Costs -->                div classpromise-item>                    div classpromise-icon-container>                        i classph-fill ph-currency-dollar promise-icon>/i>                    /div>                    p classpromise-text>                        strong>No markups, no metering, no middlemen./strong> AI and image costs are paid directly to the providers you choose. EziStack takes zero cut—ever.                    /p>                /div>                !-- You Own Everything -->                div classpromise-item>                    div classpromise-icon-container>                        i classph-fill ph-cloud-check promise-icon>/i>                    /div>                    p classpromise-text>                        strong>Your sites are yours./strong> Theyre deployed to your cloud. If we vanished tomorrow, your sites stay live.                    /p>                /div>            /div>        /div>        !-- Fair Use Notice -->        div classfair-use-notice data-aosfade-up data-aos-delay300>            div classfair-use-content>                div classfair-use-icon>⚖️/div>                h4 classfair-use-title>Fair Trial Policy/h4>                p classfair-use-text>                      Our 30-day guarantee is designed to give you plenty of room to explore EziStack risk-free. You can create up tospan classfair-use-highlight> strong>25 credits worth of content/strong>/span> during your trial — that’s enough for two complete sites, plus a page and several posts. - this keeps our guarantee sustainable for everyone.                /p>            /div>        /div>		   !-- Secondary CTA -->		                     button onclicksmoothScrollToGetStarted() styledisplay: block; width: 80%; background: linear-gradient(135deg, #FFFFFF 0%, #F8FAFC 100%); color: #1E40AF; font-family: Poppins, sans-serif; font-weight: 700; font-size: 18px; padding: 18px 32px; border-radius: 50px; text-align: center; border: 2px solid #1E40AF; cursor: pointer; transition: all 0.3s ease; margin: 2rem auto; >                    Try Risk-Free for 30 Days                /button>				    /div>/section>section  style    font-family:Poppins, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;    padding:64px 36px;    background:linear-gradient(133deg, #1E40AF 0%, #3B82F6 100%);    color:#fff;    box-shadow:0 2px 32px rgba(0,30,84,0.13);    position:relative;    overflow:hidden;  >  div stylemax-width:1200px; margin:0 auto;>    div style      display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:44px;    >      div styleflex:1 1 540px; min-width:270px;>        h2 style          margin:0 0 22px 0;          font-weight:900;          font-size:2.8rem;          line-height:1.13;          letter-spacing:-0.019em;          text-shadow:0 4px 24px rgba(30,64,175,0.13), 0 1px 1px rgba(0,0,0,0.06);          position:relative;          display:inline-block;        >          span stylebackground:linear-gradient(88deg,#fff 80%,#F59E0B 95%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;>            Still curious? See EziStack in action.          /span>          span style            width:60px; height:5px; display:block; border-radius:8px;            background:linear-gradient(90deg,#F59E0B 25%,transparent 100%);            margin-top:14px;            animation:slide-accent 2s infinite alternate;          >/span>        /h2>        p style          margin:0; margin-bottom:0;          font-size:1.18rem;          line-height:1.7;          font-weight:500;          opacity:0.97;        >          Visit the          strong stylecolor:#fff; font-weight:700;>EziStack Hub/strong>          — a guided walkthrough with          strong stylecolor:#F59E0B; font-weight:700;>8 demo videos/strong>          showing everything from building and editing sites to SEO features and more.          It’s the full system, step by step, with          strong stylecolor:#fff; font-weight:700;>360+ real comments/strong>          from users.        /p>      /div>      div style        display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-top:10px;      >        a          hrefhttps://abbasravji.com/traffic-assets.html          target_blank relnoopener          style            display:inline-flex; align-items:center; gap:12px;            text-decoration:none;            background:linear-gradient(90deg,#F59E0B 80%,#ffd873 100%);            color:#1F2937;            padding:16px 28px;            border-radius:16px;            font-weight:900;            letter-spacing:-0.009em;            font-size:1.15rem;            box-shadow:0 7px 30px 0 rgba(245,158,11,0.22), 0 1.5px 19px 0 rgba(30,64,175,0.09);            border:none;            cursor:pointer;            transition:transform .16s, box-shadow .17s,background .21s;            will-change:transform;            position:relative;            z-index:1;            outline:none;                    aria-labelOpen the EziStack Hub          onmouseoverthis.style.transformtranslateY(-2px) scale(1.03);this.style.boxShadow0 20px 54px 0 rgba(245,158,11,0.33);          onmouseoutthis.style.transform;this.style.boxShadow0 7px 30px 0 rgba(245,158,11,0.22), 0 1.5px 19px 0 rgba(30,64,175,0.09);        >          Open the EziStack Hub          svg width20 height20 viewBox0 0 24 24 fillnone aria-hiddentrue styleflex-shrink:0;>            path dM7 17L17 7M17 7H9M17 7v8              stroke#1F2937              stroke-width1.9              stroke-linecapround              stroke-linejoinround            />          /svg>        /a>        span          style            display:inline-flex; align-items:center; gap:7px;            padding:13px 18px; border-radius:12px;            background:rgba(255,255,255,0.13);            color:#fff; font-weight:700; font-size:1.03rem;            border:1.5px solid rgba(255,255,255,0.22);            box-shadow:0 6px 24px rgba(59,130,246,0.11);            backdrop-filter:blur(4px);            letter-spacing:-0.01em;                  >          svg width18 height18 viewBox0 0 24 24 fillnone aria-hiddentrue styleflex-shrink:0;>            path dM21 12a7 7 0 0 1-7 7H7l-4 4V7a7 7 0 0 1 7-7h4a7 7 0 0 1 7 7z              stroke#fff              stroke-width1.7              stroke-linecapround              stroke-linejoinround            />          /svg>          360+ comments        /span>      /div>    /div>  /div>  style>    @keyframes slide-accent {      from { opacity: 0.6; transform: scaleX(0.64); }      to   { opacity: 1;   transform: scaleX(1.08);}    }  /style>/section>section idfaq classfont-Inter text-#1F2937 bg-#F8FAFC py-10 sm:py-10>  div classmax-w-4xl mx-auto px-4 sm:px-6 lg:px-8>        div classtext-center mb-12>      h2 classfont-Poppins text-3xl font-extrabold sm:text-4xl lg:text-5xl text-#1F2937>        Frequently Asked Questions      /h2>      p classmt-4 text-lg text-#64748B>        Everything you need to know before getting started.      /p>    /div>    div classspace-y-3>            details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-coins text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>How are AI costs handled? Do you mark anything up?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>You connect your own keys (OpenAI, Claude, Gemini, Perplexity, OpenRouter, Fal AI, etc.). You pay providers directly at their published rates. EziStack does not meter, markup, or skim—zero platform tax. You can set provider-side budgets and caps for total control./p>        /div>      /details>            details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-package text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>What exactly is included with the Pro & Growth plans?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed space-y-2>         p>strong>Pro Plan:/strong> You get strong>1,000 Builder Credits./p>p>Typical usage:/p>ul classspace-y-1>  li>10 credits  a full site build (keyword research, full personalization, logo, categories, initial published posts, a year’s schedule, deploy)./li>  li>2 credits  a new page (home, landing, funnel, webinar, service, etc.)./li>  li>1 credit  a new post (researched, written, featured image, optional in-content images)./li>/ul>p>Credits are only consumed when a generation succeeds (except during your first 30 days on the Founder Plan, where eligible usage doesn’t consume credits)./p>!-- Growth Plan -->p>strong>Growth Plan:/strong> You get strong>400 Builder Credits/strong>./p>p>Typical usage:/p>ul classspace-y-1>  li>10 credits  a full site build (keyword research, full personalization, logo, categories, initial published posts, a year’s schedule, deploy)./li>  li>2 credits  a new page (home, landing, funnel, webinar, service, etc.)./li>  li>1 credit  a new post (researched, written, featured image, optional in-content images)./li>/ul>p>Credits are only consumed when a generation succeeds./p>        /div>      /details>      details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-shuffle-angular text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>Can I mix credits any way I like?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>Yes. Example: 50 sites (50×10500) + 500 posts (500×1500)  1,000 credits. Your workflow, your mix./p>        /div>      /details>      details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-timer text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>Do credits expire?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>Credits included with your plan are valid for strong>2 years/strong> and require an active license. Renew your plan to keep unused credits rolling forward. You can also purchase top-ups at any time./p>        /div>      /details>  !-- What exactly uses credits -->details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>  summary classflex cursor-pointer list-none items-center justify-between gap-4>    div classflex items-center gap-4>      i classph-bold ph-coins text-2xl text-#3B82F6>/i>      h3 classtext-lg font-semibold text-#1F2937>What exactly uses credits?/h3>    /div>    div classtext-#1E40AF>      i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>      i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>    /div>  /summary>  div classfaq-answer mt-4 text-#64748B leading-relaxed>    p>Credits are used for the following actions:/p>    ul classlist-disc list-inside space-y-1 mt-2>      li>Complete Site Build  10 credits/li>      li>Page creation  2 credits/li>      li>Post creation  1 credit/li>      li>Auto Update content  1 credit for 3 auto updates/li>    /ul>    p classmt-2>Credits are only consumed when an action has been successfully completed./p>  /div>/details>!-- What does Bring Your Own Keys mean -->details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>  summary classflex cursor-pointer list-none items-center justify-between gap-4>    div classflex items-center gap-4>     !-- i classph-bold ph-key text-2xl text-#3B82F6>/i>-->	 span stylefont-size: 18px;>🔑/span>      h3 classtext-lg font-semibold text-#1F2937>What does Bring Your Own Keys mean?/h3>    /div>    div classtext-#1E40AF>      i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>      i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>    /div>  /summary>  div classfaq-answer mt-4 text-#64748B leading-relaxed>    p>EziStack creates and deploys sites on your own hosting or cloud accounts. To use cloud platforms, you’ll need to bring your own Cloud keys./p>    p classmt-2>For AI-generated content and images, you’ll also need to bring your own API keys. We recommend:/p>    ul classlist-disc list-inside space-y-1 mt-2>      li>strong>OpenRouter/strong> for content (access to all popular models)./li>      li>strong>Fal AI/strong> for images (single signup, broad access)./li>    /ul>  /div>/details>!-- How much does it cost to generate content and images using AI -->details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>  summary classflex cursor-pointer list-none items-center justify-between gap-4>    div classflex items-center gap-4>      i classph-bold ph-shopping-cart text-2xl text-#3B82F6>/i>      h3 classtext-lg font-semibold text-#1F2937>How much does it cost to generate content and images using AI?/h3>    /div>    div classtext-#1E40AF>      i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>      i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>    /div>  /summary>  div classfaq-answer mt-4 text-#64748B leading-relaxed>    p>You are billed directly by the AI provider—EziStack does not take a cut. Each model has its own pricing./p>    p classmt-2>We’ve created a video that explains the actual costs in detail: a hrefhttps://www.youtube.com/watch?vaLYodN1DtTU target_blank classtext-#3B82F6 underline>Watch here/a>./p>  /div>/details>!-- What are the typical ongoing costs I should expect? -->details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>  summary classflex cursor-pointer list-none items-center justify-between gap-4>    div classflex items-center gap-4>      i classph-bold ph-currency-circle-dollar text-2xl text-#3B82F6>/i>      h3 classtext-lg font-semibold text-#1F2937>What are the typical ongoing costs I should expect?/h3>    /div>    div classtext-#1E40AF>      i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>      i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>    /div>  /summary>  div classfaq-answer mt-4 text-#64748B leading-relaxed space-y-2>    p>We keep costs clean, transparent, and under your control. Here’s what most users see:/p>    ul classlist-disc list-inside space-y-1>      li>strong>Hosting:/strong> Usually free (most sites stay within free-tier limits). If you go over, it’s cents per year per site./li>      li>strong>SSL:/strong> Free via Cloudflare, CloudFront, or similar services./li>      li>strong>AI content:/strong> Just a few cents per full SEO article — including keyword research, SERP analysis, video embeds, visuals, and more./li>      li>strong>AI images:/strong> Around half a cent and up depending on the model./li>      li>strong>API keys:/strong> You bring your own (OpenAI, Claude, Gemini, etc.). No markups, no hidden charges./li>    /ul>    p>No surprises. Ever./p>  /div>/details>details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-timer text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>Do I have to subscribe?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>No. It’s a 12-month plan with opt-in renewal. We’ll remind you before it ends—renew only if you want to keep building./p>        /div>      /details>details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-timer text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>What happens when my plan ends?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>Your account stays open. You can still log in and export your work. Creating, editing, syncing, and using credits resume when you renew. /p>        /div>      /details>      details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-arrows-clockwise text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>How does Editing and Syncing work?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>Edit as much as you like, whenever you like. No extra charges for design tweaks or edits. Credits are only used for creating — never for customizing./p>        /div>      /details>            details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-magic-wand text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>How does the auto updating of content work?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>Keep your content fresh and rankings climbing. For just 1 credit, EziStack auto-updates a post up to 3 times — giving you that freshness boost search engines love./p>        /div>      /details>            details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-image text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>How Many Images can I add to Articles?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>Every post comes complete with research, content, SEO, featured image, and upto 5 in-content images (You can choose how many you want) . Need more visuals? Add 1 extra credit to unlock up to 15 AI-generated, fully optimized in-content images./p>        /div>      /details>      details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-globe-hemisphere-west text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>Does a subdomain count as a site?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>Yes. Each deployed site (domain or subdomain) counts as one site build because each is independently generated, personalized, and deployed./p>        /div>      /details>      details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-battery-warning text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>What happens when my credits run out?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>Your sites remain live. You can still edit manually, manage templates and tweak SEO. Add a credit top-up anytime for new builds and posts./p>        /div>      /details>      details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-plugs text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>Are my sites tied to EziStack? What if EziStack goes down?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>Your sites deploy to your cloud (S3, Google Cloud Storage, Azure, IBM, Backblaze, or FTP) and run independently. There’s no live dependency on our servers after sync./p>        /div>      /details>      details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-lock-laminated text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>How do custom domains and SSL work?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>Point DNS to your cloud endpoint (we recommend free Cloudflare). You’ll get free SSL via Cloudflare or your cloud provider’s certificate. We show you the simple steps./p>        /div>      /details>      details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-wordpress-logo text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>How does WordPress integration work?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>Install our site-specific plugin (auto-renamed for zero footprint). Then manage posts/pages, scheduling, updates, and AI content from one EziStack dashboard. Perfect for PBNs and multi-site ops./p>        /div>      /details>      details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-export text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>Can I export or move my sites later?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>Absolutely. Your sites are static files you own. Move them to any host/CDN, anytime./p>        /div>      /details>      details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-shield-check text-2xl text-#10B981>/i>            h3 classtext-lg font-semibold text-#1F2937>What about security?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>Static sites  no PHP, no database, no plugin exploits. Paired with Cloudflare/CDN, you get enterprise-grade resilience, speed, and uptime./p>        /div>      /details>      details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-translate text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>Does EziStack support multiple languages?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>You can generate content in most major languages (via your AI models). Template localization is LTR by default; we’ll expand localization options based on demand./p>        /div>      /details>      details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-shopping-cart text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>Do you support membership or e-commerce?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>Our focus at launch is traffic-ready blogs/pages. You can implement workable membership/checkout approaches with static-friendly patterns (and we’ve demoed prototypes). Native, fully streamlined modules are on the roadmap—we’ll ship them the right way./p>        /div>      /details>      details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-newspaper text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>Can I curate content automatically?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>Yes. Add feeds from your favorite sources, have AI rewrite in your voice, and publish into the categories you choose—on autopilot./p>        /div>      /details>            details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-camera text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>How are images handled (and what if I want zero AI image cost)?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed space-y-2>          p>Chose:/p>          ul>            li>Generate via your image provider (Fal, etc.)/li>            li>Use Auto Images (free, template-friendly)/li>            li>Upload your own./li>          /ul>          p>You can also set how many in-content images to generate per post (or none)./p>        /div>      /details>            details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-trend-up text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>Will EziStack help with SEO beyond “basic”?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>Yes—silos, schema templates, internal linking, freshness updates, curated topical signals, and more. Built for structure, speed, and long-term rankings./p>        /div>      /details>            details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-database text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>Can I back up sites?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>Yes. Automatic and on-demand backups keep your assets safe./p>        /div>      /details>            details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-briefcase text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>Agency use? Client projects?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>Yes—use EziStack for your own sites and client work. Grouping logic keeps portfolios organized. Team/VA access is on the roadmap./p>        /div>      /details>            details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-receipt text-2xl text-#10B981>/i>            h3 classtext-lg font-semibold text-#1F2937>What’s your refund policy, exactly?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed space-y-3>            p>We want you to test the platform properly — and keep what you build. During your first 30 days, you can use up to 25 credits and still be eligible for a full refund if it’s not a fit./p>            p>That’s enough to create about two complete sites (10 credits each), plus a page (2 credits) and several posts (1 credit each)./p>            p>If your usage stays at or under 25 credits within the 30-day window, you can request a refund and everything you created remains yours. Beyond 25 credits or after 30 days, refunds aren’t available because substantial value has already been delivered. The 25-credit threshold only affects refund eligibility during the guarantee period./p>            p>Refunds apply to first-time purchases and exclude renewals, add-ons, and prior refunds./p>               /div>      /details>            details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-magnifying-glass text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>Do you limit or meter my content in any hidden way?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>No. EziStack doesn’t meter words or take a slice of your AI costs. You’re connected directly to providers with your keys and your spend caps./p>        /div>      /details>            details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-stack text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>What if I already have active WordPress sites?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>Perfect. Keep them. Use EziStack to publish, update, schedule, and curate at speed from one dashboard—no more logging into 20+ installs daily./p>        /div>      /details>            details classgroup rounded-lg bg-#FFFFFF p-6 shadow-sm transition-all duration-300 hover:shadow-md>        summary classflex cursor-pointer list-none items-center justify-between gap-4>          div classflex items-center gap-4>            i classph-bold ph-rocket text-2xl text-#3B82F6>/i>            h3 classtext-lg font-semibold text-#1F2937>How fast and how cheap is hosting, really?/h3>          /div>          div classtext-#1E40AF>            i classph-bold ph-plus text-xl transition-transform duration-300 group-open:hidden>/i>            i classph-bold ph-minus hidden text-xl transition-transform duration-300 group-open:block>/i>          /div>        /summary>        div classfaq-answer mt-4 text-#64748B leading-relaxed>          p>Static hosting on S3/Cloudflare/Backblaze is pennies per month for dozens of sites, with global CDN speed and free SSL. It’s the modern way to host content sites./p>        /div>      /details>	  	          /div>       div classmt-16 bg-#FFFFFF border-l-4 border-#F59E0B rounded-r-lg p-8 shadow-lg>  h3 classfont-Poppins text-2xl font-extrabold text-#1E40AF flex items-center gap-3>    i classph-bold ph-rocket-launch text-3xl>/i>    The Bottom Line  /h3>  p classmt-4 text-#64748B leading-relaxed>    EziStack is the fastest way to deploy real, SEO-ready traffic assets—without WordPress pain, without hosting bloat, and without any mystery fees. You bring your API keys, your strategy, and your goals. We bring the system that builds, personalizes, optimizes, and deploys—at scale.  /p>  p classmt-4 font-semibold text-#1F2937>    When youre ready, choose your plan and start building your traffic empire today.  /p>/div>  /div>/section>button onclicksmoothScrollToGetStarted() styledisplay: block; width: 100%; max-width: 420px; background: var(--accent); color: white; font-family: "Poppins", sans-serif; font-weight: 700; font-size: 18px; padding: 18px 32px; border-radius: 50px; text-align: center; border: 2px solid rgb(30, 64, 175); cursor: pointer; transition: 0.3s; margin: 4rem auto 0px; transform: translateY(0px); box-shadow: rgba(30, 64, 175, 0.3) 0px 8px 24px; margin-bottom:20px;>Get Instant Access to EziStack/button>p classtext-center stylefont-size: 20px; color: #64748B; font-weight: 500; line-height: 1.6; margin-bottom: 30px;>             I still have some questions. Where can I send them to?/br>You can reach us at support@EziStack.com            /p>						div idfooterlinks>p classtext-center stylemargin-bottom:20px; Color:#0077dd; >span classstyle34 stylefont-family: Arial,Helvetica,sans-serif;>a hrefindex.html target_blank>Home/a> | a hrefcookiepolicy.html target_blank>CookiePolicy/a> | a hrefprivicypolicy.html target_blank>PrivacyPolicy/a> | a hreftermsofuse.html target_blank>Termsof Use/a>span classApple-converted-space> /span>|span classApple-converted-space> /span>a hrefrefundpolicy.html target_blank>RefundPolicy/a>span classApple-converted-space> /span>|span classApple-converted-space> /span>a hrefcontactus.html target_blank>ContactUs/a>/span>/p>p classtext-center >EziStack.com - ©Copyright 2025 - All rights reserved/p>/div>    !-- Scripts -->  !-- AOS (deferred so it doesnt block render) -->!-- script defer srchttps://unpkg.com/aos@2.3.1/dist/aos.js>/script> -->script>  // Cache node list once (lighter than querying every frame)  const shapes  document.querySelectorAll(.shape);  let ticking  false;  function updateParallax() {    const scrolled  window.pageYOffset || document.documentElement.scrollTop;    shapes.forEach((shape, index) > {      const speed  0.2 + (index * 0.1);      shape.style.transform  `translateY(${scrolled * speed}px)`;    });    ticking  false;  }  window.addEventListener(load, () > {    // Respect reduced-motion for parallax only    if (!window.matchMedia((prefers-reduced-motion: reduce)).matches) {      // Parallax: rAF + passive scroll for smoothness      if (shapes.length) {        window.addEventListener(scroll, () > {          if (!ticking) {            requestAnimationFrame(updateParallax);            ticking  true;          }        }, { passive: true });      }    }  });/script>script>//  Smooth Scroll let _scrollRaf  null;function smoothScrollToGetStarted(opts  {}) {  const target  document.querySelector(#get-started);  if (!target) return;  // Settings  const duration  Number(opts.duration ?? 1000); // ms (make larger to slow down)  const offset    Number(opts.offset ?? 0);      // px (use if you have a sticky header)  // Reduced motion: jump instantly  const prefersReduced  window.matchMedia && window.matchMedia((prefers-reduced-motion: reduce)).matches;  if (prefersReduced) {    const y  target.getBoundingClientRect().top + window.scrollY - offset;    window.scrollTo(0, y);    return;  }  // Cancel any in-flight scroll animation  if (_scrollRaf) {    cancelAnimationFrame(_scrollRaf);    _scrollRaf  null;  }  const startY    window.scrollY;  const targetY   target.getBoundingClientRect().top + startY - offset;  const distance  targetY - startY;  const startT    performance.now();  // Easing  function easeInOutQuad(t) { return t  0.5 ? 2*t*t : -1 + (4 - 2*t)*t; }  function step(now) {    const elapsed   now - startT;    const progress  Math.min(elapsed / duration, 1); // clamp 0..1    const eased     easeInOutQuad(progress);    window.scrollTo(0, startY + distance * eased);    if (progress  1) {      _scrollRaf  requestAnimationFrame(step);    } else {      _scrollRaf  null;    }  }  _scrollRaf  requestAnimationFrame(step);}//  Hover Effects for CTA Buttons document.addEventListener(DOMContentLoaded, function() {  const ctaButtons  document.querySelectorAll(buttononclicksmoothScrollToGetStarted());  ctaButtons.forEach((button) > {    const originalBg     button.style.background;    const originalColor  button.style.color;    button.addEventListener(mouseenter, function() {      this.style.transform   translateY(-2px);      this.style.boxShadow   0 12px 32px rgba(30, 64, 175, 0.4);      this.style.background  var(--primary);      this.style.color       white;    });    button.addEventListener(mouseleave, function() {      this.style.transform   translateY(0);      this.style.boxShadow   0 8px 24px rgba(30, 64, 175, 0.3);      this.style.background  originalBg;      this.style.color       originalColor;    });  });});/script>!--main video script-->script>    function loadMainVideo(wrapper) {        console.log(🎬 Loading main video...);                // Prevent multiple clicks        if (wrapper.classList.contains(loading)) {            console.log(Already loading, ignoring click);            return;        }        wrapper.classList.add(loading);                const loopOverlay  wrapper.querySelector(.loop-overlay);        const playOverlay  wrapper.querySelector(.play-overlay);        const ctaOverlay  wrapper.querySelector(.cta-overlay);        const youtubeIframe  wrapper.querySelector(.youtube-iframe);        const loopVideo  wrapper.querySelector(.loop-video);        const loadingIndicator  wrapper.querySelector(.loading-indicator);                // Show loading indicator        if (loadingIndicator) {            loadingIndicator.style.display  flex;        }                // Pause loop video immediately        if (loopVideo) {            loopVideo.pause();            loopVideo.currentTime  0;        }                // Load YouTube video        const videoSrc  youtubeIframe.getAttribute(data-src);        youtubeIframe.src  videoSrc;                // Wait for YouTube to start loading, then hide overlays        setTimeout(() > {            console.log(Hiding overlays and showing YouTube...);                        // Hide loading indicator            if (loadingIndicator) {                loadingIndicator.style.display  none;            }                        // Show YouTube iframe            youtubeIframe.style.opacity  1;            youtubeIframe.style.zIndex  30;                        // Hide all overlays            if (loopOverlay) {                loopOverlay.style.opacity  0;                loopOverlay.style.transform  scale(1.05);            }            if (playOverlay) {                playOverlay.style.opacity  0;            }            if (ctaOverlay) {                ctaOverlay.style.opacity  0;            }                        // Remove overlays completely after transition            setTimeout(() > {                if (loopOverlay) loopOverlay.style.display  none;                if (playOverlay) playOverlay.style.display  none;                if (ctaOverlay) ctaOverlay.style.display  none;                                console.log(✅ YouTube video should be playing now);            }, 500);                    }, 1000); // Give YouTube more time to load    }        // Mobile touch optimization    document.addEventListener(DOMContentLoaded, function() {        const videoWrappers  document.querySelectorAll(.video-wrapper);                videoWrappers.forEach(wrapper > {            // Handle both click and touch            wrapper.addEventListener(touchend, function(e) {                e.preventDefault();                e.stopPropagation();                loadMainVideo(this);            }, { passive: false });                        // Add hover effect for play button            const playButton  wrapper.querySelector(.play-button);            if (playButton) {                wrapper.addEventListener(mouseenter, () > {                    playButton.style.transform  scale(1.1);                });                wrapper.addEventListener(mouseleave, () > {                    playButton.style.transform  scale(1);                });            }        });                console.log(🚀 Video player initialized);    });/script>script>        // Global state management        let isLoading  false;        let loadAttempts  0;        const MAX_LOAD_ATTEMPTS  3;        // Global function for FastSpring callback        function onFSPopupClosed(payload) {            if (payload && payload.id) {                window.location.href  /upsell-dfy-kit.html?order +                     encodeURIComponent(payload.reference || payload.id);            }        }        window.onFSPopupClosed  onFSPopupClosed;        // Function to switch storefront        function switchStorefront(newStorefront) {            return new Promise((resolve) > {                const currentScript  document.getElementById(fsc-api);                const currentStorefront  currentScript.getAttribute(data-storefront);                                // If already on correct storefront, resolve immediately                if (currentStorefront  newStorefront) {                    resolve();                    return;                }                                // Remove current script and clear FastSpring                currentScript.remove();                delete window.fastspring;                                // Create new script with new storefront                const newScript  document.createElement(script);                newScript.id  fsc-api;                newScript.src  https://sbl.onfastspring.com/sbl/1.0.5/fastspring-builder.min.js;                newScript.type  text/javascript;                newScript.setAttribute(data-storefront, newStorefront);                newScript.setAttribute(data-popup-closed, onFSPopupClosed);                                // Wait for script to load                newScript.onload  () > {                    // Give FastSpring a moment to initialize                    setTimeout(() > {                        resolve();                    }, 100);                };                                document.head.appendChild(newScript);            });        }        // Handle checkout button clicks        document.addEventListener(click, async function(event) {            const btn  event.target.closest(.btn-checkout);            if (!btn) return;                        event.preventDefault();                        // Prevent multiple simultaneous requests            if (isLoading) {                console.log(Already processing a checkout request);                return;            }                        isLoading  true;            const checkoutType  btn.dataset.checkout;            const item  btn.dataset.item;                        // Show loading state            const originalText  btn.textContent;            btn.textContent  Loading...;            btn.disabled  true;                        try {                // Determine storefront                const storefront  checkoutType  split                     ? ezistack.onfastspring.com/popup-split                    : ezistack.onfastspring.com/popup-ezistack;                                // Switch storefront if needed                await switchStorefront(storefront);                                // Wait for FastSpring to be ready and launch checkout                const maxWait  50; // 5 seconds max                let attempts  0;                                const launchCheckout  () > {                    if (window.fastspring && window.fastspring.builder) {                        try {                            window.fastspring.builder.reset();                            window.fastspring.builder.add(item);                            window.fastspring.builder.checkout();                                                        // Reset button                            btn.textContent  originalText;                            btn.disabled  false;                            isLoading  false;                            loadAttempts  0; // Reset on success                            return true;                        } catch (error) {                            console.error(FastSpring checkout error:, error);                        }                    }                                        attempts++;                    if (attempts  maxWait) {                        setTimeout(launchCheckout, 100);                    } else {                        console.error(FastSpring failed to load after, attempts, attempts);                        loadAttempts++;                                                if (loadAttempts > MAX_LOAD_ATTEMPTS) {                            // Fallback to direct link after multiple failures                            const fallbackUrl  `https://${storefront}/products/${item}`;                            if (confirm(Checkout is having trouble loading. Open in new window?)) {                                window.open(fallbackUrl, _blank);                            }                        } else {                            btn.textContent  Try Again;                        }                                                btn.disabled  false;                        isLoading  false;                    }                    return false;                };                                launchCheckout();                            } catch (error) {                console.error(Checkout error:, error);                btn.textContent  Error - Try Again;                btn.disabled  false;                isLoading  false;            }        });    /script>!-- script> -->                !-- const deadline  new Date(2025-09-30T23:59:59-08:00).getTime(); -->        !-- function updateCountdown() { -->            !-- const now  new Date().getTime(); -->            !-- const distance  deadline - now; -->            !-- // Calculate time units -->            !-- const days  Math.floor(distance / (1000 * 60 * 60 * 24)); -->            !-- const hours  Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); -->            !-- const minutes  Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60)); -->            !-- const seconds  Math.floor((distance % (1000 * 60)) / 1000); -->            !-- // Format with leading zeros -->            !-- const format  (num) > num  10 ? 0 + num : num; -->            !-- if (distance > 0) { -->                !-- // Update main timer -->                !-- document.getElementById(days).textContent  format(days); -->                !-- document.getElementById(hours).textContent  format(hours); -->                !-- document.getElementById(minutes).textContent  format(minutes); -->                !-- document.getElementById(seconds).textContent  format(seconds); -->                !-- // Update compact timer -->                !-- document.getElementById(compactDays).textContent  format(days); -->                !-- document.getElementById(compactHours).textContent  format(hours); -->                !-- document.getElementById(compactMinutes).textContent  format(minutes); -->                !-- document.getElementById(compactSeconds).textContent  format(seconds); -->            !-- } else { -->                !-- // Timer expired - show zeros and expired message -->                !-- document.getElementById(days).textContent  00; -->                !-- document.getElementById(hours).textContent  00; -->                !-- document.getElementById(minutes).textContent  00; -->                !-- document.getElementById(seconds).textContent  00; -->                                !-- document.getElementById(compactDays).textContent  00; -->                !-- document.getElementById(compactHours).textContent  00; -->                !-- document.getElementById(compactMinutes).textContent  00; -->                !-- document.getElementById(compactSeconds).textContent  00; -->                                !-- document.getElementById(expiredMessage).style.display  block; -->                                !-- // Stop the interval -->                !-- clearInterval(countdownInterval); -->            !-- } -->        !-- } -->        !-- // Update immediately and then every second -->        !-- updateCountdown(); -->        !-- const countdownInterval  setInterval(updateCountdown, 1000); -->    !-- /script> -->/body>/html>

View on OTX | View on ThreatMiner

Data with thanks to AlienVault OTX, VirusTotal, Malwr and others. [Sitemap]

Domain > ezistack.com

Is this malicious?

DNS Resolutions

Port 80

Port 443