:root
{
	--bg:#1F1F29;
	--primary:#562dd4;
	--green:#009E45;
	--light:#FFFDB7;
	--text:#fff;
	--muted:#b7b7c8;
	--card:#2a2a38;
	--border:#ffffff14
}

.form-response{
    margin-top:12px;
    min-height:20px;
    color:var(--muted);
    font-size:.9rem;
    font-weight:700;
}

.form-response.is-success{
    color:#22c55e;
}

.form-response.is-error{
    color:#ef4444;
}

*
{
	margin:0;
	padding:0;
	box-sizing:border-box
}

html
{
	scroll-behavior:smooth
}

body
{
	font-family:'Inter',sans-serif;
	background:var(--bg);
	color:var(--text);
	line-height:1.6;
	overflow-x:hidden
}

a
{
	text-decoration:none;
	color:inherit
}

img
{
	max-width:100%
}

.container
{
	width:min(1180px,92%);
	margin:auto
}

section
{
	padding:70px 0
}

.badge
{
	display:inline-flex;
	align-items:center;
	gap:8px;
	padding:10px 18px;
	border-radius:999px;
	background:#562dd426;
	color:#d8ccff;
	font-size:.9rem;
	border:1px solid #562dd44d
}

.btn
{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:10px;
	padding:15px 24px;
	border-radius:16px;
	font-weight:700;
	transition:.25s ease;
	border:none;
	cursor:pointer
}

.btn-primary
{
	background:var(--primary);
	color:#fff;
	box-shadow:0 10px 25px #562dd459
}

.btn-primary:hover
{
	transform:translateY(-2px)
}

.btn-outline
{
	border:1px solid #ffffff1f;
	background:#ffffff0a
}

header
{
	position:sticky;
	top:0;
	z-index:1000;
	backdrop-filter:blur(14px);
	background:#1f1f29d9;
	border-bottom:1px solid var(--border)
}

.nav
{
	height:74px;
	display:flex;
	align-items:center;
	justify-content:space-between
}

.logo
{
	font-size:1.4rem;
	font-weight:800
}

.logo span
{
	color:var(--light)
}

.nav-links
{
	display:flex;
	gap:24px;
	font-size:.95rem;
	color:var(--muted)
}

.hero
{
	padding-top:80px
}

.hero-grid
{
	display:grid;
	grid-template-columns:1fr;
	gap:40px;
	align-items:center
}

.hero h1
{
	font-size:3rem;
	line-height:1.1;
	margin:20px 0
}

.hero h1 span
{
	color:var(--light)
}

.hero p
{
	color:var(--muted);
	font-size:1.08rem;
	max-width:640px
}

.hero-actions
{
	margin-top:28px;
	display:flex;
	flex-wrap:wrap;
	gap:16px
}

