<?php
	defined( 'ABSPATH' ) || exit;
?>

<!-- Hero -->
<div class="dfy-hero">
	<div class="dfy-hero-left">
		<div class="dfy-hero-badge">
			<span class="dashicons dashicons-awards"></span>
			<?php esc_html_e( 'Free WooCommerce Discount Plugin', 'discountify' ); ?>
		</div>
		<h1 class="dfy-hero-title"><?php esc_html_e( 'Dynamic Pricing & Discount Rules to Boost Your Store Conversion', 'discountify' ); ?></h1>
		<p class="dfy-hero-desc"><?php esc_html_e( 'Create powerful discount rules for WooCommerce — percentage discounts, product-based pricing, tiered discounts, and more. No coding required.', 'discountify' ); ?></p>
		<div class="dfy-hero-stats">
			<div class="dfy-hero-stat">
				<strong>4.5 &#9733;</strong>
				<span><?php esc_html_e( 'Plugin Rating', 'discountify' ); ?></span>
			</div>
			<div class="dfy-hero-stat-sep"></div>
			<div class="dfy-hero-stat">
				<strong>100%</strong>
				<span><?php esc_html_e( 'Free to Use', 'discountify' ); ?></span>
			</div>
		</div>
		<div class="dfy-hero-actions">
			<a href="<?php echo esc_url( admin_url( 'admin.php?page=discountify-rules&rule=new-rule' ) ); ?>" class="dfy-btn-hero-primary">
				<span class="dashicons dashicons-plus-alt2"></span>
				<?php esc_html_e( 'Create Discount Rule', 'discountify' ); ?>
			</a>
			<a href="https://www.wpbens.com/plugins/discountify/" target="_blank" class="dfy-btn-hero-secondary">
				<?php esc_html_e( 'Explore Pro', 'discountify' ); ?>
				<span class="dashicons dashicons-arrow-right-alt"></span>
			</a>
		</div>
	</div>
	<div class="dfy-hero-right">
		<div class="dfy-discount-pill dfy-pill-1">
			<span class="dashicons dashicons-tag"></span>
			<?php esc_html_e( '50% OFF', 'discountify' ); ?>
		</div>
		<div class="dfy-discount-pill dfy-pill-2">
			<span class="dashicons dashicons-cart"></span>
			<?php esc_html_e( 'Buy 1 Get 1', 'discountify' ); ?>
		</div>
		<div class="dfy-discount-pill dfy-pill-3">
			<span class="dashicons dashicons-car"></span>
			<?php esc_html_e( 'Free Shipping', 'discountify' ); ?>
		</div>
		<svg viewBox="0 0 420 340" fill="none" xmlns="http://www.w3.org/2000/svg" class="dfy-hero-svg" aria-hidden="true">
			<!-- Background card -->
			<rect x="20" y="20" width="380" height="300" rx="24" fill="white" fill-opacity="0.12"/>
			<!-- Inner card -->
			<rect x="44" y="44" width="332" height="252" rx="16" fill="white" fill-opacity="0.18"/>

			<!-- Product card left -->
			<rect x="64" y="72" width="130" height="160" rx="12" fill="white" fill-opacity="0.95"/>
			<rect x="64" y="72" width="130" height="80" rx="12" fill="#3b6ef8" fill-opacity="0.18"/>
			<!-- Product icon -->
			<rect x="98" y="88" width="62" height="48" rx="8" fill="#3b6ef8" fill-opacity="0.25"/>
			<path d="M129 118 L118 108 L118 128 Z" fill="#3b6ef8" fill-opacity="0.7"/>
			<circle cx="129" cy="108" r="6" fill="#3b6ef8" fill-opacity="0.6"/>
			<!-- Product text lines -->
			<rect x="76" y="165" width="74" height="8" rx="4" fill="#c0cdf8"/>
			<rect x="76" y="179" width="50" height="7" rx="3" fill="#e0e6ff"/>
			<!-- Price original -->
			<rect x="76" y="198" width="38" height="7" rx="3" fill="#f87171" fill-opacity="0.6"/>
			<line x1="76" y1="202" x2="114" y2="202" stroke="#f87171" stroke-width="1.5" stroke-opacity="0.8"/>
			<!-- Price discounted -->
			<rect x="76" y="212" width="48" height="9" rx="4" fill="#22c55e" fill-opacity="0.85"/>

			<!-- Discount badge on product card -->
			<circle cx="178" cy="86" r="18" fill="#f59e0b"/>
			<text x="178" y="83" text-anchor="middle" font-family="Arial,sans-serif" font-size="9" font-weight="700" fill="white">30%</text>
			<text x="178" y="94" text-anchor="middle" font-family="Arial,sans-serif" font-size="8" font-weight="600" fill="white">OFF</text>

			<!-- Rules list card right -->
			<rect x="214" y="72" width="150" height="160" rx="12" fill="white" fill-opacity="0.95"/>
			<rect x="214" y="72" width="150" height="32" rx="12" fill="#3b6ef8" fill-opacity="0.15"/>
			<text x="228" y="92" font-family="Arial,sans-serif" font-size="10" font-weight="700" fill="#3b6ef8">Discount Rules</text>

			<!-- Rule rows -->
			<rect x="226" y="116" width="8" height="8" rx="2" fill="#22c55e"/>
			<rect x="240" y="118" width="64" height="5" rx="2" fill="#c0cdf8"/>
			<rect x="310" y="116" width="28" height="8" rx="4" fill="#22c55e" fill-opacity="0.25"/>
			<text x="317" y="123" font-family="Arial,sans-serif" font-size="7" fill="#16a34a">Active</text>

			<rect x="226" y="136" width="8" height="8" rx="2" fill="#f59e0b"/>
			<rect x="240" y="138" width="80" height="5" rx="2" fill="#c0cdf8"/>
			<rect x="310" y="136" width="28" height="8" rx="4" fill="#f59e0b" fill-opacity="0.25"/>
			<text x="317" y="143" font-family="Arial,sans-serif" font-size="7" fill="#b45309">Draft</text>

			<rect x="226" y="156" width="8" height="8" rx="2" fill="#22c55e"/>
			<rect x="240" y="158" width="56" height="5" rx="2" fill="#c0cdf8"/>
			<rect x="310" y="156" width="28" height="8" rx="4" fill="#22c55e" fill-opacity="0.25"/>
			<text x="317" y="163" font-family="Arial,sans-serif" font-size="7" fill="#16a34a">Active</text>

			<rect x="226" y="176" width="8" height="8" rx="2" fill="#22c55e"/>
			<rect x="240" y="178" width="72" height="5" rx="2" fill="#c0cdf8"/>
			<rect x="310" y="176" width="28" height="8" rx="4" fill="#22c55e" fill-opacity="0.25"/>
			<text x="317" y="183" font-family="Arial,sans-serif" font-size="7" fill="#16a34a">Active</text>

			<rect x="226" y="196" width="8" height="8" rx="2" fill="#f87171"/>
			<rect x="240" y="198" width="50" height="5" rx="2" fill="#c0cdf8"/>
			<rect x="310" y="196" width="28" height="8" rx="4" fill="#f87171" fill-opacity="0.2"/>
			<text x="316" y="203" font-family="Arial,sans-serif" font-size="7" fill="#dc2626">Paused</text>

			<!-- Bottom stat bar -->
			<rect x="64" y="248" width="130" height="34" rx="10" fill="white" fill-opacity="0.9"/>
			<text x="80" y="263" font-family="Arial,sans-serif" font-size="8" fill="#6b7280">Total Saved</text>
			<text x="80" y="276" font-family="Arial,sans-serif" font-size="11" font-weight="700" fill="#3b6ef8">$4,280</text>
			<rect x="170" y="255" width="14" height="14" rx="7" fill="#22c55e" fill-opacity="0.2"/>
			<text x="174" y="265" font-family="Arial,sans-serif" font-size="9" fill="#16a34a">↑</text>

			<rect x="214" y="248" width="150" height="34" rx="10" fill="white" fill-opacity="0.9"/>
			<text x="230" y="263" font-family="Arial,sans-serif" font-size="8" fill="#6b7280">Rules Active</text>
			<text x="230" y="276" font-family="Arial,sans-serif" font-size="11" font-weight="700" fill="#3b6ef8">12 Rules</text>
			<rect x="342" y="255" width="14" height="14" rx="7" fill="#3b6ef8" fill-opacity="0.15"/>
			<text x="346" y="265" font-family="Arial,sans-serif" font-size="9" fill="#3b6ef8">✓</text>
		</svg>
	</div>