.app-card
{
	background:linear-gradient(180deg,#2f2f43,#252532);
	border:1px solid var(--border);
	border-radius:28px;
	padding:26px;
	box-shadow:0 20px 40px #00000040
}

.stats
{
	margin-top:24px;
	display:grid;
	grid-template-columns:repeat(2,1fr);
	gap:14px
}

.stat
{
	background:#ffffff08;
	border-radius:18px;
	padding:18px;
	border:1px solid var(--border)
}

.stat h3
{
	font-size:1.6rem;
	color:var(--light)
}

.section-title
{
	text-align:center;
	margin-bottom:18px;
	font-size:2.2rem
}

.section-sub
{
	text-align:center;
	color:var(--muted);
	max-width:700px;
	margin:0 auto 50px
}

.pricing
{
	display:grid;
	grid-template-columns:1fr;
	gap:24px
}

.card
{
	background:var(--card);
	border-radius:26px;
	padding:28px;
	border:1px solid var(--border);
	position:relative
}

.popular
{
	border:1px solid #fffdb766;
	transform:scale(1.02)
}

.popular-badge
{
	position:absolute;
	top:16px;
	right:16px;
	background:var(--light);
	color:#111;
	padding:8px 14px;
	border-radius:999px;
	font-size:.75rem;
	font-weight:800
}

.price
{
	font-size:3rem;
	font-weight:800;
	margin:18px 0
}

.card ul
{
	list-style:none;
	margin:20px 0
}

.card ul li
{
	margin-bottom:12px;
	color:var(--muted)
}

.features-grid
{
	display:grid;
	grid-template-columns:1fr;
	gap:20px
}

.feature
{
	background:var(--card);
	border-radius:24px;
	padding:24px;
	border:1px solid var(--border)
}

.feature h3
{
	margin:12px 0
}

.feature p
{
	color:var(--muted)
}

.compare
{
	overflow:auto
}

table
{
	width:100%;
	border-collapse:collapse;
	min-width:700px
}

table th,table td
{
	padding:18px;
	border-bottom:1px solid var(--border);
	text-align:left
}

table th
{
	color:var(--light)
}

.testimonials
{
	display:grid;
	grid-template-columns:1fr;
	gap:20px
}

.testimonial
{
	background:var(--card);
	border-radius:24px;
	padding:24px;
	border:1px solid var(--border)
}

.testimonial p
{
	color:var(--muted);
	margin-bottom:18px
}

.faq
{
	display:grid;
	gap:16px
}

.faq-item
{
	background:var(--card);
	border-radius:18px;
	padding:20px;
	border:1px solid var(--border)
}

.cta
{
	background:linear-gradient(135deg,#562dd4,#009E45);
	border-radius:34px;
	padding:40px;
	text-align:center
}

.contact-grid
{
	display:grid;
	grid-template-columns:1fr;
	gap:26px
}

.input
{
	width:100%;
	padding:16px;
	border-radius:16px;
	border:1px solid var(--border);
	background:#252532;
	color:#fff;
	outline:none
}

textarea.input
{
	min-height:140px;
	resize:vertical
}

footer
{
	border-top:1px solid var(--border);
	padding:40px 0
}

.footer-grid
{
	display:grid;
	grid-template-columns:1fr;
	gap:30px
}

.footer-links
{
	display:grid;
	gap:10px;
	color:var(--muted)
}

.whatsapp
{
	position:fixed;
	right:18px;
	bottom:18px;
	width:62px;
	height:62px;
	border-radius:50%;
	background:#25D366;
	display:flex;
	align-items:center;
	justify-content:center;
	font-size:28px;
	color:#fff;
	box-shadow:0 12px 30px #00000059;
	z-index:999
}

@media(min-width:768px) {
	.hero-grid
	{
		grid-template-columns:1.2fr .8fr
	}

	.pricing
	{
		grid-template-columns:repeat(2,1fr)
	}

	.features-grid
	{
		grid-template-columns:repeat(2,1fr)
	}

	.testimonials
	{
		grid-template-columns:repeat(2,1fr)
	}

	.contact-grid
	{
		grid-template-columns:1fr 1fr
	}

	.footer-grid
	{
		grid-template-columns:2fr 1fr 1fr
	}
}

@media(min-width:1024px) {
	.pricing
	{
		grid-template-columns:repeat(4,1fr)
	}

	.features-grid
	{
		grid-template-columns:repeat(4,1fr)
	}

	.testimonials
	{
		grid-template-columns:repeat(3,1fr)
	}

	.hero h1
	{
		font-size:2.5rem
	}
}

.pricing-section
{
	padding:90px 0
}

.pricing-board
{
	background:#252532;
	border:1px solid #ffffff14;
	border-radius:32px;
	overflow:hidden
}

.pricing-toggle-wrap
{
	display:flex;
	justify-content:center;
	padding:32px 20px;
	border-bottom:1px solid #ffffff0f
}

.pricing-toggle
{
	display:inline-flex;
	background:#1b1b24;
	padding:5px;
	border-radius:999px;
	border:1px solid #ffffff0f
}

.pricing-toggle-btn
{
	border:none;
	background:transparent;
	color:#a7a7ba;
	padding:12px 20px;
	border-radius:999px;
	cursor:pointer;
	font-weight:600;
	font-size:.95rem;
	transition:.25s;
	display:flex;
	align-items:center;
	gap:10px
}

.pricing-toggle-btn.active
{
	background:#562dd4;
	color:#fff;
	box-shadow:0 10px 25px #562dd459
}

.save-badge
{
	background:#009E45;
	color:#fff;
	font-size:.7rem;
	padding:4px 8px;
	border-radius:999px
}

.pricing-grid
{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:1px;
	background:#ffffff0f
}

.plan-card
{
	background:#252532;
	padding:34px 28px;
	position:relative;
	display:flex;
	flex-direction:column
}

.featured-plan
{
	background:linear-gradient(180deg,#562dd433,#252532)
}

.plan-badge
{
	position:absolute;
	top:16px;
	right:16px;
	background:#FFFDB7;
	color:#111;
	font-size:.72rem;
	padding:7px 12px;
	border-radius:999px;
	font-weight:800
}

.plan-label
{
	color:#bdbdd3;
	font-size:.78rem;
	margin-bottom:20px;
	font-weight:700
}

.plan-price
{
	display:flex;
	align-items:flex-start;
	margin-bottom:10px
}

.currency
{
	font-size:1.3rem;
	margin-top:10px
}

.amount
{
	font-size:4rem;
	line-height:1;
	font-weight:800;
	letter-spacing:-.05em
}

.period
{
	color:#999;
	margin-left:8px;
	margin-top:24px
}

.billing-note
{
	color:#8f8fa7;
	font-size:.85rem;
	margin-bottom:18px
}

.plan-desc
{
	color:#b8b8c7;
	margin-bottom:24px
}

.plan-features
{
	list-style:none;
	display:flex;
	flex-direction:column;
	gap:14px;
	margin-bottom:30px;
	flex:1
}

.plan-features li
{
	display:flex;
	align-items:center;
	gap:10px;
	color:#d5d5df;
	font-size:.95rem
}

.plan-features i
{
	color:#009E45;
	font-size:1rem
}

.pricing-btn
{
	width:100%
}

@media(max-width:1100px) {
	.pricing-grid
	{
		grid-template-columns:repeat(2,1fr)
	}
}

@media(max-width:680px) {
	.pricing-grid
	{
		grid-template-columns:1fr
	}

	.amount
	{
		font-size:3.4rem
	}
}

html
{
	text-rendering:optimizeLegibility;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale
}


/* =========================================================
   PREMIUM TOP NUDGE PILL
========================================================= */

.top-nudge-pill{

    position:relative;

    display:inline-flex;
    align-items:center;
    gap:10px;

    white-space:nowrap;

    padding:
        12px 18px;

    border-radius:999px;

    overflow:hidden;

    font-size:.82rem;
    font-weight:800;

    letter-spacing:.02em;

    color:#fff;

    background:
        linear-gradient(
            135deg,
            #7c4dff 0%,
            #562dd4 45%,
            #3f24a8 100%
        );

    border:
        1px solid rgba(255,255,255,.12);

    box-shadow:

        0 10px 30px rgba(86,45,212,.38),

        inset 0 1px 0 rgba(255,255,255,.14);

}

/* =========================================================
   SHINE EFFECT
========================================================= */

.top-nudge-pill::before{

    content:"";

    position:absolute;

    top:0;
    left:-120%;

    width:80%;
    height:100%;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(255,255,255,.28),
            transparent
        );

    transform:skewX(-18deg);

    animation:
        nudgeShine 4.5s linear infinite;

}

/* =========================================================
   ICON
========================================================= */

.top-nudge-pill i{

    font-size:.95rem;

    color:#FFFDB7;

    filter:
        drop-shadow(
            0 0 10px rgba(255,253,183,.4)
        );

}

/* =========================================================
   LIGHT MODE
========================================================= */

[data-theme="light"] .top-nudge-pill{

    background:
        linear-gradient(
            135deg,
            #562dd4 0%,
            #6c42f5 100%
        );

    border:
        1px solid rgba(86,45,212,.18);

    box-shadow:

        0 12px 32px rgba(86,45,212,.18),

        inset 0 1px 0 rgba(255,255,255,.18);

}

/* =========================================================
   ANIMATION
========================================================= */

@keyframes nudgeShine{

    0%{

        left:-120%;

    }

    100%{

        left:140%;

    }

}

/* =========================================================
   TOP BAR ENHANCEMENT
========================================================= */

.top-nudge-inner{

    position:relative;

    overflow:hidden;

    background:
        rgba(31,31,41,.78);

    backdrop-filter:
        blur(28px);

    border:
        1px solid rgba(255,255,255,.08);

    box-shadow:

        0 25px 60px rgba(0,0,0,.28),

        inset 0 1px 0 rgba(255,255,255,.05);

}

/* subtle gradient edge */

.top-nudge-inner::before{

    content:"";

    position:absolute;
    inset:0;

    border-radius:inherit;

    padding:1px;

    background:
        linear-gradient(
            135deg,
            rgba(124,93,255,.35),
            rgba(255,255,255,.04),
            rgba(0,158,69,.18)
        );

    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);

    -webkit-mask-composite:xor;

    mask-composite:exclude;

    pointer-events:none;

}




/* =========================================================
   PUBLISHER MARQUEE
========================================================= */

.publisher-marquee-section{

    position:relative;

    overflow:hidden;

    padding:
        0px 0;

}

/* =========================================================
   HEADER
========================================================= */

.publisher-marquee-head{

    text-align:center;

    max-width:860px;

    margin:
        0 auto 30px;

}

.publisher-marquee-head .section-title span{

    color:var(--primary);

}

/* =========================================================
   MARQUEE
========================================================= */

.publisher-marquee{

    position:relative;

    overflow:hidden;

    margin-bottom:24px;

}

/* fade edges */

.publisher-marquee::before,
.publisher-marquee::after{

    content:"";

    position:absolute;

    top:0;
    bottom:0;

    width:140px;

    z-index:2;

    pointer-events:none;

}

.publisher-marquee::before{

    left:0;

    background:
        linear-gradient(
            90deg,
            var(--bg),
            transparent
        );

}

.publisher-marquee::after{

    right:0;

    background:
        linear-gradient(
            -90deg,
            var(--bg),
            transparent
        );

}

/* =========================================================
   TRACK
========================================================= */

.publisher-track{

    display:flex;

    gap:24px;

    width:max-content;

    animation:
        marqueeMove 45s linear infinite;

}

.reverse-marquee .publisher-track{

    animation-direction:reverse;

    animation-duration:35s;

}

/* pause on hover */

.publisher-marquee:hover .publisher-track{

    animation-play-state:paused;

}

/* =========================================================
   BIG CARD
========================================================= */

.publisher-card{

    width:340px;

    flex-shrink:0;

    overflow:hidden;

    border-radius:32px;

    background:var(--card);

    border:
        1px solid var(--border);

    box-shadow:
        var(--shadow);

    transition:.35s;

}

.publisher-card:hover{

    transform:
        translateY(-6px);

}

.publisher-card img{

    width:100%;

    object-fit:cover;

}

.publisher-info{

    padding:24px;

}

.publisher-info h3{

    margin-bottom:10px;

    font-size:1.25rem;

}

.publisher-info span{

    color:var(--muted);

}

/* =========================================================
   MINI CARDS
========================================================= */

.publisher-mini-card{

    height:68px;

    padding:
        0 28px;

    border-radius:18px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:var(--card);

    border:
        1px solid var(--border);

    box-shadow:
        var(--shadow);

    white-space:nowrap;

    font-weight:700;

    color:var(--text);

}

/* =========================================================
   SWITCH & SAVE
========================================================= */

.switch-section{

    padding:80px 0;
    background:linear-gradient(180deg,rgba(86,45,212,.045),transparent);

}

.switch-head{

    max-width:860px;
    margin:0 auto 38px;
    text-align:center;

}

.switch-head .section-title span{

    color:var(--primary);

}

.switch-grid{

    display:grid;
    grid-template-columns:1fr 1fr 1fr;
    gap:18px;

}

.switch-card{

    display:flex;
    flex-direction:column;
    gap:18px;
    padding:24px;
    border-radius:24px;
    background:var(--card);
    border:1px solid var(--border);
    box-shadow:var(--shadow);

}

.switch-card-primary{

    background:linear-gradient(135deg,rgba(86,45,212,.16),var(--card));

}

.switch-card h3{

    font-size:1.2rem;

}

.switch-card p{

    color:var(--muted);
    line-height:1.65;

}

.switch-card ul{

    display:grid;
    gap:10px;
    list-style:none;

}

.switch-card li{

    display:flex;
    align-items:center;
    gap:9px;
    color:var(--text);
    font-size:.94rem;

}

.switch-card li i{

    color:var(--green);

}

.switch-comparison{

    display:grid;
    gap:12px;

}

.switch-comparison div{

    display:grid;
    gap:4px;
    padding:13px;
    border-radius:16px;
    background:rgba(255,255,255,.045);
    border:1px solid var(--border);

}

.switch-comparison span{

    color:var(--muted);
    font-size:.82rem;

}

.switch-comparison strong{

    font-size:.94rem;

}

.migration-form .input,
.migration-form textarea.input{

    margin:0;

}

.two-column-switch{

    grid-template-columns:1fr 1fr;

}

.alternative-hero{

    padding:90px 0 70px;
    background:
        radial-gradient(circle at top right, rgba(86,45,212,.14), transparent 35%),
        linear-gradient(180deg, rgba(255,255,255,.02), transparent);

}

.alternative-hero-grid{

    display:grid;
    grid-template-columns:1.1fr .9fr;
    gap:28px;
    align-items:center;

}

.alternative-hero h1{

    margin:18px 0;
    font-size:clamp(2.4rem,5vw,4.2rem);
    line-height:1.02;
    letter-spacing:-.03em;

}

.alternative-hero p{

    max-width:760px;
    color:var(--muted);
    font-size:1.05rem;
    line-height:1.75;

}

.alternative-panel{

    padding:26px;
    border-radius:26px;
    background:var(--card);
    border:1px solid var(--border);
    box-shadow:var(--shadow);

}

.alternative-panel h3{

    margin-bottom:18px;

}

.alternative-section{

    padding:80px 0;

}

.alternative-table{

    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:14px;

}

.alternative-table div{

    display:grid;
    gap:10px;
    padding:20px;
    border-radius:20px;
    background:var(--card);
    border:1px solid var(--border);

}

.alternative-table span{

    color:var(--muted);
    line-height:1.55;

}

.migration-form textarea.input{

    min-height:94px;

}

/* =========================================================
   ANIMATION
========================================================= */

@keyframes marqueeMove{

    from{

        transform:translateX(0);

    }

    to{

        transform:translateX(-50%);

    }

}

/* =========================================================
   LIGHT MODE
========================================================= */

[data-theme="light"] .publisher-card{

    background:#fff;

}

/* =========================================================
   MOBILE
========================================================= */

@media(max-width:700px){

    .publisher-card{

        width:280px;

    }

    .publisher-card img{

        height:180px;

    }

    .publisher-marquee::before,
    .publisher-marquee::after{

        width:60px;

    }

}


/* =========================================================
   MODERN FOOTER
========================================================= */

.modern-footer{

    position:relative;

    overflow:hidden;

    margin-top:100px;

    padding:
        0 0 30px;

    border-top:
        1px solid var(--border);

    background:
        linear-gradient(
            180deg,
            transparent,
            rgba(86,45,212,.03)
        );

}

/* =========================================================
   TRUST BAR
========================================================= */

.footer-trust-bar{

    display:grid;
grid-template-columns:
    repeat(3,1fr);

    gap:18px;

    padding:
        40px 0 50px;

    border-bottom:
        1px solid var(--border);

}

.footer-trust-item{

    min-height:110px;

    padding:22px;

    border-radius:28px;

    background:var(--card);

    border:
        1px solid var(--border);

    box-shadow:
        var(--shadow);

    display:flex;
    align-items:center;

    gap:18px;

    transition:.35s;

}

.footer-trust-item:hover{

    transform:
        translateY(-5px);

}

.footer-image-badge{

    justify-content:center;

}

.footer-image-badge img{

    width:100%;

    max-width:240px;

    object-fit:contain;

}

/* =========================================================
   TRUST ICONS
========================================================= */

.footer-trust-icon{

    width:60px;
    height:60px;

    border-radius:20px;

    display:flex;
    align-items:center;
    justify-content:center;

    color:#fff;

    flex-shrink:0;

    font-size:1.4rem;

}

.google-icon{

    background:
        linear-gradient(
            135deg,
            #4285F4,
            #34A853
        );

}

.sold-icon{

    background:
        linear-gradient(
            135deg,
            var(--primary),
            #7c4dff
        );

}

.years-icon{

    background:
        linear-gradient(
            135deg,
            #ff9800,
            #ffc107
        );

}

.footer-trust-item h4{

    margin-bottom:8px;

    font-size:1rem;

}

.footer-trust-item p{

    color:var(--muted);

    font-size:.92rem;

    line-height:1.6;

}

/* =========================================================
   MAIN GRID
========================================================= */

.footer-main-grid{

    display:grid;

    grid-template-columns:
        1.2fr .7fr .7fr 1fr;

    gap:40px;

    padding:
        55px 0;

}

/* =========================================================
   BRAND
========================================================= */

.footer-logo-wrap{

    position:relative;

    display:inline-flex;

    margin-bottom:24px;

}

.footer-logo{

    height:42px;

    position:relative;

    z-index:2;

}

.footer-logo-glow{

    position:absolute;

    inset:auto;

    width:120px;
    height:120px;

    background:
        radial-gradient(
            rgba(86,45,212,.22),
            transparent 70%
        );

    top:-40px;
    left:-20px;

    filter:blur(24px);

}

.footer-description{

    max-width:420px;

    color:var(--muted);

    line-height:1.85;

}

/* =========================================================
   SOCIALS
========================================================= */

.footer-socials{

    display:flex;

    gap:14px;

    margin-top:28px;

}

.footer-socials a{

    width:46px;
    height:46px;

    border-radius:16px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:var(--card);

    border:
        1px solid var(--border);

    color:var(--text);

    transition:.25s;

}

.footer-socials a:hover{

    background:var(--primary);

    color:#fff;

    transform:
        translateY(-3px);

}

/* =========================================================
   TITLES
========================================================= */

.footer-title{

    margin-bottom:18px;

    font-size:1.05rem;

}

/* =========================================================
   LINKS
========================================================= */

.footer-links{

    display:flex;
    flex-direction:column;

    gap:14px;

}

.footer-links a{

    color:var(--muted);

    transition:.25s;

}

.footer-links a:hover{

    color:var(--primary);

    transform:
        translateX(4px);

}

/* =========================================================
   NEWSLETTER
========================================================= */

.footer-newsletter p{

    color:var(--muted);

    line-height:1.75;

    margin-bottom:20px;

}

.footer-newsletter-form{

    display:flex;

    overflow:hidden;

    border-radius:18px;

    background:var(--card);

    border:
        1px solid var(--border);

}

.footer-newsletter-form input{

    flex:1;

    height:58px;

    padding:
        0 18px;

    background:none;

    border:none;

    color:var(--text);

    outline:none;

}

.footer-newsletter-form button{

    width:64px;

    border:none;

    background:var(--primary);

    color:#fff;

    cursor:pointer;

    font-size:1.2rem;

}

/* =========================================================
   POWERED CHIPS
========================================================= */

.footer-powered{

    display:flex;

    gap:12px;

    margin-top:22px;

    flex-wrap:wrap;

}

.footer-powered-chip{

    height:42px;

    padding:
        0 16px;

    border-radius:999px;

    display:flex;
    align-items:center;

    gap:8px;

    background:
        rgba(86,45,212,.08);

    color:var(--primary);

    font-size:.85rem;
    font-weight:700;

}

/* =========================================================
   BOTTOM
========================================================= */

.footer-bottom{

    padding-top:30px;

    border-top:
        1px solid var(--border);

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:20px;

}

.footer-copy{

    color:var(--muted);

    font-size:.92rem;

}

.footer-bottom-links{

    display:flex;

    gap:22px;

}

.footer-bottom-links a{

    color:var(--muted);

    font-size:.92rem;

}

/* =========================================================
   MOBILE
========================================================= */

@media(max-width:1200px){

    .footer-trust-bar{

        grid-template-columns:
            repeat(2,1fr);

    }

    .footer-main-grid{

        grid-template-columns:
            repeat(2,1fr);

    }

}

@media(max-width:700px){

    .modern-footer{

        margin-top:56px;
        padding:0 0 24px;

    }

    .footer-trust-bar,
    .footer-main-grid{

        grid-template-columns:1fr;

    }

    .footer-trust-bar{

        gap:12px;
        padding:22px 0 28px;

    }

    .footer-trust-item{

        min-height:0;
        padding:16px;
        border-radius:18px;
        gap:12px;
        box-shadow:none;

    }

    .footer-trust-item:hover{

        transform:none;

    }

    .footer-trust-icon{

        width:46px;
        height:46px;
        border-radius:14px;
        font-size:1.12rem;

    }

    .footer-image-badge{

        justify-content:flex-start;

    }

    .footer-image-badge img{

        max-width:170px;

    }

    .footer-main-grid{

        gap:28px;
        padding:34px 0;

    }

    .footer-brand{

        display:grid;
        gap:16px;

    }

    .footer-logo-wrap{

        margin-bottom:0;

    }

    .footer-logo{

        height:36px;

    }

    .footer-logo-glow{

        display:none;

    }

    .footer-description{

        max-width:none;
        line-height:1.65;
        font-size:.94rem;

    }

    .footer-description img{

        margin-top:8px;
        width:68px;

    }

    .footer-socials{

        margin-top:0;
        gap:10px;
        flex-wrap:wrap;

    }

    .footer-socials a{

        width:42px;
        height:42px;
        border-radius:14px;

    }

    .footer-title{

        margin-bottom:12px;
        font-size:1rem;

    }

    .footer-links{

        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
        gap:10px;

    }

    .footer-links a{

        min-height:42px;
        padding:10px 12px;
        border-radius:14px;
        background:rgba(255,255,255,.045);
        border:1px solid var(--border);
        font-size:.92rem;

    }

    .footer-links a:hover{

        transform:none;

    }

    .footer-newsletter p{

        margin-bottom:14px;
        line-height:1.55;
        font-size:.94rem;

    }

    .footer-newsletter-form{

        display:grid;
        grid-template-columns:1fr 50px;
        overflow:visible;
        border-radius:16px;

    }

    .footer-newsletter-form input{

        min-width:0;
        height:50px;
        padding:0 14px;

    }

    .footer-newsletter-form button{

        width:50px;
        height:50px;
        border-radius:0 16px 16px 0;

    }

    .footer-newsletter-form [data-turnstile-widget],
    .footer-newsletter-form .form-response{

        grid-column:1 / -1;

    }

    .footer-powered{

        gap:8px;
        margin-top:16px;

    }

    .footer-powered-chip{

        height:36px;
        padding:0 12px;
        font-size:.78rem;

    }

    .footer-bottom{

        flex-direction:column;

        align-items:flex-start;
        gap:14px;
        padding-top:22px;

    }

    .footer-copy{

        font-size:.84rem;
        line-height:1.5;

    }

    .footer-bottom-links{

        width:100%;
        display:grid;
        grid-template-columns:repeat(3,minmax(0,1fr));
        gap:8px;

    }

    .footer-bottom-links a{

        min-height:38px;
        display:grid;
        place-items:center;
        border-radius:12px;
        background:rgba(255,255,255,.04);
        border:1px solid var(--border);
        font-size:.82rem;

    }

}

@media(max-width:420px){

    .footer-links{

        grid-template-columns:1fr;

    }

    .footer-bottom-links{

        grid-template-columns:1fr;

    }

}


/* =========================================================
   CLIENT AREA BUTTON
========================================================= */

.client-area-btn{

    position:relative;

    overflow:hidden;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    height:46px;

    padding:
        0 16px;

    border-radius:16px;

    text-decoration:none;

    isolation:isolate;

    background:
        linear-gradient(
            135deg,
            #1F1F29,
            #2a2a38
        );

    border:
        1px solid rgba(255,255,255,.06);

    box-shadow:

        0 10px 24px rgba(0,0,0,.22),

        inset 0 1px 0 rgba(255,255,255,.03);

    transition:
        .28s ease;

}

/* =========================================================
   LIGHT MODE
========================================================= */

[data-theme="light"] .client-area-btn{

    background:
        linear-gradient(
            135deg,
            #1F1F29,
            #2a2a38
        );

    border:
        1px solid rgba(0,0,0,.06);

}

/* =========================================================
   HOVER
========================================================= */

.client-area-btn:hover{

    transform:
        translateY(-2px);

    border-color:
        rgba(86,45,212,.22);

    box-shadow:

        0 14px 30px rgba(0,0,0,.28),

        0 0 24px rgba(86,45,212,.12);

}

/* =========================================================
   GLOW
========================================================= */

.client-area-glow{

    position:absolute;

    top:-30px;
    right:-10px;

    width:90px;
    height:90px;

    background:
        radial-gradient(
            rgba(86,45,212,.26),
            transparent 70%
        );

    filter:blur(18px);

    z-index:0;

}

/* =========================================================
   CONTENT
========================================================= */

.client-area-content{

    position:relative;

    z-index:2;

    display:flex;
    align-items:center;

    gap:10px;

}

/* =========================================================
   ICON
========================================================= */

.client-area-icon{

    width:30px;
    height:30px;

    border-radius:10px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:
        linear-gradient(
            135deg,
            #562dd4,
            #6d49ff
        );

    color:#fff;

    flex-shrink:0;

    box-shadow:
        0 6px 16px rgba(86,45,212,.24);

}

.client-area-icon i{

    font-size:.95rem;

}

/* =========================================================
   TEXT
========================================================= */

.client-area-text{

    display:flex;
    flex-direction:column;

    line-height:1;

}

.client-area-text strong{

    color:#fff;

    font-size:.8rem;

    font-weight:700;

    letter-spacing:-0.01em;

}

.client-area-text small{

    margin-top:3px;

    color:rgba(255,255,255,.5);

    font-size:.62rem;

    font-weight:600;

}

/* =========================================================
   ARROW
========================================================= */

.client-area-arrow{

    width:22px;
    height:22px;

    border-radius:8px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:
        rgba(255,255,255,.04);

    color:#bca9ff;

    transition:.25s;

}

.client-area-arrow i{

    font-size:.78rem;

}

.client-area-btn:hover .client-area-arrow{

    transform:
        translate(1px,-1px);

}

/* =========================================================
   MOBILE
========================================================= */

@media(max-width:768px){

    .client-area-btn{

        width:100%;

        justify-content:center;

    }

}

/* =========================================================
   COMPARISON SECTION
========================================================= */

.comparison-section{

    position:relative;

    overflow:hidden;

    padding:
        100px 0;

}

/* =========================================================
   HEADER
========================================================= */

.comparison-head{

    text-align:center;

    max-width:860px;

    margin:
        0 auto 60px;

}

.comparison-head .section-title span{

    color:var(--primary);

}

/* =========================================================
   WRAPPER
========================================================= */

.comparison-wrapper{

    overflow:hidden;

    border-radius:38px;

    border:
        1px solid var(--border);

    background:var(--card);

    box-shadow:
        var(--shadow-lg);

}

/* =========================================================
   HEADER
========================================================= */

.comparison-header{

    display:grid;

    grid-template-columns:
        1.1fr 1fr 1fr;

    gap:0;

    background:
        linear-gradient(
            180deg,
            rgba(86,45,212,.08),
            transparent
        );

    border-bottom:
        1px solid var(--border);

}

.comparison-col{

    padding:32px;

}

.feature-col{

    display:flex;
    align-items:center;

    font-size:1.05rem;
    font-weight:700;

}

.epaper-col{

    border-left:
        1px solid var(--border);

    border-right:
        1px solid var(--border);

}

/* =========================================================
   PRODUCT
========================================================= */

.comparison-product{

    display:flex;

    align-items:center;

    gap:16px;

}

.comparison-product-icon{

    width:60px;
    height:60px;

    border-radius:20px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:
        linear-gradient(
            135deg,
            var(--primary),
            #7c4dff
        );

    color:#fff;

    font-size:1.5rem;

    box-shadow:
        0 14px 35px rgba(86,45,212,.2);

}

.other-icon{

    background:
        linear-gradient(
            135deg,
            #444,
            #666
        );

}

.comparison-product h3{

    margin-bottom:6px;

}

.comparison-product p{

    color:var(--muted);

}

/* =========================================================
   ROW
========================================================= */

.comparison-row{

    display:grid;

    grid-template-columns:
        1.1fr 1fr 1fr;

    border-bottom:
        1px solid var(--border);

}

.comparison-row:last-child{

    border-bottom:none;

}

/* =========================================================
   FEATURE
========================================================= */

.comparison-feature{

    display:flex;

    align-items:center;

    gap:18px;

    padding:30px;

}

.comparison-feature-icon{

    width:58px;
    height:58px;

    border-radius:18px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:
        rgba(86,45,212,.08);

    color:var(--primary);

    flex-shrink:0;

    font-size:1.35rem;

}

.comparison-feature h4{

    margin-bottom:8px;

    font-size:1.05rem;

}

.comparison-feature p{

    color:var(--muted);

    line-height:1.6;

    font-size:.92rem;

}

/* =========================================================
   VALUE
========================================================= */

.comparison-value{

    position:relative;

    padding:30px;

    display:flex;

    align-items:flex-start;

    gap:16px;

}

.comparison-value i{

    font-size:1.4rem;

    margin-top:2px;

}

.comparison-value strong{

    display:block;

    margin-bottom:8px;

    font-size:1rem;

}

.comparison-value span{

    color:var(--muted);

    line-height:1.6;

    font-size:.92rem;

}

/* =========================================================
   SUCCESS
========================================================= */

.success-value{

    background:
        linear-gradient(
            135deg,
            rgba(0,158,69,.06),
            transparent
        );

}

.success-value i{

    color:var(--green);

}

/* =========================================================
   WARNING
========================================================= */

.warning-value{

    background:
        linear-gradient(
            135deg,
            rgba(255,193,7,.06),
            transparent
        );

}

.warning-value i{

    color:#ff9800;

}

/* =========================================================
   DANGER
========================================================= */

.danger-value{

    background:
        linear-gradient(
            135deg,
            rgba(239,68,68,.05),
            transparent
        );

}

.danger-value i{

    color:#ef4444;

}

/* =========================================================
   HOVER
========================================================= */

.comparison-row{

    transition:
        background .35s ease;

}

.comparison-row:hover{

    background:
        rgba(86,45,212,.025);

}

/* =========================================================
   LIGHT MODE
========================================================= */

[data-theme="light"] .comparison-wrapper{

    background:#fff;

}

/* =========================================================
   MOBILE
========================================================= */

@media(max-width:900px){

    .comparison-header{

        display:none;

    }

    .comparison-row{

        grid-template-columns:1fr;

    }

    .comparison-feature{

        padding-bottom:18px;

    }

    .comparison-value{

        border-top:
            1px solid var(--border);

    }

}


/* =========================================================
   PREMIUM FEATURES
========================================================= */

.premium-features-section{

    position:relative;

    overflow:hidden;

    padding:
        110px 0;

}

/* =========================================================
   HEADER
========================================================= */

.premium-features-head{

    text-align:center;

    max-width:860px;

    margin:
        0 auto 70px;

}

.premium-features-head .section-title span{

    color:var(--primary);

}

/* =========================================================
   AUTOMATION WORKFLOW HIGHLIGHT
========================================================= */

.automation-workflow-section{

    padding:
        120px 0;

    background:
        linear-gradient(
            180deg,
            transparent 0%,
            rgba(243,128,32,.045) 45%,
            transparent 100%
        );

}

.automation-cloud-card{

    position:relative;

    overflow:hidden;

    padding:
        64px;

    border-radius:34px;

    background:
        linear-gradient(
            135deg,
            #17110d 0%,
            #231812 45%,
            #101015 100%
        );

    border:
        1px solid rgba(243,128,32,.34);

    box-shadow:
        0 34px 90px rgba(0,0,0,.28),
        0 0 0 1px rgba(255,255,255,.04) inset,
        inset 0 1px 0 rgba(255,255,255,.12);

    isolation:isolate;

    transition:
        opacity .85s cubic-bezier(.2,.8,.2,1),
        transform .85s cubic-bezier(.2,.8,.2,1),
        box-shadow .85s cubic-bezier(.2,.8,.2,1);

}

.automation-cloud-card.container{

    width:100%;

    max-width:none;

    margin:0;

    border-radius:0;

}

.automation-cloud-card.reveal-pending{

    transform:
        translateY(86px)
        scale(.97);

    opacity:0;

}

.automation-cloud-card::before{

    content:"";

    position:absolute;

    inset:0;

    background:
        radial-gradient(
            circle at 14% 12%,
            rgba(243,128,32,.26),
            transparent 32%
        ),
        radial-gradient(
            circle at 84% 8%,
            rgba(255,177,74,.18),
            transparent 30%
        ),
        linear-gradient(
            135deg,
            rgba(255,255,255,.08),
            transparent 52%
        );

    z-index:-1;

}

.automation-cloud-card::after{

    content:"";

    position:absolute;

    left:28px;
    right:28px;
    bottom:20px;

    height:1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(243,128,32,.42),
            transparent
        );

}

.automation-cloud-card.is-visible{

    opacity:1;

    transform:
        translateY(0)
        scale(1);

    box-shadow:
        0 42px 110px rgba(0,0,0,.34),
        0 0 62px rgba(243,128,32,.12),
        inset 0 1px 0 rgba(255,255,255,.14);

}

.automation-cloud-card .premium-features-head{

    position:relative;

    z-index:1;

    width:
        min(1180px,92%);

    max-width:920px;

    margin:
        0 auto 44px;

}

.automation-cloud-card .badge{

    background:
        linear-gradient(
            135deg,
            #ffb14a,
            #f38020
        ) !important;

    color:#1f1206 !important;

    border:
        1px solid rgba(255,224,184,.72) !important;

    box-shadow:
        0 12px 30px rgba(0,0,0,.22),
        0 0 28px rgba(243,128,32,.2) !important;

    font-weight:800 !important;

}

.automation-cloud-card .badge i{

    color:#1f1206;

}

.automation-cloud-card .section-sub{

    color:rgba(255,245,230,.76) !important;

}

.automation-cloud-card .section-title,
.automation-cloud-card .section-title span,
.automation-cloud-card .premium-features-head h2,
.automation-cloud-card .premium-features-head p{

    color:#fff4e5;

}

.automation-cloud-card .premium-features-head p{

    color:rgba(255,245,230,.78);

}