</div>

<div class="dfy-overview-body">

	<!-- Features Grid -->
	<div class="dfy-features">
		<div class="dfy-section-label"><?php esc_html_e( 'FEATURES', 'discountify' ); ?></div>
		<h2 class="dfy-section-title"><?php esc_html_e( 'Advanced Discount Features', 'discountify' ); ?></h2>
		<p class="dfy-section-subtitle"><?php esc_html_e( 'Everything you need to run powerful discount campaigns on your WooCommerce store.', 'discountify' ); ?></p>

		<div class="dfy-features-grid">
			<div class="dfy-feature-card">
				<span class="dfy-feat-icon dashicons dashicons-store"></span>
				<h3><?php esc_html_e( 'Storewide Discount', 'discountify' ); ?></h3>
				<p><?php esc_html_e( 'Apply a percentage or fixed discount across all products in your store instantly.', 'discountify' ); ?></p>
			</div>
			<div class="dfy-feature-card">
				<span class="dfy-feat-icon dashicons dashicons-cart"></span>
				<h3><?php esc_html_e( 'Buy X Get Y', 'discountify' ); ?></h3>
				<p><?php esc_html_e( 'Give customers a free or discounted product when they purchase a specific quantity.', 'discountify' ); ?></p>
			</div>
			<div class="dfy-feature-card">
				<span class="dfy-feat-icon dashicons dashicons-image-filter"></span>
				<h3><?php esc_html_e( 'Buy 1 Get 1 Free', 'discountify' ); ?></h3>
				<p><?php esc_html_e( 'Classic BOGO deals — buy one item and get another one completely free.', 'discountify' ); ?></p>
			</div>
			<div class="dfy-feature-card">
				<span class="dfy-feat-icon dashicons dashicons-buddicons-groups"></span>
				<h3><?php esc_html_e( 'Free Product or Gift', 'discountify' ); ?></h3>
				<p><?php esc_html_e( 'Automatically add a free gift product to the cart when set conditions are met.', 'discountify' ); ?></p>
			</div>
			<div class="dfy-feature-card">
				<span class="dfy-feat-icon dashicons dashicons-admin-page"></span>
				<h3><?php esc_html_e( 'Conditional Discounts', 'discountify' ); ?></h3>
				<p><?php esc_html_e( 'Apply discounts based on user roles, cart contents, purchase history, and more.', 'discountify' ); ?></p>
			</div>
			<div class="dfy-feature-card">
				<span class="dfy-feat-icon dashicons dashicons-superhero-alt"></span>
				<h3><?php esc_html_e( 'Buy 2 Get 1 at 50% OFF', 'discountify' ); ?></h3>
				<p><?php esc_html_e( 'Flexible quantity-based discounts with fully customizable percentage savings.', 'discountify' ); ?></p>
			</div>
			<div class="dfy-feature-card">
				<span class="dfy-feat-icon dashicons dashicons-awards"></span>
				<h3><?php esc_html_e( 'Free Shipping on Condition', 'discountify' ); ?></h3>
				<p><?php esc_html_e( 'Unlock free shipping for orders that meet your custom-defined requirements.', 'discountify' ); ?></p>
			</div>
			<div class="dfy-feature-card">
				<span class="dfy-feat-icon dashicons dashicons-star-filled"></span>
				<h3><?php esc_html_e( 'Customer Specific Pricing', 'discountify' ); ?></h3>
				<p><?php esc_html_e( 'Offer special pricing to individual customers, user roles, or membership tiers.', 'discountify' ); ?></p>
			</div>
			<div class="dfy-feature-card">
				<span class="dfy-feat-icon dashicons dashicons-chart-area"></span>
				<h3><?php esc_html_e( 'Discount on Purchase History', 'discountify' ); ?></h3>
				<p><?php esc_html_e( 'Reward loyal customers with special pricing based on their past order history.', 'discountify' ); ?></p>
			</div>
			<div class="dfy-feature-card">
				<span class="dfy-feat-icon dashicons dashicons-rest-api"></span>
				<h3><?php esc_html_e( 'Discount on Cart Total', 'discountify' ); ?></h3>
				<p><?php esc_html_e( 'Automatically trigger discounts when the cart value reaches a set threshold.', 'discountify' ); ?></p>
			</div>
		</div>
	</div>

	<!-- CTA Banner -->
	<div class="dfy-cta-banner">
		<div class="dfy-cta-content">
			<div class="dfy-cta-badge"><?php esc_html_e( 'UPGRADE TODAY', 'discountify' ); ?></div>
			<h2><?php esc_html_e( 'Ready to unlock advanced discount strategies?', 'discountify' ); ?></h2>
			<p><?php esc_html_e( 'Join thousands of store owners who use Discountify Pro to drive more sales with powerful, flexible pricing rules.', 'discountify' ); ?></p>
			<a href="https://www.wpbens.com/plugins/discountify/" target="_blank" class="dfy-cta-btn">
				<?php esc_html_e( 'Get Discountify Pro', 'discountify' ); ?>
				<span class="dashicons dashicons-arrow-right-alt"></span>
			</a>
		</div>
	</div>

	<!-- More Plugins -->
	<div class="dfy-more-plugins">
		<div class="dfy-section-label"><?php esc_html_e( 'BY THE SAME TEAM', 'discountify' ); ?></div>
		<h2 class="dfy-section-title"><?php esc_html_e( 'More Plugins to Grow Your Store', 'discountify' ); ?></h2>
		<p class="dfy-section-subtitle"><?php esc_html_e( 'Powerful WooCommerce and WordPress solutions built by the same team.', 'discountify' ); ?></p>

		<div class="dfy-plugin-cards">

			<div class="dfy-plugin-card">
				<div class="dfy-plugin-img">
					<img src="<?php echo esc_url( Discountify::assets_url() . 'images/plugin-logo-memberhub.gif' ); ?>"
						alt="<?php esc_attr_e( 'MemberHub', 'discountify' ); ?>"/>
				</div>
				<div class="dfy-plugin-info">
					<h3><a href="https://wpbens.com/plugins/memberhub/" target="_blank"><?php esc_html_e( 'MemberHub', 'discountify' ); ?></a></h3>
					<p><?php esc_html_e( 'Transform your site into a membership platform — restrict content, manage subscriptions, and offer member-exclusive pricing.', 'discountify' ); ?></p>
					<div class="dfy-plugin-btns">
						<a class="dfy-btn-outline" href="https://wordpress.org/plugins/memberhub/" target="_blank"><?php esc_html_e( 'Free', 'discountify' ); ?></a>
						<a class="dfy-btn-filled" href="https://wpbens.com/plugins/memberhub/" target="_blank"><?php esc_html_e( 'Premium', 'discountify' ); ?></a>
					</div>
				</div>
			</div>

			<div class="dfy-plugin-card">
				<div class="dfy-plugin-img">
					<img src="<?php echo esc_url( Discountify::assets_url() . 'images/plugin-logo-mailerhub.png' ); ?>"
						alt="<?php esc_attr_e( 'MailerHub', 'discountify' ); ?>"/>
				</div>
				<div class="dfy-plugin-info">
					<h3><a href="https://wpbens.com/plugins/mailerhub/" target="_blank"><?php esc_html_e( 'MailerHub', 'discountify' ); ?></a></h3>
					<p><?php esc_html_e( 'All-in-one Email Marketing & CRM — send campaigns, automate sequences, manage contacts, and grow your list.', 'discountify' ); ?></p>
					<div class="dfy-plugin-btns">
						<a class="dfy-btn-outline" href="https://wordpress.org/plugins/bens-email-marketing-automation/" target="_blank"><?php esc_html_e( 'Free', 'discountify' ); ?></a>
						<a class="dfy-btn-filled" href="https://wpbens.com/plugins/mailerhub/" target="_blank"><?php esc_html_e( 'Premium', 'discountify' ); ?></a>
					</div>
				</div>
			</div>

			<div class="dfy-plugin-card">
				<div class="dfy-plugin-img">
					<img src="<?php echo esc_url( Discountify::assets_url() . 'images/plugin-logo-filter-plus.gif' ); ?>"
						alt="<?php esc_attr_e( 'Filter Plus', 'discountify' ); ?>"/>
				</div>
				<div class="dfy-plugin-info">
					<h3><a href="https://wpbens.com/plugins/filter-plus/" target="_blank"><?php esc_html_e( 'Filter Plus', 'discountify' ); ?></a></h3>
					<p><?php esc_html_e( 'Advanced product & content filtering for WooCommerce and WordPress — by price, rating, category, tags, and more.', 'discountify' ); ?></p>
					<div class="dfy-plugin-btns">
						<a class="dfy-btn-outline" href="https://wordpress.org/plugins/filter-plus/" target="_blank"><?php esc_html_e( 'Free', 'discountify' ); ?></a>
						<a class="dfy-btn-filled" href="https://wpbens.com/plugins/filter-plus/" target="_blank"><?php esc_html_e( 'Premium', 'discountify' ); ?></a>
					</div>
				</div>
			</div>

			<div class="dfy-plugin-card">
				<div class="dfy-plugin-img">
					<img src="<?php echo esc_url( Discountify::assets_url() . 'images/plugin-logo-quicker.gif' ); ?>"
						alt="<?php esc_attr_e( 'Quicker', 'discountify' ); ?>"/>
				</div>
				<div class="dfy-plugin-info">
					<h3><a href="https://wpbens.com/plugins/quicker/" target="_blank"><?php esc_html_e( 'Quicker', 'discountify' ); ?></a></h3>
					<p><?php esc_html_e( 'Speed up conversions and reduce cart abandonment with fast checkout, order bumps, upsells, and custom fees.', 'discountify' ); ?></p>
					<div class="dfy-plugin-btns">
						<a class="dfy-btn-outline" href="https://wordpress.org/plugins/quicker/" target="_blank"><?php esc_html_e( 'Free', 'discountify' ); ?></a>
						<a class="dfy-btn-filled" href="https://wpbens.com/plugins/quicker/" target="_blank"><?php esc_html_e( 'Premium', 'discountify' ); ?></a>
					</div>
				</div>
			</div>

			<div class="dfy-plugin-card">
				<div class="dfy-plugin-img">
					<img src="<?php echo esc_url( Discountify::assets_url() . 'images/plugin-logo-discountify.gif' ); ?>"
						alt="<?php esc_attr_e( 'Discountify', 'discountify' ); ?>"/>
				</div>
				<div class="dfy-plugin-info">
					<h3><a href="https://wpbens.com/plugins/discountify/" target="_blank"><?php esc_html_e( 'Discountify', 'discountify' ); ?></a></h3>
					<p><?php esc_html_e( 'Dynamic pricing and discount rules for WooCommerce — percentage, fixed, BOGO, tiered, and conditional discounts.', 'discountify' ); ?></p>
					<div class="dfy-plugin-btns">
						<a class="dfy-btn-outline" href="https://wordpress.org/plugins/discountify/" target="_blank"><?php esc_html_e( 'Free', 'discountify' ); ?></a>
						<a class="dfy-btn-filled" href="https://wpbens.com/plugins/discountify/" target="_blank"><?php esc_html_e( 'Premium', 'discountify' ); ?></a>
					</div>
				</div>
			</div>

		</div>
	</div>

</div>