.automation-steps-grid{

    position:relative;

    z-index:1;

    width:
        min(1180px,92%);

    margin:
        0 auto;

    grid-template-columns:
        repeat(3,1fr);

}

.automation-step-card,
[data-theme="light"] .automation-step-card{

    background:
        rgba(255,251,245,.94);

    border:
        1px solid rgba(255,216,166,.62);

    border-radius:24px;

    box-shadow:
        0 24px 60px rgba(0,0,0,.22),
        inset 0 1px 0 rgba(255,255,255,.82);

    backdrop-filter:
        blur(14px);

    transform:
        translateY(0);

    opacity:1;

    transition:
        opacity .7s cubic-bezier(.2,.8,.2,1),
        transform .7s cubic-bezier(.2,.8,.2,1),
        box-shadow .35s ease;

}

.automation-cloud-card.reveal-pending .automation-step-card{

    transform:
        translateY(22px);

    opacity:.01;

}

.automation-cloud-card.is-visible .automation-step-card{

    opacity:1;

    transform:
        translateY(0);

}

.automation-cloud-card.is-visible .automation-step-card:nth-child(2){

    transition-delay:.1s;

}

.automation-cloud-card.is-visible .automation-step-card:nth-child(3){

    transition-delay:.2s;

}

.automation-step-card:hover{

    transform:
        translateY(-8px);

    border-color:
        rgba(255,177,74,.78);

    box-shadow:
        0 32px 76px rgba(0,0,0,.28),
        0 0 28px rgba(243,128,32,.16);

}

.automation-step-card .feature-card-glow,
.automation-step-card .green-glow{

    background:
        radial-gradient(
            rgba(243,128,32,.26),
            transparent 70%
        );

}

.automation-step-card .premium-feature-icon,
.automation-step-card .autotag-icon-feature{

    background:
        linear-gradient(
            135deg,
            #faae40,
            #f38020 58%,
            #c84d00
        );

    box-shadow:
        0 18px 36px rgba(200,77,0,.26);

}

.automation-step-card .premium-feature-chip,
.automation-step-card .ai-chip-feature,
.automation-step-card .success-chip{

    background:
        rgba(243,128,32,.13);

    color:#b54300;

}

.automation-step-card h3{

    color:#211509;

}

.automation-step-card p{

    color:rgba(33,21,9,.72);

}

/* =========================================================
   GRID
========================================================= */

.premium-features-grid{

    display:grid;

    grid-template-columns:
        repeat(4,1fr);

    gap:24px;

}

/* =========================================================
   CARD
========================================================= */

.premium-feature-card{

    position:relative;

    overflow:hidden;

    padding:30px;

    border-radius:32px;

    background:var(--card);

    border:
        1px solid var(--border);

    box-shadow:
        var(--shadow);

    transition:
        .35s ease;

    isolation:isolate;

}

.premium-feature-card:hover{

    transform:
        translateY(-8px);

    border-color:
        rgba(86,45,212,.16);

    box-shadow:

        0 25px 60px rgba(0,0,0,.12),

        0 0 30px rgba(86,45,212,.06);

}

/* =========================================================
   FEATURED
========================================================= */

.featured-main-card{

    grid-column:
        span 2;

    background:
        linear-gradient(
            135deg,
            rgba(86,45,212,.08),
            var(--card)
        );

}

.premium-feature-highlight{

    background:
        linear-gradient(
            135deg,
            rgba(0,158,69,.06),
            var(--card)
        );

}

/* =========================================================
   GLOW
========================================================= */

.feature-card-glow{

    position:absolute;

    width:220px;
    height:220px;

    top:-100px;
    right:-100px;

    border-radius:50%;

    background:
        radial-gradient(
            rgba(86,45,212,.18),
            transparent 70%
        );

    filter:blur(30px);

    z-index:-1;

}

.green-glow{

    background:
        radial-gradient(
            rgba(0,158,69,.18),
            transparent 70%
        );

}

/* =========================================================
   TOP
========================================================= */

.premium-feature-top{

    display:flex;

    align-items:center;

    justify-content:space-between;

    margin-bottom:26px;

}

/* =========================================================
   ICON
========================================================= */

.premium-feature-icon{

    width:64px;
    height:64px;

    border-radius:22px;

    display:flex;
    align-items:center;
    justify-content:center;

    background:
        linear-gradient(
            135deg,
            var(--primary),
            #7c4dff
        );

    color:#fff;

    box-shadow:
        0 14px 35px rgba(86,45,212,.2);

}

.premium-feature-icon i{

    font-size:1.6rem;

}

.autotag-icon-feature{

    background:
        linear-gradient(
            135deg,
            var(--green),
            #00c95a
        );

}

/* =========================================================
   CHIP
========================================================= */

.premium-feature-chip{

    height:34px;

    padding:
        0 14px;

    border-radius:999px;

    display:flex;
    align-items:center;

    background:
        rgba(86,45,212,.08);

    color:var(--primary);

    font-size:.76rem;
    font-weight:700;

}

.ai-chip-feature{

    background:
        rgba(86,45,212,.12);

}

.success-chip{

    background:
        rgba(0,158,69,.12);

    color:var(--green);

}

/* =========================================================
   TEXT
========================================================= */

.premium-feature-card h3{

    font-size:1.28rem;

    margin-bottom:16px;

    letter-spacing:-0.02em;

}

.premium-feature-card p{

    color:var(--muted);

    line-height:1.8;

    font-size:.96rem;

}

/* =========================================================
   LINK
========================================================= */

.feature-link{

    display:inline-flex;

    align-items:center;

    gap:8px;

    margin-top:24px;

    color:var(--green);

    font-weight:700;

}

.feature-link i{

    transition:
        transform .3s ease;

}

.feature-link:hover i{

    transform:
        translateX(4px);

}

/* =========================================================
   LIGHT MODE
========================================================= */

[data-theme="light"] .premium-feature-card{

    background:#fff;

}

/* =========================================================
   MOBILE
========================================================= */

@media(max-width:1100px){

    .premium-features-grid{

        grid-template-columns:
            repeat(2,1fr);

    }

    .featured-main-card{

        grid-column:
            span 2;

    }

}

@media(max-width:700px){

    .premium-features-grid{

        grid-template-columns:1fr;

    }

    .featured-main-card{

        grid-column:
            span 1;

    }

    .premium-feature-card{

        padding:24px;

        border-radius:26px;

    }

    .automation-workflow-section{

        padding:
            56px 0;

    }

    .automation-cloud-card{

        padding:
            34px 0;

        border-radius:0;

    }

    .automation-cloud-card.reveal-pending{

        transform:
            translateY(52px)
            scale(.98);

    }

    .automation-cloud-card .premium-features-head{

        width:
            min(100% - 28px,1180px);

        margin-bottom:24px;

    }

    .automation-steps-grid{

        width:
            min(100% - 28px,1180px);

        grid-template-columns:1fr;

    }

    .automation-step-card{

        border-radius:18px;

    }

}


/* =========================================================
   TESTIMONIALS
========================================================= */

.premium-testimonials-section{

    position:relative;

    overflow:hidden;

    padding:
        120px 0;

}

/* =========================================================
   HEADER
========================================================= */

.premium-testimonials-head{

    text-align:center;

    max-width:860px;

    margin:
        0 auto 70px;

}

.premium-testimonials-head .section-title span{

    color:var(--primary);

}

/* =========================================================
   EDITORIAL GRID
========================================================= */

.testimonial-editorial-grid{

    display:grid;

    grid-template-columns:
        1.15fr .85fr;

    gap:28px;

    margin-bottom:28px;

}

/* =========================================================
   FEATURED
========================================================= */

.testimonial-featured-card{

    position:relative;

    overflow:hidden;

    padding:50px;

    border-radius:40px;

    background:
        linear-gradient(
            135deg,
            rgba(86,45,212,.12),
            rgba(86,45,212,.03)
        );

    border:
        1px solid rgba(86,45,212,.14);

    box-shadow:
        var(--shadow-lg);

    isolation:isolate;

}

.testimonial-featured-bg{

    position:absolute;

    inset:auto;

    width:320px;
    height:320px;

    right:-120px;
    top:-120px;

    border-radius:50%;

    background:
        radial-gradient(
            rgba(124,77,255,.24),
            transparent 70%
        );

    filter:blur(30px);

    z-index:-1;

}

.testimonial-quote-icon{

    width:74px;
    height:74px;

    border-radius:24px;

    display:flex;
    align-items:center;
    justify-content:center;

    margin-bottom:32px;

    background:
        linear-gradient(
            135deg,
            var(--primary),
            #7c4dff
        );

    color:#fff;

    font-size:2rem;

    box-shadow:
        0 20px 40px rgba(86,45,212,.22);

}

.testimonial-featured-card h3{

    font-size:
        clamp(2rem,4vw,3rem);

    line-height:1.15;

    margin-bottom:24px;

    letter-spacing:-0.03em;

}

.testimonial-featured-card p{

    max-width:680px;

    color:var(--muted);

    line-height:1.9;

    font-size:1.05rem;

}

/* =========================================================
   USER
========================================================= */

.testimonial-featured-user{

    display:flex;

    align-items:center;

    gap:16px;

    margin-top:36px;

}

.testimonial-featured-user img{

    width:68px;
    height:68px;

    border-radius:50%;

    object-fit:cover;

    border:
        3px solid rgba(255,255,255,.12);

}

.testimonial-featured-user strong{

    display:block;

    margin-bottom:6px;

    font-size:1rem;

}

.testimonial-featured-user span{

    color:var(--muted);

}

/* =========================================================
   SIDE STACK
========================================================= */

.testimonial-side-stack{

    display:flex;
    flex-direction:column;

    gap:24px;

}

/* =========================================================
   MODERN CARD
========================================================= */

.testimonial-modern-card{

    padding:30px;

    border-radius:32px;

    background:var(--card);

    border:
        1px solid var(--border);

    box-shadow:
        var(--shadow);

    transition:.35s ease;

}

.testimonial-modern-card:hover{

    transform:
        translateY(-6px);

}

.testimonial-modern-top{

    display:flex;

    align-items:center;

    gap:16px;

    margin-bottom:24px;

}

.testimonial-modern-top img{

    width:58px;
    height:58px;

    border-radius:50%;

    object-fit:cover;

}

.testimonial-modern-top h4{

    margin-bottom:6px;

}

.testimonial-modern-top span{

    color:var(--muted);

    font-size:.92rem;

}

.testimonial-modern-card p{

    color:var(--muted);

    line-height:1.8;

}

/* =========================================================
   STARS
========================================================= */

.testimonial-stars{

    display:flex;

    gap:6px;

    margin-top:22px;

    color:#ffb400;

}

/* =========================================================
   FLOATING GRID
========================================================= */

.floating-testimonials-grid{

    display:grid;

    grid-template-columns:
        repeat(3,1fr);

    gap:24px;

}

/* =========================================================
   FLOATING CARD
========================================================= */

.floating-testimonial-card{

    padding:26px;

    border-radius:28px;

    background:var(--card);

    border:
        1px solid var(--border);

    box-shadow:
        var(--shadow);

    transition:.35s ease;

}

.floating-testimonial-card:hover{

    transform:
        translateY(-5px);

}

.floating-user{

    display:flex;

    align-items:center;

    gap:14px;

    margin-bottom:20px;

}

.floating-user img{

    width:52px;
    height:52px;

    border-radius:50%;

    object-fit:cover;

}

.floating-user h4{

    margin-bottom:5px;

    font-size:1rem;

}

.floating-user span{

    color:var(--muted);

    font-size:.88rem;

}

.floating-testimonial-card p{

    color:var(--muted);

    line-height:1.75;

}

/* =========================================================
   LIGHT MODE
========================================================= */

[data-theme="light"] .testimonial-modern-card,
[data-theme="light"] .floating-testimonial-card{

    background:#fff;

}

/* =========================================================
   MOBILE
========================================================= */

@media(max-width:1100px){

    .testimonial-editorial-grid{

        grid-template-columns:1fr;

    }

    .floating-testimonials-grid{

        grid-template-columns:
            repeat(2,1fr);

    }

}

@media(max-width:700px){

    .floating-testimonials-grid{

        grid-template-columns:1fr;

    }

    .testimonial-featured-card{

        padding:32px;

        border-radius:30px;

    }

    .testimonial-modern-card,
    .floating-testimonial-card{

        border-radius:24px;

    }

}


/* =========================================================
   FEATURED CHIP
========================================================= */

.featured-chip{

    position:absolute;

    top:14px;
    right:14px;

    padding:
        6px 10px;

    border-radius:999px;

    background:#FFFDB7;

    color:#1F1F29 !important;

    font-size:.72rem;

    font-weight:800;

    letter-spacing:.04em;

    box-shadow:
        0 6px 18px rgba(0,0,0,.08);

    border:
        1px solid rgba(0,0,0,.06);

}

/* =========================================================
   DARK MODE
========================================================= */

[data-theme="dark"] .featured-chip{

    background:#FFFDB7;

    color:#1F1F29 !important;

}



/* =========================================================
   HERO VIDEO BACKGROUND
========================================================= */

.hero{

    position:relative;

    overflow:hidden;

    isolation:isolate;

}

/* =========================================================
   VIDEO WRAPPER
========================================================= */

.hero-video-bg{

    position:absolute;

    inset:0;

    z-index:-2;

    overflow:hidden;

}

/* =========================================================
   VIDEO
========================================================= */

.hero-video{

    position:absolute;

    inset:0;

    width:100%;
    height:100%;

    object-fit:cover;

    transform:scale(1.04);

}

/* =========================================================
   OVERLAY
========================================================= */

.hero-video-overlay{

    position:absolute;

    inset:0;

    /* background:

        linear-gradient(
            180deg,
            rgba(10,10,14,.82),
            rgba(10,10,14,.88)
        ),

        radial-gradient(
            circle at top right,
            rgba(86,45,212,.22),
            transparent 40%
        ),

        radial-gradient(
            circle at bottom left,
            rgba(0,158,69,.12),
            transparent 35%
        ); */

}

/* =========================================================
   HERO CONTENT
========================================================= */

.hero .container{

    position:relative;

    z-index:5;

}

/* =========================================================
   DARKEN TEXT AREA
========================================================= */

.hero::after{

    content:"";

    position:absolute;

    inset:0;

    /* background:

        linear-gradient(
            90deg,
            rgba(10,10,14,.62) 0%,
            rgba(10,10,14,.28) 45%,
            rgba(10,10,14,.72) 100%
        ); */

    z-index:-1;

    pointer-events:none;

}

/* =========================================================
   TEXT COLORS
========================================================= */

.hero h1{

    color:#fff;

}

.hero h1 span{

    color:#FFFDB7;

}

.hero p{

    color:
        rgba(255,255,255,.72);

}

.hero .badge{

    background:
        rgba(255,255,255,.06);

    border:
        1px solid rgba(255,255,255,.08);

    color:#fff;

    backdrop-filter:
        blur(16px);

}

/* =========================================================
   GLASS APP CARD
========================================================= */

.hero .app-card{

    background:
        rgba(255,255,255,.05);

    border:
        1px solid rgba(255,255,255,.08);

    backdrop-filter:
        blur(24px);

    box-shadow:

        0 25px 70px rgba(0,0,0,.34),

        inset 0 1px 0 rgba(255,255,255,.04);

}

/* =========================================================
   APP CARD TEXT
========================================================= */

.hero .app-card h3{

    color:#fff;

}

.hero .app-card .feature{

    background:
        rgba(255,255,255,.03);

    border:
        1px solid rgba(255,255,255,.05);

}

.hero .app-card .feature h3{

    color:#fff;

}

.hero .app-card .feature p{

    color:
        rgba(255,255,255,.66);

}

/* =========================================================
   STATS
========================================================= */

.hero .stat{

    background:
        rgba(255,255,255,.05);

    border:
        1px solid rgba(255,255,255,.08);

    backdrop-filter:
        blur(18px);

}

.hero .stat h3{

    color:#fff;

}

.hero .stat p{

    color:
        rgba(255,255,255,.62);

}

/* =========================================================
   BUTTONS
========================================================= */

.hero .btn-outline{

    background:
        rgba(255,255,255,.04);

    border:
        1px solid rgba(255,255,255,.12);

    color:#fff;

    backdrop-filter:
        blur(12px);

}

.hero .btn-outline:hover{

    background:
        rgba(255,255,255,.08);

}

/* =========================================================
   LIGHT MODE
========================================================= */

[data-theme="light"] .hero{

    background:#11131a;

}

/* =========================================================
   MOBILE
========================================================= */

@media(max-width:768px){

    .hero-video{

        opacity:.32;

    }

    .hero::after{

        background:
            linear-gradient(
                180deg,
                rgba(10,10,14,.78),
                rgba(10,10,14,.88)
            );

    }

}

/* =========================================================
   REDUCE MOTION
========================================================= */

@media(prefers-reduced-motion:reduce){

    .hero-video{

        display:none;

    }

}


/* =========================================================
   HERO ALWAYS DARK
========================================================= */

.hero{

    color:#fff;

}

/* =========================================================
   FORCE DARK TEXT
========================================================= */

.hero h1,
.hero h2,
.hero h3,
.hero h4,
.hero strong{

    color:#fff !important;

}

.hero h1 span{

    color:#FFFDB7 !important;

}

.hero p{

    color:
        rgba(255,255,255,.72) !important;

}

/* =========================================================
   BADGE
========================================================= */

.hero .badge{

    background:
        rgba(255,255,255,.06) !important;

    border:
        1px solid rgba(255,255,255,.08) !important;

    color:#fff !important;

    backdrop-filter:
        blur(14px);

}

/* =========================================================
   APP CARD
========================================================= */

.hero .app-card{

    background:
        rgba(255,255,255,.05) !important;

    border:
        1px solid rgba(255,255,255,.08) !important;

    backdrop-filter:
        blur(24px);

    box-shadow:

        0 24px 70px rgba(0,0,0,.35),

        inset 0 1px 0 rgba(255,255,255,.04);

}

/* =========================================================
   FEATURES INSIDE CARD
========================================================= */

.hero .feature{

    background:
        rgba(255,255,255,.03) !important;

    border:
        1px solid rgba(255,255,255,.05);

}

.hero .feature h3{

    color:#fff !important;

}

.hero .feature p{

    color:
        rgba(255,255,255,.65) !important;

}

/* =========================================================
   STATS
========================================================= */

.hero .stat{

    background:
        rgba(255,255,255,.05) !important;

    border:
        1px solid rgba(255,255,255,.08);

    backdrop-filter:
        blur(16px);

}

.hero .stat h3{

    color:#fff !important;

}

.hero .stat p{

    color:
        rgba(255,255,255,.62) !important;

}

/* =========================================================
   BUTTONS
========================================================= */

.hero .btn-outline{

    background:
        rgba(255,255,255,.04) !important;

    border:
        1px solid rgba(255,255,255,.12) !important;

    color:#fff !important;

    backdrop-filter:
        blur(12px);

}

.hero .btn-outline:hover{

    background:
        rgba(255,255,255,.08) !important;

}

/* =========================================================
   IGNORE LIGHT MODE
========================================================= */

[data-theme="light"] .hero,
[data-theme="light"] .hero *{

    color-scheme:dark;

}



/* =========================================================
   PUBLISHER LOGOS
========================================================= */

.publisher-card{

    position:relative;

    overflow:hidden;

    display:flex;
    align-items:center;
    justify-content:center;

    transition:
        transform .35s ease;

}

.publisher-card img{

    transition:

        filter .45s ease,

        opacity .35s ease,

        transform .35s ease;

}

/* =========================================================
   DARK MODE
========================================================= */

[data-theme="dark"] .publisher-card img{

    filter:
        grayscale(1)
        brightness(.9)
        contrast(.9);

    opacity:.72;

}

/* =========================================================
   HOVER RESTORE COLOR
========================================================= */

[data-theme="dark"] .publisher-card:hover img{

    filter:
        grayscale(0)
        brightness(1)
        contrast(1);

    opacity:1;

    transform:
        scale(1.03);

}

/* =========================================================
   OPTIONAL GLOW
========================================================= */

[data-theme="dark"] .publisher-card::after{

    content:"";

    position:absolute;

    inset:auto;

    width:120px;
    height:120px;

    border-radius:50%;

    background:
        radial-gradient(
            rgba(86,45,212,.18),
            transparent 70%
        );

    opacity:0;

    transition:.35s ease;

    pointer-events:none;

}

[data-theme="dark"] .publisher-card:hover::after{

    opacity:1;

}

/* =========================================================
   LIGHT MODE
========================================================= */

[data-theme="light"] .publisher-card img{

    filter:none;

    opacity:1;

}

/* =========================================================
   HOMEPAGE MOBILE DENSITY
========================================================= */

@media(max-width:700px){

    section{

        padding:42px 0;

    }

    .container{

        width:min(100% - 28px,1180px);

    }

    .hero{

        padding:34px 0 28px;

    }

    .hero-grid{

        gap:18px;

    }

    .hero .badge{

        padding:7px 11px;
        font-size:.76rem;
        gap:6px;

    }

    .hero h1{

        margin:12px 0;
        font-size:clamp(2rem,10vw,2.55rem);
        line-height:1.02;

    }

    .hero p{

        max-width:100%;
        font-size:.94rem;
        line-height:1.55;

    }

    .hero-actions{

        margin-top:18px;
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:9px;

    }

    .hero-actions .btn{

        min-height:44px;
        padding:10px 12px;
        border-radius:13px;
        font-size:.82rem;
        line-height:1.15;
        white-space:normal;
        text-align:center;

    }

    .hero-actions .btn:nth-child(3){

        display:none;

    }

    .stats{

        margin-top:14px;
        gap:8px;

    }

    .stat{

        padding:12px;
        border-radius:14px;

    }

    .stat h3{

        font-size:1.18rem;
        margin-bottom:2px;

    }

    .stat p{

        font-size:.76rem;
        line-height:1.25;

    }

    .hero .app-card{

        display:none;

    }

    .hero-video{

        opacity:.24;
        transform:scale(1.01);

    }

    .publisher-marquee-section{

        padding:12px 0 22px;

    }

    .publisher-marquee{

        margin-bottom:10px;

    }

    .publisher-track{

        gap:10px;

    }

    .publisher-card{

        width:150px;
        min-height:74px;
        padding:12px;
        border-radius:16px;
        box-shadow:none;

    }

    .publisher-card:hover{

        transform:none;

    }

    .publisher-card img{

        width:100%;
        height:auto;
        max-height:48px;
        object-fit:contain;

    }

    .publisher-mini-card{

        height:38px;
        padding:0 14px;
        border-radius:12px;
        font-size:.78rem;
        box-shadow:none;

    }

    .publisher-marquee::before,
    .publisher-marquee::after{

        width:34px;

    }

    .section-title{

        margin-bottom:10px;
        font-size:clamp(1.65rem,7vw,2rem);
        line-height:1.1;

    }

    .section-sub{

        margin:0 auto 26px;
        font-size:.92rem;
        line-height:1.55;

    }

    .pricing-section,
    .switch-section,
    .premium-features-section,
    .comparison-section,
    .premium-testimonials-section{

        padding:46px 0;

    }

    .pricing-board{

        border-radius:20px;
        overflow:hidden;

    }

    .pricing-toggle-wrap{

        margin-bottom:18px;

    }

    .pricing-toggle{

        width:100%;
        padding:5px;

    }

    .pricing-toggle-btn{

        min-height:38px;
        padding:0 10px;
        font-size:.82rem;

    }

    .pricing-grid{

        gap:10px;
        background:transparent;

    }

    .switch-head{

        margin-bottom:24px;

    }

    .switch-grid{

        grid-template-columns:1fr;
        gap:12px;

    }

    .two-column-switch,
    .alternative-hero-grid,
    .alternative-table{

        grid-template-columns:1fr;

    }

    .alternative-hero{

        padding:46px 0;

    }

    .alternative-hero h1{

        font-size:clamp(2rem,10vw,2.65rem);
        letter-spacing:0;

    }

    .alternative-hero p{

        font-size:.94rem;
        line-height:1.55;

    }

    .alternative-panel,
    .alternative-table div{

        padding:18px;
        border-radius:18px;
        box-shadow:none;

    }

    .alternative-section{

        padding:46px 0;

    }

    .switch-card{

        gap:14px;
        padding:18px;
        border-radius:18px;
        box-shadow:none;

    }

    .switch-card h3{

        font-size:1.05rem;

    }

    .switch-card p,
    .switch-card li{

        font-size:.88rem;
        line-height:1.5;

    }

    .switch-comparison{

        gap:8px;

    }

    .switch-comparison div{

        padding:11px;
        border-radius:13px;

    }

    .plan-card{

        padding:22px 18px;
        border-radius:18px;
        border:1px solid var(--border);

    }

    .plan-badge{

        top:12px;
        right:12px;
        padding:5px 9px;
        font-size:.62rem;

    }

    .plan-label{

        margin-bottom:12px;
        font-size:.72rem;

    }

    .amount{

        font-size:2.35rem !important;
        letter-spacing:0;

    }

    .currency{

        font-size:1rem;
        margin-top:5px;

    }

    .period{

        margin-top:12px;
        font-size:.82rem;

    }

    .billing-note,
    .plan-desc{

        margin-bottom:14px;
        font-size:.86rem;
        line-height:1.45;

    }

    .plan-features{

        gap:9px;
        margin-bottom:18px;

    }

    .plan-features li{

        font-size:.85rem;

    }

    .pricing-btn{

        min-height:42px;
        padding:10px 14px;
        border-radius:13px;
        font-size:.86rem;

    }

    .premium-features-head,
    .premium-testimonials-head{

        margin-bottom:26px;

    }

    .premium-features-grid,
    .testimonial-editorial-grid,
    .floating-testimonials-grid{

        gap:14px;

    }

    .premium-feature-card,
    .testimonial-modern-card,
    .floating-testimonial-card{

        padding:18px;
        border-radius:18px;
        box-shadow:none;

    }

    .premium-feature-card:hover,
    .testimonial-modern-card:hover,
    .floating-testimonial-card:hover{

        transform:none;

    }

    .premium-feature-icon{

        width:42px;
        height:42px;
        border-radius:13px;
        font-size:1.1rem;

    }

    .premium-feature-card h3,
    .testimonial-modern-card h3,
    .floating-testimonial-card h3{

        font-size:1rem;
        line-height:1.25;

    }

    .premium-feature-card p,
    .testimonial-modern-card p,
    .floating-testimonial-card p{

        font-size:.88rem;
        line-height:1.5;

    }

    .testimonial-featured-card{

        padding:22px;
        border-radius:20px;
        box-shadow:none;

    }

    .testimonial-quote-icon{

        width:48px;
        height:48px;
        border-radius:14px;
        margin-bottom:16px;
        font-size:1.35rem;

    }

    .testimonial-featured-card h3{

        margin-bottom:14px;
        font-size:1.45rem;
        letter-spacing:0;

    }

    .testimonial-featured-card p{

        font-size:.9rem;
        line-height:1.55;

    }

    .testimonial-featured-user{

        margin-top:18px;
        gap:10px;

    }

    .testimonial-featured-user img{

        width:46px;
        height:46px;

    }

    .cta{

        padding:24px 18px;
        border-radius:22px;

    }

    .cta-actions{

        display:grid;
        grid-template-columns:1fr 1fr;
        gap:9px;

    }

    .cta-actions .btn{

        min-height:42px;
        padding:10px 12px;
        border-radius:13px;
        font-size:.82rem;

    }

}

@media(max-width:420px){

    .cta-actions{

        grid-template-columns:1fr;

    }

}