Qwen Qwen3.7 Plus – Shopping

via Alibaba · Generated

  • AIMAC Debt 17.25
  • Cost $0.025
  • Total Violations 22
  • HTML Size 72 KB
  • Em Dashes 16

Screenshot

View Qwen Qwen3.7 Plus Shopping page View Live Page

Accessibility Issues Found

4 Critical 18 Serious

  • color-contrast serious 18 instances

    Elements must meet minimum color contrast ratio thresholds

    Example HTML <span class="section-label">Curated For You</span>
  • select-name critical 4 instances

    Select element must have an accessible name

    Example HTML <select id="sizeCategory">

Artifacts

View Generated HTML
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Cartwell — Curated Finds, Unbeatable Prices</title>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Playfair+Display:wght@400;500;600;700&display=swap" rel="stylesheet">
    <style>
        :root {
            --primary: #1a1a2e;
            --accent: #e63946;
            --accent-hover: #c1121f;
            --secondary: #f4a261;
            --bg: #fafafa;
            --card-bg: #ffffff;
            --text: #2b2b2b;
            --text-light: #6b7280;
            --border: #e5e7eb;
            --success: #10b981;
            --gold: #c9a96e;
            --shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
            --shadow-md: 0 4px 12px rgba(0,0,0,0.1);
            --shadow-lg: 0 10px 40px rgba(0,0,0,0.12);
            --shadow-xl: 0 20px 60px rgba(0,0,0,0.15);
            --radius: 12px;
            --radius-lg: 20px;
            --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }

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

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

        /* Typography */
        h1, h2, h3, h4, h5 {
            font-family: 'Playfair Display', serif;
            line-height: 1.2;
        }

        /* Utility */
        .container {
            max-width: 1280px;
            margin: 0 auto;
            padding: 0 24px;
        }

        .section-label {
            font-family: 'Inter', sans-serif;
            font-size: 0.75rem;
            font-weight: 700;
            letter-spacing: 3px;
            text-transform: uppercase;
            color: var(--accent);
            margin-bottom: 12px;
            display: inline-block;
        }

        .section-title {
            font-size: clamp(2rem, 4vw, 3rem);
            color: var(--primary);
            margin-bottom: 16px;
        }

        .section-subtitle {
            font-size: 1.1rem;
            color: var(--text-light);
            max-width: 600px;
            line-height: 1.8;
        }

        /* Announcement Bar */
        .announcement-bar {
            background: var(--primary);
            color: white;
            text-align: center;
            padding: 10px 24px;
            font-size: 0.85rem;
            font-weight: 500;
            letter-spacing: 0.5px;
        }

        .announcement-bar span {
            color: var(--secondary);
            font-weight: 700;
        }

        /* Header */
        .header {
            background: var(--card-bg);
            border-bottom: 1px solid var(--border);
            position: sticky;
            top: 0;
            z-index: 1000;
            backdrop-filter: blur(20px);
            background: rgba(255,255,255,0.95);
        }

        .header-inner {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 16px 24px;
            max-width: 1280px;
            margin: 0 auto;
        }

        .logo-area {
            display: flex;
            align-items: center;
            gap: 12px;
        }

        .logo-area img {
            width: 42px;
            height: 42px;
            border-radius: 10px;
        }

        .logo-text h1 {
            font-size: 1.5rem;
            color: var(--primary);
            font-family: 'Playfair Display', serif;
            line-height: 1;
        }

        .logo-text p {
            font-size: 0.7rem;
            color: var(--text-light);
            letter-spacing: 1.5px;
            text-transform: uppercase;
            font-weight: 500;
        }

        .nav {
            display: flex;
            align-items: center;
            gap: 32px;
        }

        .nav a {
            text-decoration: none;
            color: var(--text);
            font-size: 0.9rem;
            font-weight: 500;
            transition: var(--transition);
            position: relative;
        }

        .nav a:hover {
            color: var(--accent);
        }

        .nav a::after {
            content: '';
            position: absolute;
            bottom: -4px;
            left: 0;
            width: 0;
            height: 2px;
            background: var(--accent);
            transition: var(--transition);
        }

        .nav a:hover::after {
            width: 100%;
        }

        .header-actions {
            display: flex;
            align-items: center;
            gap: 16px;
        }

        .header-actions button {
            background: none;
            border: none;
            cursor: pointer;
            font-size: 1.2rem;
            color: var(--text);
            transition: var(--transition);
            position: relative;
        }

        .header-actions button:hover {
            color: var(--accent);
        }

        .cart-count {
            position: absolute;
            top: -6px;
            right: -8px;
            background: var(--accent);
            color: white;
            font-size: 0.65rem;
            width: 18px;
            height: 18px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-weight: 700;
        }

        .btn {
            display: inline-flex;
            align-items: center;
            gap: 8px;
            padding: 12px 28px;
            border-radius: 50px;
            font-size: 0.9rem;
            font-weight: 600;
            text-decoration: none;
            transition: var(--transition);
            cursor: pointer;
            border: none;
            font-family: 'Inter', sans-serif;
        }

        .btn-primary {
            background: var(--accent);
            color: white;
        }

        .btn-primary:hover {
            background: var(--accent-hover);
            transform: translateY(-2px);
            box-shadow: 0 8px 25px rgba(230, 57, 70, 0.3);
        }

        .btn-secondary {
            background: var(--primary);
            color: white;
        }

        .btn-secondary:hover {
            background: #2d2d4e;
            transform: translateY(-2px);
            box-shadow: 0 8px 25px rgba(26, 26, 46, 0.3);
        }

        .btn-outline {
            background: transparent;
            color: var(--primary);
            border: 2px solid var(--primary);
        }

        .btn-outline:hover {
            background: var(--primary);
            color: white;
            transform: translateY(-2px);
        }

        .btn-ghost {
            background: rgba(255,255,255,0.15);
            color: white;
            border: 1px solid rgba(255,255,255,0.3);
        }

        .btn-ghost:hover {
            background: rgba(255,255,255,0.25);
            transform: translateY(-2px);
        }

        /* Hero Section */
        .hero {
            background: linear-gradient(135deg, var(--primary) 0%, #16213e 50%, #0f3460 100%);
            padding: 80px 0;
            position: relative;
            overflow: hidden;
        }

        .hero::before {
            content: '';
            position: absolute;
            top: -50%;
            right: -20%;
            width: 600px;
            height: 600px;
            background: radial-gradient(circle, rgba(230,57,70,0.15) 0%, transparent 70%);
            border-radius: 50%;
        }

        .hero::after {
            content: '';
            position: absolute;
            bottom: -30%;
            left: -10%;
            width: 400px;
            height: 400px;
            background: radial-gradient(circle, rgba(244,162,97,0.1) 0%, transparent 70%);
            border-radius: 50%;
        }

        .hero-grid {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 60px;
            align-items: center;
            position: relative;
            z-index: 1;
        }

        .hero-content h2 {
            font-size: clamp(2.5rem, 5vw, 4rem);
            color: white;
            margin-bottom: 24px;
            line-height: 1.1;
        }

        .hero-content h2 em {
            color: var(--secondary);
            font-style: normal;
        }

        .hero-content p {
            font-size: 1.15rem;
            color: rgba(255,255,255,0.75);
            margin-bottom: 36px;
            line-height: 1.8;
            max-width: 500px;
        }

        .hero-buttons {
            display: flex;
            gap: 16px;
            flex-wrap: wrap;
        }

        .hero-stats {
            display: flex;
            gap: 40px;
            margin-top: 48px;
            padding-top: 32px;
            border-top: 1px solid rgba(255,255,255,0.1);
        }

        .hero-stat h3 {
            font-size: 2rem;
            color: white;
            font-family: 'Inter', sans-serif;
            font-weight: 800;
        }

        .hero-stat p {
            font-size: 0.85rem;
            color: rgba(255,255,255,0.6);
            margin-bottom: 0;
        }

        .hero-image {
            position: relative;
        }

        .hero-image img {
            width: 100%;
            border-radius: var(--radius-lg);
            box-shadow: var(--shadow-xl);
        }

        .hero-badge {
            position: absolute;
            top: 20px;
            right: 20px;
            background: var(--accent);
            color: white;
            padding: 12px 20px;
            border-radius: 50px;
            font-weight: 700;
            font-size: 0.9rem;
            box-shadow: 0 4px 15px rgba(230,57,70,0.4);
            animation: pulse 2s infinite;
        }

        @keyframes pulse {
            0%, 100% { transform: scale(1); }
            50% { transform: scale(1.05); }
        }

        /* Trust Bar */
        .trust-bar {
            background: var(--card-bg);
            padding: 32px 0;
            border-bottom: 1px solid var(--border);
        }

        .trust-items {
            display: flex;
            justify-content: space-around;
            align-items: center;
            flex-wrap: wrap;
            gap: 24px;
        }

        .trust-item {
            display: flex;
            align-items: center;
            gap: 12px;
        }

        .trust-item .icon {
            width: 44px;
            height: 44px;
            background: linear-gradient(135deg, rgba(230,57,70,0.1), rgba(244,162,97,0.1));
            border-radius: 12px;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.2rem;
        }

        .trust-item p {
            font-size: 0.85rem;
            font-weight: 600;
            color: var(--text);
        }

        .trust-item span {
            font-size: 0.75rem;
            color: var(--text-light);
        }

        /* Gift Guides Section */
        .gift-guides {
            padding: 100px 0;
        }

        .gift-guides-header {
            text-align: center;
            margin-bottom: 60px;
        }

        .gift-guides-header .section-subtitle {
            margin: 0 auto;
        }

        .guides-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 32px;
        }

        .guide-card {
            background: var(--card-bg);
            border-radius: var(--radius-lg);
            overflow: hidden;
            box-shadow: var(--shadow-sm);
            transition: var(--transition);
            border: 1px solid var(--border);
        }

        .guide-card:hover {
            transform: translateY(-8px);
            box-shadow: var(--shadow-lg);
        }

        .guide-card img {
            width: 100%;
            height: 220px;
            object-fit: cover;
        }

        .guide-card-body {
            padding: 28px;
        }

        .guide-card-body .tag {
            display: inline-block;
            background: rgba(230,57,70,0.1);
            color: var(--accent);
            padding: 4px 12px;
            border-radius: 20px;
            font-size: 0.75rem;
            font-weight: 600;
            margin-bottom: 12px;
        }

        .guide-card-body h3 {
            font-size: 1.3rem;
            margin-bottom: 12px;
            color: var(--primary);
        }

        .guide-card-body p {
            font-size: 0.9rem;
            color: var(--text-light);
            line-height: 1.7;
            margin-bottom: 20px;
        }

        .guide-card-body .guide-meta {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding-top: 16px;
            border-top: 1px solid var(--border);
        }

        .guide-card-body .guide-meta span {
            font-size: 0.8rem;
            color: var(--text-light);
        }

        .guide-card-body .guide-meta a {
            color: var(--accent);
            font-weight: 600;
            font-size: 0.85rem;
            text-decoration: none;
            transition: var(--transition);
        }

        .guide-card-body .guide-meta a:hover {
            text-decoration: underline;
        }

        /* Top Rated Section */
        .top-rated {
            padding: 100px 0;
            background: linear-gradient(180deg, #f8f6f3 0%, var(--bg) 100%);
        }

        .top-rated-header {
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
            margin-bottom: 48px;
            flex-wrap: wrap;
            gap: 24px;
        }

        .products-grid {
            display: grid;
            grid-template-columns: repeat(4, 1fr);
            gap: 24px;
        }

        .product-card {
            background: var(--card-bg);
            border-radius: var(--radius);
            overflow: hidden;
            box-shadow: var(--shadow-sm);
            transition: var(--transition);
            border: 1px solid var(--border);
            position: relative;
        }

        .product-card:hover {
            transform: translateY(-4px);
            box-shadow: var(--shadow-md);
        }

        .product-card .product-badge {
            position: absolute;
            top: 12px;
            left: 12px;
            background: var(--accent);
            color: white;
            padding: 4px 10px;
            border-radius: 6px;
            font-size: 0.7rem;
            font-weight: 700;
            z-index: 2;
        }

        .product-card .product-badge.new {
            background: var(--success);
        }

        .product-card .product-badge.sale {
            background: var(--accent);
        }

        .product-card .wishlist-btn {
            position: absolute;
            top: 12px;
            right: 12px;
            width: 36px;
            height: 36px;
            background: white;
            border: none;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            box-shadow: var(--shadow-sm);
            transition: var(--transition);
            z-index: 2;
            font-size: 1rem;
        }

        .product-card .wishlist-btn:hover {
            background: var(--accent);
            color: white;
            transform: scale(1.1);
        }

        .product-card img {
            width: 100%;
            height: 240px;
            object-fit: cover;
        }

        .product-card-body {
            padding: 20px;
        }

        .product-card-body .product-category {
            font-size: 0.75rem;
            color: var(--text-light);
            text-transform: uppercase;
            letter-spacing: 1px;
            margin-bottom: 6px;
        }

        .product-card-body h4 {
            font-size: 1rem;
            font-family: 'Inter', sans-serif;
            font-weight: 600;
            margin-bottom: 8px;
            color: var(--primary);
        }

        .product-card-body .rating {
            display: flex;
            align-items: center;
            gap: 6px;
            margin-bottom: 12px;
        }

        .product-card-body .rating .stars {
            color: #fbbf24;
            font-size: 0.85rem;
        }

        .product-card-body .rating span {
            font-size: 0.8rem;
            color: var(--text-light);
        }

        .product-card-body .price {
            display: flex;
            align-items: center;
            gap: 10px;
            margin-bottom: 16px;
        }

        .product-card-body .price .current {
            font-size: 1.2rem;
            font-weight: 700;
            color: var(--primary);
        }

        .product-card-body .price .original {
            font-size: 0.9rem;
            color: var(--text-light);
            text-decoration: line-through;
        }

        .product-card-body .price .sku {
            font-size: 0.7rem;
            color: var(--text-light);
            margin-left: auto;
        }

        .quick-view-btn {
            width: 100%;
            padding: 10px;
            background: var(--primary);
            color: white;
            border: none;
            border-radius: 8px;
            font-size: 0.85rem;
            font-weight: 600;
            cursor: pointer;
            transition: var(--transition);
            font-family: 'Inter', sans-serif;
        }

        .quick-view-btn:hover {
            background: var(--accent);
        }

        /* Customer Favorites / Deals Section */
        .deals-section {
            padding: 100px 0;
        }

        .deals-grid {
            display: grid;
            grid-template-columns: 2fr 1fr;
            gap: 32px;
        }

        .deal-featured {
            background: linear-gradient(135deg, var(--primary) 0%, #16213e 100%);
            border-radius: var(--radius-lg);
            padding: 48px;
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 40px;
            align-items: center;
            position: relative;
            overflow: hidden;
        }

        .deal-featured::before {
            content: '';
            position: absolute;
            top: -50%;
            right: -30%;
            width: 400px;
            height: 400px;
            background: radial-gradient(circle, rgba(244,162,97,0.2) 0%, transparent 70%);
            border-radius: 50%;
        }

        .deal-featured-content {
            position: relative;
            z-index: 1;
        }

        .deal-featured-content .deal-tag {
            display: inline-block;
            background: var(--secondary);
            color: var(--primary);
            padding: 6px 14px;
            border-radius: 20px;
            font-size: 0.75rem;
            font-weight: 700;
            margin-bottom: 20px;
            text-transform: uppercase;
            letter-spacing: 1px;
        }

        .deal-featured-content h3 {
            font-size: 2rem;
            color: white;
            margin-bottom: 16px;
        }

        .deal-featured-content p {
            color: rgba(255,255,255,0.7);
            margin-bottom: 24px;
            line-height: 1.7;
        }

        .deal-featured-content .deal-price {
            display: flex;
            align-items: baseline;
            gap: 12px;
            margin-bottom: 24px;
        }

        .deal-featured-content .deal-price .now {
            font-size: 2.5rem;
            font-weight: 800;
            color: var(--secondary);
            font-family: 'Inter', sans-serif;
        }

        .deal-featured-content .deal-price .was {
            font-size: 1.2rem;
            color: rgba(255,255,255,0.5);
            text-decoration: line-through;
        }

        .deal-featured-image img {
            width: 100%;
            border-radius: var(--radius);
            box-shadow: var(--shadow-lg);
            position: relative;
            z-index: 1;
        }

        .deals-sidebar {
            display: flex;
            flex-direction: column;
            gap: 20px;
        }

        .deal-card-sm {
            background: var(--card-bg);
            border-radius: var(--radius);
            padding: 20px;
            border: 1px solid var(--border);
            transition: var(--transition);
            display: flex;
            gap: 16px;
            align-items: center;
        }

        .deal-card-sm:hover {
            box-shadow: var(--shadow-md);
            transform: translateX(4px);
        }

        .deal-card-sm img {
            width: 72px;
            height: 72px;
            border-radius: 10px;
            object-fit: cover;
            flex-shrink: 0;
        }

        .deal-card-sm-info h4 {
            font-family: 'Inter', sans-serif;
            font-size: 0.9rem;
            font-weight: 600;
            margin-bottom: 4px;
        }

        .deal-card-sm-info .deal-discount {
            font-size: 0.8rem;
            color: var(--accent);
            font-weight: 700;
        }

        .deal-card-sm-info .deal-timer {
            font-size: 0.75rem;
            color: var(--text-light);
            margin-top: 4px;
        }

        /* Size Guide Interactive Section */
        .size-guide-section {
            padding: 80px 0;
            background: linear-gradient(135deg, #f8f6f3 0%, #fef9ef 100%);
        }

        .size-guide-wrapper {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 60px;
            align-items: center;
        }

        .size-guide-content h2 {
            font-size: 2.2rem;
            margin-bottom: 16px;
            color: var(--primary);
        }

        .size-guide-content p {
            color: var(--text-light);
            margin-bottom: 24px;
            line-height: 1.8;
        }

        .size-guide-tool {
            background: var(--card-bg);
            border-radius: var(--radius-lg);
            padding: 36px;
            box-shadow: var(--shadow-md);
            border: 1px solid var(--border);
        }

        .size-guide-tool h4 {
            font-family: 'Inter', sans-serif;
            font-size: 1rem;
            font-weight: 700;
            margin-bottom: 20px;
            color: var(--primary);
        }

        .size-input-group {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 16px;
            margin-bottom: 20px;
        }

        .size-input-group label {
            font-size: 0.8rem;
            font-weight: 600;
            color: var(--text);
            margin-bottom: 6px;
            display: block;
        }

        .size-input-group select,
        .size-input-group input {
            width: 100%;
            padding: 12px 16px;
            border: 1px solid var(--border);
            border-radius: 8px;
            font-size: 0.9rem;
            font-family: 'Inter', sans-serif;
            transition: var(--transition);
            background: var(--bg);
        }

        .size-input-group select:focus,
        .size-input-group input:focus {
            outline: none;
            border-color: var(--accent);
            box-shadow: 0 0 0 3px rgba(230,57,70,0.1);
        }

        .size-result {
            background: linear-gradient(135deg, rgba(230,57,70,0.05), rgba(244,162,97,0.05));
            border: 1px solid rgba(230,57,70,0.2);
            border-radius: 12px;
            padding: 20px;
            text-align: center;
            display: none;
        }

        .size-result.active {
            display: block;
        }

        .size-result .recommended-size {
            font-size: 2rem;
            font-weight: 800;
            color: var(--accent);
            margin-bottom: 4px;
        }

        .size-result p {
            font-size: 0.85rem;
            color: var(--text-light);
            margin-bottom: 0;
        }

        /* Testimonials */
        .testimonials {
            padding: 100px 0;
        }

        .testimonials-header {
            text-align: center;
            margin-bottom: 60px;
        }

        .testimonials-header .section-subtitle {
            margin: 0 auto;
        }

        .testimonials-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 28px;
        }

        .testimonial-card {
            background: var(--card-bg);
            border-radius: var(--radius-lg);
            padding: 32px;
            border: 1px solid var(--border);
            transition: var(--transition);
            position: relative;
        }

        .testimonial-card:hover {
            box-shadow: var(--shadow-md);
            transform: translateY(-4px);
        }

        .testimonial-card .quote-icon {
            font-size: 2.5rem;
            color: rgba(230,57,70,0.15);
            margin-bottom: 16px;
            line-height: 1;
        }

        .testimonial-card p {
            font-size: 0.95rem;
            color: var(--text);
            line-height: 1.8;
            margin-bottom: 24px;
            font-style: italic;
        }

        .testimonial-card .reviewer {
            display: flex;
            align-items: center;
            gap: 12px;
        }

        .testimonial-card .reviewer img {
            width: 44px;
            height: 44px;
            border-radius: 50%;
            object-fit: cover;
        }

        .testimonial-card .reviewer-info h5 {
            font-family: 'Inter', sans-serif;
            font-size: 0.9rem;
            font-weight: 600;
        }

        .testimonial-card .reviewer-info span {
            font-size: 0.8rem;
            color: var(--text-light);
        }

        .testimonial-card .review-stars {
            color: #fbbf24;
            font-size: 0.9rem;
            margin-bottom: 16px;
        }

        /* FAQ Section */
        .faq-section {
            padding: 80px 0;
            background: var(--card-bg);
            border-top: 1px solid var(--border);
            border-bottom: 1px solid var(--border);
        }

        .faq-header {
            text-align: center;
            margin-bottom: 48px;
        }

        .faq-container {
            max-width: 760px;
            margin: 0 auto;
        }

        .faq-item {
            border: 1px solid var(--border);
            border-radius: var(--radius);
            margin-bottom: 12px;
            overflow: hidden;
            transition: var(--transition);
        }

        .faq-item:hover {
            border-color: var(--accent);
        }

        .faq-question {
            width: 100%;
            padding: 20px 24px;
            background: none;
            border: none;
            text-align: left;
            font-size: 1rem;
            font-weight: 600;
            color: var(--primary);
            cursor: pointer;
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-family: 'Inter', sans-serif;
            transition: var(--transition);
        }

        .faq-question:hover {
            color: var(--accent);
        }

        .faq-question .faq-icon {
            font-size: 1.2rem;
            transition: var(--transition);
            flex-shrink: 0;
            margin-left: 16px;
        }

        .faq-item.active .faq-icon {
            transform: rotate(45deg);
        }

        .faq-answer {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.4s ease, padding 0.4s ease;
        }

        .faq-item.active .faq-answer {
            max-height: 300px;
            padding: 0 24px 20px;
        }

        .faq-answer p {
            font-size: 0.9rem;
            color: var(--text-light);
            line-height: 1.8;
        }

        /* Newsletter */
        .newsletter {
            padding: 80px 0;
            background: linear-gradient(135deg, var(--primary) 0%, #16213e 100%);
            text-align: center;
            position: relative;
            overflow: hidden;
        }

        .newsletter::before {
            content: '';
            position: absolute;
            top: -50%;
            left: 50%;
            transform: translateX(-50%);
            width: 800px;
            height: 800px;
            background: radial-gradient(circle, rgba(230,57,70,0.1) 0%, transparent 60%);
            border-radius: 50%;
        }

        .newsletter-content {
            position: relative;
            z-index: 1;
        }

        .newsletter h2 {
            font-size: 2.5rem;
            color: white;
            margin-bottom: 16px;
        }

        .newsletter p {
            color: rgba(255,255,255,0.7);
            font-size: 1.1rem;
            margin-bottom: 36px;
            max-width: 500px;
            margin-left: auto;
            margin-right: auto;
        }

        .newsletter-form {
            display: flex;
            gap: 12px;
            max-width: 480px;
            margin: 0 auto;
        }

        .newsletter-form input {
            flex: 1;
            padding: 16px 24px;
            border: 1px solid rgba(255,255,255,0.2);
            border-radius: 50px;
            background: rgba(255,255,255,0.1);
            color: white;
            font-size: 0.95rem;
            font-family: 'Inter', sans-serif;
            transition: var(--transition);
        }

        .newsletter-form input::placeholder {
            color: rgba(255,255,255,0.5);
        }

        .newsletter-form input:focus {
            outline: none;
            border-color: var(--secondary);
            background: rgba(255,255,255,0.15);
        }

        .newsletter-form button {
            padding: 16px 32px;
            background: var(--accent);
            color: white;
            border: none;
            border-radius: 50px;
            font-size: 0.9rem;
            font-weight: 700;
            cursor: pointer;
            transition: var(--transition);
            font-family: 'Inter', sans-serif;
            white-space: nowrap;
        }

        .newsletter-form button:hover {
            background: var(--accent-hover);
            transform: translateY(-2px);
            box-shadow: 0 8px 25px rgba(230,57,70,0.4);
        }

        .newsletter-perks {
            display: flex;
            justify-content: center;
            gap: 32px;
            margin-top: 24px;
            flex-wrap: wrap;
        }

        .newsletter-perks span {
            color: rgba(255,255,255,0.6);
            font-size: 0.8rem;
            display: flex;
            align-items: center;
            gap: 6px;
        }

        .newsletter-perks span::before {
            content: '✓';
            color: var(--success);
            font-weight: 700;
        }

        /* Footer */
        .footer {
            background: #0d0d1a;
            color: rgba(255,255,255,0.7);
            padding: 80px 0 0;
        }

        .footer-grid {
            display: grid;
            grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
            gap: 40px;
            margin-bottom: 60px;
        }

        .footer-brand h3 {
            font-size: 1.5rem;
            color: white;
            margin-bottom: 16px;
        }

        .footer-brand p {
            font-size: 0.9rem;
            line-height: 1.8;
            margin-bottom: 24px;
        }

        .footer-social {
            display: flex;
            gap: 12px;
        }

        .footer-social a {
            width: 40px;
            height: 40px;
            background: rgba(255,255,255,0.1);
            border-radius: 10px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            text-decoration: none;
            transition: var(--transition);
            font-size: 0.9rem;
        }

        .footer-social a:hover {
            background: var(--accent);
            transform: translateY(-3px);
        }

        .footer-col h4 {
            font-family: 'Inter', sans-serif;
            font-size: 0.85rem;
            font-weight: 700;
            color: white;
            text-transform: uppercase;
            letter-spacing: 1.5px;
            margin-bottom: 20px;
        }

        .footer-col ul {
            list-style: none;
        }

        .footer-col ul li {
            margin-bottom: 10px;
        }

        .footer-col ul li a {
            color: rgba(255,255,255,0.6);
            text-decoration: none;
            font-size: 0.9rem;
            transition: var(--transition);
        }

        .footer-col ul li a:hover {
            color: var(--secondary);
            padding-left: 4px;
        }

        .footer-bottom {
            border-top: 1px solid rgba(255,255,255,0.1);
            padding: 24px 0;
            display: flex;
            justify-content: space-between;
            align-items: center;
            flex-wrap: wrap;
            gap: 16px;
        }

        .footer-bottom p {
            font-size: 0.85rem;
        }

        .footer-bottom-links {
            display: flex;
            gap: 24px;
        }

        .footer-bottom-links a {
            color: rgba(255,255,255,0.5);
            text-decoration: none;
            font-size: 0.85rem;
            transition: var(--transition);
        }

        .footer-bottom-links a:hover {
            color: white;
        }

        /* Responsive */
        @media (max-width: 1024px) {
            .hero-grid {
                grid-template-columns: 1fr;
                text-align: center;
            }

            .hero-content p {
                margin: 0 auto 36px;
            }

            .hero-buttons {
                justify-content: center;
            }

            .hero-stats {
                justify-content: center;
            }

            .hero-image {
                max-width: 500px;
                margin: 0 auto;
            }

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

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

            .deals-grid {
                grid-template-columns: 1fr;
            }

            .size-guide-wrapper {
                grid-template-columns: 1fr;
            }

            .testimonials-grid {
                grid-template-columns: 1fr;
            }

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

            .nav {
                display: none;
            }
        }

        @media (max-width: 640px) {
            .products-grid {
                grid-template-columns: 1fr;
            }

            .guides-grid {
                grid-template-columns: 1fr;
            }

            .deal-featured {
                grid-template-columns: 1fr;
                padding: 32px;
            }

            .hero-stats {
                flex-direction: column;
                gap: 20px;
            }

            .newsletter-form {
                flex-direction: column;
            }

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

            .size-input-group {
                grid-template-columns: 1fr;
            }
        }

        /* Animations */
        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(30px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .animate-in {
            animation: fadeInUp 0.6s ease forwards;
        }

        /* Scroll indicator */
        .scroll-top {
            position: fixed;
            bottom: 30px;
            right: 30px;
            width: 48px;
            height: 48px;
            background: var(--accent);
            color: white;
            border: none;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            box-shadow: var(--shadow-md);
            transition: var(--transition);
            opacity: 0;
            visibility: hidden;
            z-index: 999;
            font-size: 1.2rem;
        }

        .scroll-top.visible {
            opacity: 1;
            visibility: visible;
        }

        .scroll-top:hover {
            transform: translateY(-4px);
            box-shadow: var(--shadow-lg);
        }
    </style>
</head>
<body>
    <!-- Announcement Bar -->
    <div class="announcement-bar">
        🎉 Summer Sale Live Now — Use code <span>CARTWELL25</span> for 25% off your first order. Free shipping on orders over $75!
    </div>

    <!-- Header -->
    <header class="header">
        <div class="header-inner">
            <div class="logo-area">
                <img src="https://placehold.co/42x42/1a1a2e/e63946?text=C&font=montserrat" alt="Cartwell Logo">
                <div class="logo-text">
                    <h1>Cartwell</h1>
                    <p>Curated Finds, Unbeatable Prices</p>
                </div>
            </div>
            <nav class="nav">
                <a href="#home">Home</a>
                <a href="#new-arrivals">New Arrivals</a>
                <a href="#gift-guides">Gift Guides</a>
                <a href="#top-rated">Top Rated</a>
                <a href="#reviews">Reviews</a>
                <a href="#deals">Deals</a>
                <a href="#contact">Contact</a>
            </nav>
            <div class="header-actions">
                <button title="Search">🔍</button>
                <button title="Account">👤</button>
                <button title="Cart">
                    🛒
                    <span class="cart-count">3</span>
                </button>
            </div>
        </div>
    </header>

    <!-- Hero Section -->
    <section class="hero" id="home">
        <div class="container">
            <div class="hero-grid">
                <div class="hero-content">
                    <h2>Discover Your Next <em>Favorite</em> Thing</h2>
                    <p>From handpicked home essentials to the latest tech gadgets, Cartwell curates thousands of products from trusted brands — all at prices that make your wallet smile. Our expert team tests every item so you can shop with absolute confidence.</p>
                    <div class="hero-buttons">
                        <a href="#top-rated" class="btn btn-primary">Shop Best Sellers →</a>
                        <a href="#gift-guides" class="btn btn-ghost">Explore Gift Guides</a>
                    </div>
                    <div class="hero-stats">
                        <div class="hero-stat">
                            <h3>50K+</h3>
                            <p>Products Curated</p>
                        </div>
                        <div class="hero-stat">
                            <h3>4.9★</h3>
                            <p>Average Rating</p>
                        </div>
                        <div class="hero-stat">
                            <h3>2M+</h3>
                            <p>Happy Customers</p>
                        </div>
                    </div>
                </div>
                <div class="hero-image">
                    <img src="https://picsum.photos/600/500?blur=1" alt="Featured shopping collection">
                    <div class="hero-badge">🔥 Trending Now</div>
                </div>
            </div>
        </div>
    </section>

    <!-- Trust Bar -->
    <div class="trust-bar">
        <div class="container">
            <div class="trust-items">
                <div class="trust-item">
                    <div class="icon">🚚</div>
                    <div>
                        <p>Free Shipping</p>
                        <span>On orders over $75</span>
                    </div>
                </div>
                <div class="trust-item">
                    <div class="icon">🔄</div>
                    <div>
                        <p>30-Day Returns</p>
                        <span>Hassle-free policy</span>
                    </div>
                </div>
                <div class="trust-item">
                    <div class="icon">🔒</div>
                    <div>
                        <p>Secure Checkout</p>
                        <span>256-bit encryption</span>
                    </div>
                </div>
                <div class="trust-item">
                    <div class="icon">💰</div>
                    <div>
                        <p>Price Match</p>
                        <span>We'll beat any price</span>
                    </div>
                </div>
                <div class="trust-item">
                    <div class="icon">🏆</div>
                    <div>
                        <p>Loyalty Rewards</p>
                        <span>Earn points every purchase</span>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Gift Guides Section -->
    <section class="gift-guides" id="gift-guides">
        <div class="container">
            <div class="gift-guides-header">
                <span class="section-label">Curated For You</span>
                <h2 class="section-title">Gift Guides & Collections</h2>
                <p class="section-subtitle">Our editors spend hundreds of hours researching, testing, and comparing products to bring you definitive gift guides that take the guesswork out of shopping. Whether it's a birthday, anniversary, or "just because" moment, we've got you covered.</p>
            </div>
            <div class="guides-grid">
                <div class="guide-card">
                    <img src="https://picsum.photos/400/220?random=10" alt="Tech gifts guide">
                    <div class="guide-card-body">
                        <span class="tag">Tech & Gadgets</span>
                        <h3>The Ultimate Tech Gift Guide 2024</h3>
                        <p>From wireless earbuds that rival studio monitors to smart home devices that actually simplify your life, we've tested over 200 tech products to bring you the 30 most impressive gifts under $200. Every pick includes real-world performance data and our exclusive price match guarantee.</p>
                        <div class="guide-meta">
                            <span>32 products • Updated weekly</span>
                            <a href="#">Browse Guide →</a>
                        </div>
                    </div>
                </div>
                <div class="guide-card">
                    <img src="https://picsum.photos/400/220?random=11" alt="Home & living gifts">
                    <div class="guide-card-body">
                        <span class="tag">Home & Living</span>
                        <h3>Cozy Home Essentials They'll Actually Use</h3>
                        <p>Forget the clutter — these are the home products people rave about months after unwrapping them. Our team visited 15 manufacturer facilities and interviewed 500+ verified owners to compile this definitive list. From artisanal candle sets to ergonomic throw pillows, every item passed our 30-day durability test.</p>
                        <div class="guide-meta">
                            <span>28 products • Editor's picks</span>
                            <a href="#">Browse Guide →</a>
                        </div>
                    </div>
                </div>
                <div class="guide-card">
                    <img src="https://picsum.photos/400/220?random=12" alt="Fashion accessories">
                    <div class="guide-card-body">
                        <span class="tag">Fashion & Style</span>
                        <h3>Understated Luxury: Accessories Under $100</h3>
                        <p>Proof that thoughtful style doesn't require a designer budget. We partnered with emerging brands and heritage craftsmen to find accessories that punch way above their price point. Each piece in this guide has been style-tested across multiple outfits and occasions by our in-house fashion team.</p>
                        <div class="guide-meta">
                            <span>24 products • Staff favorites</span>
                            <a href="#">Browse Guide →</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Top Rated Products Section -->
    <section class="top-rated" id="top-rated">
        <div class="container">
            <div class="top-rated-header">
                <div>
                    <span class="section-label">Customer Favorites</span>
                    <h2 class="section-title">Top Rated This Week</h2>
                    <p class="section-subtitle">These are the products our community can't stop talking about. Ranked by verified purchase reviews, return rates, and repeat purchase data.</p>
                </div>
                <a href="#" class="btn btn-outline">View All Products</a>
            </div>
            <div class="products-grid">
                <div class="product-card">
                    <span class="product-badge sale">-30%</span>
                    <button class="wishlist-btn">♡</button>
                    <img src="https://picsum.photos/300/240?random=1" alt="Premium Wireless Headphones">
                    <div class="product-card-body">
                        <p class="product-category">Electronics</p>
                        <h4>AuraSound Pro Wireless Headphones</h4>
                        <div class="rating">
                            <span class="stars">★★★★★</span>
                            <span>(2,847 reviews)</span>
                        </div>
                        <div class="price">
                            <span class="current">$89.99</span>
                            <span class="original">$129.99</span>
                            <span class="sku">SKU: ASP-4091</span>
                        </div>
                        <button class="quick-view-btn">Quick View</button>
                    </div>
                </div>
                <div class="product-card">
                    <span class="product-badge new">New</span>
                    <button class="wishlist-btn">♡</button>
                    <img src="https://picsum.photos/300/240?random=2" alt="Artisan Ceramic Mug Set">
                    <div class="product-card-body">
                        <p class="product-category">Home & Kitchen</p>
                        <h4>Handcrafted Ceramic Mug Set (4pc)</h4>
                        <div class="rating">
                            <span class="stars">★★★★★</span>
                            <span>(1,203 reviews)</span>
                        </div>
                        <div class="price">
                            <span class="current">$44.00</span>
                            <span class="sku">SKU: HCM-2210</span>
                        </div>
                        <button class="quick-view-btn">Quick View</button>
                    </div>
                </div>
                <div class="product-card">
                    <span class="product-badge sale">-20%</span>
                    <button class="wishlist-btn">♡</button>
                    <img src="https://picsum.photos/300/240?random=3" alt="Organic Cotton Throw">
                    <div class="product-card-body">
                        <p class="product-category">Bedding & Bath</p>
                        <h4>Organic Cotton Waffle Throw Blanket</h4>
                        <div class="rating">
                            <span class="stars">★★★★☆</span>
                            <span>(956 reviews)</span>
                        </div>
                        <div class="price">
                            <span class="current">$55.20</span>
                            <span class="original">$69.00</span>
                            <span class="sku">SKU: OCW-7783</span>
                        </div>
                        <button class="quick-view-btn">Quick View</button>
                    </div>
                </div>
                <div class="product-card">
                    <button class="wishlist-btn">♡</button>
                    <img src="https://picsum.photos/300/240?random=4" alt="Leather Crossbody Bag">
                    <div class="product-card-body">
                        <p class="product-category">Bags & Accessories</p>
                        <h4>Italian Leather Crossbody Bag</h4>
                        <div class="rating">
                            <span class="stars">★★★★★</span>
                            <span>(3,412 reviews)</span>
                        </div>
                        <div class="price">
                            <span class="current">$128.00</span>
                            <span class="sku">SKU: ILC-5567</span>
                        </div>
                        <button class="quick-view-btn">Quick View</button>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Deals Section -->
    <section class="deals-section" id="deals">
        <div class="container">
            <div style="margin-bottom: 48px;">
                <span class="section-label">Don't Miss Out</span>
                <h2 class="section-title">Flash Deals & Customer Favorites</h2>
                <p class="section-subtitle">Limited-time offers on products our community loves most. Our price match guarantee ensures you're always getting the best deal available anywhere online.</p>
            </div>
            <div class="deals-grid">
                <div class="deal-featured">
                    <div class="deal-featured-content">
                        <span class="deal-tag">⚡ Deal of the Day</span>
                        <h3>SmartHome Hub Pro — Complete Bundle</h3>
                        <p>Control your entire home from one elegant device. This bundle includes the hub, 4 smart plugs, 2 motion sensors, and a 12-month premium subscription. Compatible with Alexa, Google Home, and Apple HomeKit. Over 15,000 units sold with a 4.8-star average.</p>
                        <div class="deal-price">
                            <span class="now">$149</span>
                            <span class="was">$299</span>
                        </div>
                        <a href="#" class="btn btn-primary">Buy Now — Save 50%</a>
                    </div>
                    <div class="deal-featured-image">
                        <img src="https://picsum.photos/400/300?random=5" alt="SmartHome Hub Pro">
                    </div>
                </div>
                <div class="deals-sidebar">
                    <div class="deal-card-sm">
                        <img src="https://picsum.photos/72/72?random=6" alt="Product">
                        <div class="deal-card-sm-info">
                            <h4>Bamboo Desk Organizer</h4>
                            <span class="deal-discount">40% OFF — $18.99</span>
                            <p class="deal-timer">⏰ Ends in 3h 24m</p>
                        </div>
                    </div>
                    <div class="deal-card-sm">
                        <img src="https://picsum.photos/72/72?random=7" alt="Product">
                        <div class="deal-card-sm-info">
                            <h4>Stainless Steel Water Bottle</h4>
                            <span class="deal-discount">35% OFF — $22.75</span>
                            <p class="deal-timer">⏰ Ends in 5h 12m</p>
                        </div>
                    </div>
                    <div class="deal-card-sm">
                        <img src="https://picsum.photos/72/72?random=8" alt="Product">
                        <div class="deal-card-sm-info">
                            <h4>LED Desk Lamp w/ Charger</h4>
                            <span class="deal-discount">25% OFF — $37.50</span>
                            <p class="deal-timer">⏰ Ends in 8h 45m</p>
                        </div>
                    </div>
                    <div class="deal-card-sm">
                        <img src="https://picsum.photos/72/72?random=9" alt="Product">
                        <div class="deal-card-sm-info">
                            <h4>Merino Wool Travel Socks (3pk)</h4>
                            <span class="deal-discount">30% OFF — $27.99</span>
                            <p class="deal-timer">⏰ Ends in 11h 03m</p>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Size Guide Interactive Section -->
    <section class="size-guide-section" id="size-guide">
        <div class="container">
            <div class="size-guide-wrapper">
                <div class="size-guide-content">
                    <span class="section-label">Interactive Tool</span>
                    <h2>Find Your Perfect Fit</h2>
                    <p>Stop guessing and start getting it right the first time. Our intelligent size recommendation tool uses data from over 500,000 customer fittings to suggest the ideal size for your body type and preferred fit. No more returns, no more hassle — just the perfect fit delivered to your door.</p>
                    <p>Works across all apparel categories including tops, bottoms, dresses, and outerwear. Our algorithm accounts for brand-specific sizing variations, so you'll get accurate recommendations whether you're shopping our in-house label or partner brands.</p>
                    <a href="#" class="btn btn-outline" style="margin-top: 12px;">Learn About Our Fit Promise →</a>
                </div>
                <div class="size-guide-tool">
                    <h4>📏 Size Recommendation Tool</h4>
                    <div class="size-input-group">
                        <div>
                            <label>Category</label>
                            <select id="sizeCategory">
                                <option value="">Select category...</option>
                                <option value="tops">Tops & Shirts</option>
                                <option value="bottoms">Pants & Jeans</option>
                                <option value="dresses">Dresses</option>
                                <option value="outerwear">Outerwear</option>
                                <option value="shoes">Shoes</option>
                            </select>
                        </div>
                        <div>
                            <label>Preferred Fit</label>
                            <select id="sizeFit">
                                <option value="">Select fit...</option>
                                <option value="slim">Slim / Fitted</option>
                                <option value="regular">Regular / Classic</option>
                                <option value="relaxed">Relaxed / Loose</option>
                            </select>
                        </div>
                    </div>
                    <div class="size-input-group">
                        <div>
                            <label>Height</label>
                            <select id="sizeHeight">
                                <option value="">Select height...</option>
                                <option value="short">Under 5'4"</option>
                                <option value="average">5'4" - 5'8"</option>
                                <option value="tall">5'9" - 6'1"</option>
                                <option value="xtall">Over 6'1"</option>
                            </select>
                        </div>
                        <div>
                            <label>Usual Size (US)</label>
                            <select id="sizeUsual">
                                <option value="">Select size...</option>
                                <option value="xs">XS (0-2)</option>
                                <option value="s">S (4-6)</option>
                                <option value="m">M (8-10)</option>
                                <option value="l">L (12-14)</option>
                                <option value="xl">XL (16-18)</option>
                                <option value="xxl">XXL (20+)</option>
                            </select>
                        </div>
                    </div>
                    <button class="btn btn-primary" style="width:100%; justify-content: center; margin-bottom: 16px;" onclick="findSize()">Find My Size</button>
                    <div class="size-result" id="sizeResult">
                        <div class="recommended-size" id="recommendedSize">M</div>
                        <p id="sizeNote">Based on your inputs, we recommend this size. 94% of similar customers agree with this recommendation.</p>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Testimonials Section -->
    <section class="testimonials" id="reviews">
        <div class="container">
            <div class="testimonials-header">
                <span class="section-label">What Our Customers Say</span>
                <h2 class="section-title">Trusted by 2 Million+ Shoppers</h2>
                <p class="section-subtitle">Real reviews from verified purchasers. Every testimonial below is from a customer who bought through Cartwell and agreed to share their experience.</p>
            </div>
            <div class="testimonials-grid">
                <div class="testimonial-card">
                    <div class="quote-icon">"</div>
                    <div class="review-stars">★★★★★</div>
                    <p>I've been shopping online for over a decade, and Cartwell is genuinely the first platform that feels curated rather than overwhelming. Their gift guide for my mother's 60th birthday saved me hours of research. Every item was thoughtful, well-described, and arrived beautifully packaged. The loyalty program is a nice bonus too — I've already earned enough points for a $30 credit.</p>
                    <div class="reviewer">
                        <img src="https://i.pravatar.cc/44?u=sarah_m" alt="Sarah M.">
                        <div class="reviewer-info">
                            <h5>Sarah Mitchell</h5>
                            <span>Verified Buyer • Portland, OR</span>
                        </div>
                    </div>
                </div>
                <div class="testimonial-card">
                    <div class="quote-icon">"</div>
                    <div class="review-stars">★★★★★</div>
                    <p>The price match feature is what keeps me coming back. I found the same wireless headphones $20 cheaper on another site, submitted a request, and Cartwell not only matched it but gave me an additional 10% loyalty discount. The whole process took under 5 minutes. Their customer service team is genuinely responsive — no bots, no runaround.</p>
                    <div class="reviewer">
                        <img src="https://i.pravatar.cc/44?u=james_k" alt="James K.">
                        <div class="reviewer-info">
                            <h5>James Kowalski</h5>
                            <span>Verified Buyer • Austin, TX</span>
                        </div>
                    </div>
                </div>
                <div class="testimonial-card">
                    <div class="quote-icon">"</div>
                    <div class="review-stars">★★★★★</div>
                    <p>As someone who's particular about fit, the size guide tool is a game-changer. I ordered three items using their recommendations and every single one fit perfectly on the first try. No returns, no exchanges. That alone has saved me so much time and frustration. Plus, their new arrivals section consistently surfaces brands I'd never find on my own.</p>
                    <div class="reviewer">
                        <img src="https://i.pravatar.cc/44?u=priya_d" alt="Priya D.">
                        <div class="reviewer-info">
                            <h5>Priya Deshmukh</h5>
                            <span>Verified Buyer • Chicago, IL</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- FAQ Section -->
    <section class="faq-section">
        <div class="container">
            <div class="faq-header">
                <span class="section-label">Got Questions?</span>
                <h2 class="section-title">Frequently Asked Questions</h2>
            </div>
            <div class="faq-container">
                <div class="faq-item">
                    <button class="faq-question" onclick="toggleFaq(this)">
                        How does the Price Match Guarantee work?
                        <span class="faq-icon">+</span>
                    </button>
                    <div class="faq-answer">
                        <p>If you find an identical product (same SKU, color, and specifications) at a lower price from any authorized US retailer, simply submit a price match request through your order dashboard or contact our support team. We'll verify the competitor's price within 2 business hours and either match it or beat it by 5%. This applies to all non-clearance items and can be combined with active promo codes. Our price match window extends 14 days post-purchase, so you can shop with total confidence knowing you're always getting the best deal.</p>
                    </div>
                </div>
                <div class="faq-item">
                    <button class="faq-question" onclick="toggleFaq(this)">
                        What's included in the Loyalty Rewards Program?
                        <span class="faq-icon">+</span>
                    </button>
                    <div class="faq-answer">
                        <p>Cartwell Rewards is our free loyalty program that lets you earn points on every purchase — 1 point per dollar spent, with bonus multipliers during special promotions. Points can be redeemed for discounts ($1 per 100 points), early access to sales, exclusive member-only products, and free expedited shipping. Members also receive a birthday reward, anniversary bonus, and access to our quarterly "Insider Picks" curated box at 40% off retail value. There are no tiers or minimums — every member gets the same great benefits from day one.</p>
                    </div>
                </div>
                <div class="faq-item">
                    <button class="faq-question" onclick="toggleFaq(this)">
                        How do I track my order?
                        <span class="faq-icon">+</span>
                    </button>
                    <div class="faq-answer">
                        <p>Once your order ships, you'll receive an email with a tracking number and a direct link to our order tracking page. You can also track all your orders in real-time by logging into your Cartwell account and visiting the "My Orders" section. We provide live carrier updates, estimated delivery windows (not just dates), and proactive notifications if there are any delays. For orders shipped via our premium partners, you'll get photo confirmation upon delivery and the option to reschedule if you're not home.</p>
                    </div>
                </div>
                <div class="faq-item">
                    <button class="faq-question" onclick="toggleFaq(this)">
                        What is your return and exchange policy?
                        <span class="faq-icon">+</span>
                    </button>
                    <div class="faq-answer">
                        <p>We offer a generous 30-day return window on all items in original, unused condition with tags attached. Returns are completely free — we provide a prepaid shipping label you can print at home or display on your phone at any UPS drop-off location. Exchanges are processed immediately upon scan (we don't wait for the return to reach our warehouse), so you'll have your replacement item shipping within 24 hours. For items that don't work out, refunds are processed to your original payment method within 3-5 business days of receipt. Loyalty members enjoy an extended 60-day return window.</p>
                    </div>
                </div>
                <div class="faq-item">
                    <button class="faq-question" onclick="toggleFaq(this)">
                        Are the products on Cartwell authentic and verified?
                        <span class="faq-icon">+</span>
                    </button>
                    <div class="faq-answer">
                        <p>Absolutely. Every product on Cartwell is sourced directly from the brand or an authorized distributor. We maintain active partnerships with over 2,000 brands and conduct regular authenticity audits. Our team physically inspects warehouse inventory on a rotating basis, and we use serialized tracking for high-value items. If you ever receive a product you believe to be inauthentic, our verification team will investigate within 24 hours and provide a full refund plus a $50 store credit if our assessment confirms your concern. Your trust is our most valuable asset.</p>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- Newsletter Section -->
    <section class="newsletter" id="contact">
        <div class="container">
            <div class="newsletter-content">
                <h2>Join the Cartwell Community</h2>
                <p>Get early access to flash sales, exclusive member discounts, and curated product drops delivered straight to your inbox. No spam, just the good stuff.</p>
                <form class="newsletter-form" onsubmit="return false;">
                    <input type="email" placeholder="Enter your email address" required>
                    <button type="submit">Subscribe</button>
                </form>
                <div class="newsletter-perks">
                    <span>10% off first order</span>
                    <span>Early sale access</span>
                    <span>Weekly curated picks</span>
                    <span>Cancel anytime</span>
                </div>
            </div>
        </div>
    </section>

    <!-- Footer -->
    <footer class="footer">
        <div class="container">
            <div class="footer-grid">
                <div class="footer-brand">
                    <h3>Cartwell</h3>
                    <p>We believe great shopping experiences start with curation, transparency, and genuine care for our customers. Every product on our platform has been vetted by our team, every price is verified, and every order is backed by our satisfaction guarantee. Founded in 2021, Cartwell has grown to serve over 2 million customers across all 50 states.</p>
                    <div class="footer-social">
                        <a href="#" title="Facebook">f</a>
                        <a href="#" title="Instagram">ig</a>
                        <a href="#" title="Twitter/X">𝕏</a>
                        <a href="#" title="Pinterest">P</a>
                        <a href="#" title="TikTok">T</a>
                    </div>
                </div>
                <div class="footer-col">
                    <h4>Shop</h4>
                    <ul>
                        <li><a href="#">New Arrivals</a></li>
                        <li><a href="#">Best Sellers</a></li>
                        <li><a href="#">Gift Guides</a></li>
                        <li><a href="#">Flash Deals</a></li>
                        <li><a href="#">Clearance</a></li>
                        <li><a href="#">Brands A-Z</a></li>
                    </ul>
                </div>
                <div class="footer-col">
                    <h4>Support</h4>
                    <ul>
                        <li><a href="#">Help Center</a></li>
                        <li><a href="#">Track Order</a></li>
                        <li><a href="#">Returns & Exchanges</a></li>
                        <li><a href="#">Shipping Info</a></li>
                        <li><a href="#">Size Guide</a></li>
                        <li><a href="#">Contact Us</a></li>
                    </ul>
                </div>
                <div class="footer-col">
                    <h4>Company</h4>
                    <ul>
                        <li><a href="#">About Us</a></li>
                        <li><a href="#">Careers</a></li>
                        <li><a href="#">Press</a></li>
                        <li><a href="#">Affiliate Program</a></li>
                        <li><a href="#">Sell on Cartwell</a></li>
                        <li><a href="#">Sustainability</a></li>
                    </ul>
                </div>
                <div class="footer-col">
                    <h4>Contact</h4>
                    <ul>
                        <li><a href="mailto:hello@cartwell.com">hello@cartwell.com</a></li>
                        <li><a href="tel:1-800-555-0199">1-800-555-0199</a></li>
                        <li><a href="#">Live Chat (9am-9pm ET)</a></li>
                        <li><a href="#">450 Commerce Blvd</a></li>
                        <li><a href="#">Suite 200, Portland OR 97201</a></li>
                    </ul>
                </div>
            </div>
            <div class="footer-bottom">
                <p>© 2024 Cartwell, Inc. All rights reserved.</p>
                <div class="footer-bottom-links">
                    <a href="#">Privacy Policy</a>
                    <a href="#">Terms of Service</a>
                    <a href="#">Cookie Preferences</a>
                    <a href="#">Accessibility</a>
                    <a href="#">Sitemap</a>
                </div>
            </div>
        </div>
    </footer>

    <!-- Scroll to Top Button -->
    <button class="scroll-top" id="scrollTop" onclick="window.scrollTo({top:0,behavior:'smooth'})">↑</button>

    <script>
        // FAQ Toggle
        function toggleFaq(button) {
            const item = button.parentElement;
            const allItems = document.querySelectorAll('.faq-item');
            
            allItems.forEach(i => {
                if (i !== item) i.classList.remove('active');
            });
            
            item.classList.toggle('active');
        }

        // Size Guide Tool
        function findSize() {
            const category = document.getElementById('sizeCategory').value;
            const fit = document.getElementById('sizeFit').value;
            const height = document.getElementById('sizeHeight').value;
            const usual = document.getElementById('sizeUsual').value;
            
            if (!category || !fit || !height || !usual) {
                alert('Please fill in all fields to get your recommendation.');
                return;
            }

            const sizeMap = {
                'xs': { slim: 'XS', regular: 'S', relaxed: 'M' },
                's': { slim: 'S', regular: 'M', relaxed: 'L' },
                'm': { slim: 'M', regular: 'L', relaxed: 'XL' },
                'l': { slim: 'L', regular: 'XL', relaxed: 'XXL' },
                'xl': { slim: 'XL', regular: 'XXL', relaxed: 'XXL' },
                'xxl': { slim: 'XXL', regular: 'XXL', relaxed: 'XXL' }
            };

            const heightAdjust = {
                'short': -1,
                'average': 0,
                'tall': 0,
                'xtall': 1
            };

            let recommended = sizeMap[usual][fit];
            
            const notes = {
                'tops': 'Based on your chest and shoulder measurements, this size will provide the ideal drape and comfort.',
                'bottoms': 'This size accounts for your waist-to-hip ratio and inseam preference for the selected fit style.',
                'dresses': 'Our recommendation considers bust, waist, and hip measurements for a flattering silhouette.',
                'outerwear': 'This size allows for comfortable layering while maintaining the intended silhouette.',
                'shoes': 'Based on your typical size and preferred fit, we recommend this for optimal comfort throughout the day.'
            };

            document.getElementById('recommendedSize').textContent = recommended;
            document.getElementById('sizeNote').textContent = notes[category] + ' 94% of customers with similar measurements confirmed this fit perfectly.';
            document.getElementById('sizeResult').classList.add('active');
        }

        // Scroll to top button visibility
        window.addEventListener('scroll', function() {
            const scrollBtn = document.getElementById('scrollTop');
            if (window.scrollY > 600) {
                scrollBtn.classList.add('visible');
            } else {
                scrollBtn.classList.remove('visible');
            }
        });

        // Smooth scroll for nav links
        document.querySelectorAll('a[href^="#"]').forEach(anchor => {
            anchor.addEventListener('click', function(e) {
                e.preventDefault();
                const target = document.querySelector(this.getAttribute('href'));
                if (target) {
                    target.scrollIntoView({ behavior: 'smooth', block: 'start' });
                }
            });
        });
    </script>
</body>
</html>
View Axe Report (JSON)
{
  "testEngine": {
    "name": "axe-core",
    "version": "4.10.2"
  },
  "testRunner": {
    "name": "axe"
  },
  "testEnvironment": {
    "userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) HeadlessChrome/156.0.8078.4 Safari/537.36",
    "windowWidth": 1280,
    "windowHeight": 720,
    "orientationAngle": 0,
    "orientationType": "landscape-primary"
  },
  "timestamp": "2026-11-12T09:43:11.728Z",
  "url": "https://benchmark.aimac.invalid/44e3cdcd430fb079ece7426a75846a997ff20776a90e135feda6659c38b3c689.html",
  "toolOptions": {
    "runOnly": {
      "type": "tag",
      "values": [
        "wcag2a",
        "wcag2aa",
        "wcag21a",
        "wcag21aa",
        "wcag22a",
        "wcag22aa"
      ]
    },
    "resultTypes": [
      "violations"
    ],
    "reporter": "v1"
  },
  "inapplicable": [
    {
      "id": "area-alt",
      "impact": null,
      "tags": [
        "cat.text-alternatives",
        "wcag2a",
        "wcag244",
        "wcag412",
        "section508",
        "section508.22.a",
        "TTv5",
        "TT6.a",
        "EN-301-549",
        "EN-9.2.4.4",
        "EN-9.4.1.2",
        "ACT"
      ],
      "description": "Ensure <area> elements of image maps have alternative text",
      "help": "Active <area> elements must have alternative text",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/area-alt?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-allowed-attr",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure an element's role supports its ARIA attributes",
      "help": "Elements must only use supported ARIA attributes",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-allowed-attr?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-braille-equivalent",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure aria-braillelabel and aria-brailleroledescription have a non-braille equivalent",
      "help": "aria-braille attributes must have a non-braille equivalent",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-braille-equivalent?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-command-name",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "TTv5",
        "TT6.a",
        "EN-301-549",
        "EN-9.4.1.2",
        "ACT"
      ],
      "description": "Ensure every ARIA button, link and menuitem has an accessible name",
      "help": "ARIA commands must have an accessible name",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-command-name?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-conditional-attr",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure ARIA attributes are used as described in the specification of the element's role",
      "help": "ARIA attributes must be used as specified for the element's role",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-conditional-attr?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-deprecated-role",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure elements do not use deprecated roles",
      "help": "Deprecated ARIA roles must not be used",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-deprecated-role?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-hidden-focus",
      "impact": null,
      "tags": [
        "cat.name-role-value",
        "wcag2a",
        "wcag412",
        "TTv5",
        "TT6.a",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure aria-hidden elements are not focusable nor contain focusable elements",
      "help": "ARIA hidden element must not be focusable or contain focusable elements",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-hidden-focus?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-input-field-name",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "TTv5",
        "TT5.c",
        "EN-301-549",
        "EN-9.4.1.2",
        "ACT"
      ],
      "description": "Ensure every ARIA input field has an accessible name",
      "help": "ARIA input fields must have an accessible name",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-input-field-name?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-meter-name",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag111",
        "EN-301-549",
        "EN-9.1.1.1"
      ],
      "description": "Ensure every ARIA meter node has an accessible name",
      "help": "ARIA meter nodes must have an accessible name",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-meter-name?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-progressbar-name",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag111",
        "EN-301-549",
        "EN-9.1.1.1"
      ],
      "description": "Ensure every ARIA progressbar node has an accessible name",
      "help": "ARIA progressbar nodes must have an accessible name",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-progressbar-name?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-prohibited-attr",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure ARIA attributes are not prohibited for an element's role",
      "help": "Elements must only use permitted ARIA attributes",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-prohibited-attr?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-required-attr",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure elements with ARIA roles have all required ARIA attributes",
      "help": "Required ARIA attributes must be provided",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-required-attr?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-required-children",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag131",
        "EN-301-549",
        "EN-9.1.3.1"
      ],
      "description": "Ensure elements with an ARIA role that require child roles contain them",
      "help": "Certain ARIA roles must contain particular children",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-required-children?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-required-parent",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag131",
        "EN-301-549",
        "EN-9.1.3.1"
      ],
      "description": "Ensure elements with an ARIA role that require parent roles are contained by them",
      "help": "Certain ARIA roles must be contained by particular parents",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-required-parent?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-roles",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure all elements with a role attribute use a valid value",
      "help": "ARIA roles used must conform to valid values",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-roles?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-toggle-field-name",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "TTv5",
        "TT5.c",
        "EN-301-549",
        "EN-9.4.1.2",
        "ACT"
      ],
      "description": "Ensure every ARIA toggle field has an accessible name",
      "help": "ARIA toggle fields must have an accessible name",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-toggle-field-name?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-tooltip-name",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure every ARIA tooltip node has an accessible name",
      "help": "ARIA tooltip nodes must have an accessible name",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-tooltip-name?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-valid-attr-value",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure all ARIA attributes have valid values",
      "help": "ARIA attributes must conform to valid values",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-valid-attr-value?application=axeAPI",
      "nodes": []
    },
    {
      "id": "aria-valid-attr",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure attributes that begin with aria- are valid ARIA attributes",
      "help": "ARIA attributes must conform to valid names",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-valid-attr?application=axeAPI",
      "nodes": []
    },
    {
      "id": "autocomplete-valid",
      "impact": null,
      "tags": [
        "cat.forms",
        "wcag21aa",
        "wcag135",
        "EN-301-549",
        "EN-9.1.3.5",
        "ACT"
      ],
      "description": "Ensure the autocomplete attribute is correct and suitable for the form field",
      "help": "autocomplete attribute must be used correctly",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/autocomplete-valid?application=axeAPI",
      "nodes": []
    },
    {
      "id": "blink",
      "impact": null,
      "tags": [
        "cat.time-and-media",
        "wcag2a",
        "wcag222",
        "section508",
        "section508.22.j",
        "TTv5",
        "TT2.b",
        "EN-301-549",
        "EN-9.2.2.2"
      ],
      "description": "Ensure <blink> elements are not used",
      "help": "<blink> elements are deprecated and must not be used",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/blink?application=axeAPI",
      "nodes": []
    },
    {
      "id": "definition-list",
      "impact": null,
      "tags": [
        "cat.structure",
        "wcag2a",
        "wcag131",
        "EN-301-549",
        "EN-9.1.3.1"
      ],
      "description": "Ensure <dl> elements are structured correctly",
      "help": "<dl> elements must only directly contain properly-ordered <dt> and <dd> groups, <script>, <template> or <div> elements",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/definition-list?application=axeAPI",
      "nodes": []
    },
    {
      "id": "dlitem",
      "impact": null,
      "tags": [
        "cat.structure",
        "wcag2a",
        "wcag131",
        "EN-301-549",
        "EN-9.1.3.1"
      ],
      "description": "Ensure <dt> and <dd> elements are contained by a <dl>",
      "help": "<dt> and <dd> elements must be contained by a <dl>",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/dlitem?application=axeAPI",
      "nodes": []
    },
    {
      "id": "duplicate-id-aria",
      "impact": null,
      "tags": [
        "cat.parsing",
        "wcag2a",
        "wcag412",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure every id attribute value used in ARIA and in labels is unique",
      "help": "IDs used in ARIA and labels must be unique",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/duplicate-id-aria?application=axeAPI",
      "nodes": []
    },
    {
      "id": "frame-focusable-content",
      "impact": null,
      "tags": [
        "cat.keyboard",
        "wcag2a",
        "wcag211",
        "TTv5",
        "TT4.a",
        "EN-301-549",
        "EN-9.2.1.1"
      ],
      "description": "Ensure <frame> and <iframe> elements with focusable content do not have tabindex=-1",
      "help": "Frames with focusable content must not have tabindex=-1",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/frame-focusable-content?application=axeAPI",
      "nodes": []
    },
    {
      "id": "frame-title-unique",
      "impact": null,
      "tags": [
        "cat.text-alternatives",
        "wcag2a",
        "wcag412",
        "TTv5",
        "TT12.d",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure <iframe> and <frame> elements contain a unique title attribute",
      "help": "Frames must have a unique title attribute",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/frame-title-unique?application=axeAPI",
      "nodes": []
    },
    {
      "id": "frame-title",
      "impact": null,
      "tags": [
        "cat.text-alternatives",
        "wcag2a",
        "wcag412",
        "section508",
        "section508.22.i",
        "TTv5",
        "TT12.d",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure <iframe> and <frame> elements have an accessible name",
      "help": "Frames must have an accessible name",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/frame-title?application=axeAPI",
      "nodes": []
    },
    {
      "id": "html-xml-lang-mismatch",
      "impact": null,
      "tags": [
        "cat.language",
        "wcag2a",
        "wcag311",
        "EN-301-549",
        "EN-9.3.1.1",
        "ACT"
      ],
      "description": "Ensure that HTML elements with both valid lang and xml:lang attributes agree on the base language of the page",
      "help": "HTML elements with lang and xml:lang must have the same base language",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/html-xml-lang-mismatch?application=axeAPI",
      "nodes": []
    },
    {
      "id": "input-button-name",
      "impact": null,
      "tags": [
        "cat.name-role-value",
        "wcag2a",
        "wcag412",
        "section508",
        "section508.22.a",
        "TTv5",
        "TT5.c",
        "EN-301-549",
        "EN-9.4.1.2",
        "ACT"
      ],
      "description": "Ensure input buttons have discernible text",
      "help": "Input buttons must have discernible text",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/input-button-name?application=axeAPI",
      "nodes": []
    },
    {
      "id": "input-image-alt",
      "impact": null,
      "tags": [
        "cat.text-alternatives",
        "wcag2a",
        "wcag111",
        "wcag412",
        "section508",
        "section508.22.a",
        "TTv5",
        "TT7.a",
        "EN-301-549",
        "EN-9.1.1.1",
        "EN-9.4.1.2",
        "ACT"
      ],
      "description": "Ensure <input type=\"image\"> elements have alternative text",
      "help": "Image buttons must have alternative text",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/input-image-alt?application=axeAPI",
      "nodes": []
    },
    {
      "id": "marquee",
      "impact": null,
      "tags": [
        "cat.parsing",
        "wcag2a",
        "wcag222",
        "TTv5",
        "TT2.b",
        "EN-301-549",
        "EN-9.2.2.2"
      ],
      "description": "Ensure <marquee> elements are not used",
      "help": "<marquee> elements are deprecated and must not be used",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/marquee?application=axeAPI",
      "nodes": []
    },
    {
      "id": "meta-refresh",
      "impact": null,
      "tags": [
        "cat.time-and-media",
        "wcag2a",
        "wcag221",
        "TTv5",
        "TT8.a",
        "EN-301-549",
        "EN-9.2.2.1"
      ],
      "description": "Ensure <meta http-equiv=\"refresh\"> is not used for delayed refresh",
      "help": "Delayed refresh under 20 hours must not be used",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/meta-refresh?application=axeAPI",
      "nodes": []
    },
    {
      "id": "object-alt",
      "impact": null,
      "tags": [
        "cat.text-alternatives",
        "wcag2a",
        "wcag111",
        "section508",
        "section508.22.a",
        "EN-301-549",
        "EN-9.1.1.1"
      ],
      "description": "Ensure <object> elements have alternative text",
      "help": "<object> elements must have alternative text",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/object-alt?application=axeAPI",
      "nodes": []
    },
    {
      "id": "role-img-alt",
      "impact": null,
      "tags": [
        "cat.text-alternatives",
        "wcag2a",
        "wcag111",
        "section508",
        "section508.22.a",
        "TTv5",
        "TT7.a",
        "EN-301-549",
        "EN-9.1.1.1",
        "ACT"
      ],
      "description": "Ensure [role=\"img\"] elements have alternative text",
      "help": "[role=\"img\"] elements must have an alternative text",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/role-img-alt?application=axeAPI",
      "nodes": []
    },
    {
      "id": "scrollable-region-focusable",
      "impact": null,
      "tags": [
        "cat.keyboard",
        "wcag2a",
        "wcag211",
        "wcag213",
        "TTv5",
        "TT4.a",
        "EN-301-549",
        "EN-9.2.1.1",
        "EN-9.2.1.3"
      ],
      "description": "Ensure elements that have scrollable content are accessible by keyboard",
      "help": "Scrollable region must have keyboard access",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/scrollable-region-focusable?application=axeAPI",
      "nodes": []
    },
    {
      "id": "server-side-image-map",
      "impact": null,
      "tags": [
        "cat.text-alternatives",
        "wcag2a",
        "wcag211",
        "section508",
        "section508.22.f",
        "TTv5",
        "TT4.a",
        "EN-301-549",
        "EN-9.2.1.1"
      ],
      "description": "Ensure that server-side image maps are not used",
      "help": "Server-side image maps must not be used",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/server-side-image-map?application=axeAPI",
      "nodes": []
    },
    {
      "id": "summary-name",
      "impact": null,
      "tags": [
        "cat.name-role-value",
        "wcag2a",
        "wcag412",
        "section508",
        "section508.22.a",
        "TTv5",
        "TT6.a",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure summary elements have discernible text",
      "help": "Summary elements must have discernible text",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/summary-name?application=axeAPI",
      "nodes": []
    },
    {
      "id": "svg-img-alt",
      "impact": null,
      "tags": [
        "cat.text-alternatives",
        "wcag2a",
        "wcag111",
        "section508",
        "section508.22.a",
        "TTv5",
        "TT7.a",
        "EN-301-549",
        "EN-9.1.1.1",
        "ACT"
      ],
      "description": "Ensure <svg> elements with an img, graphics-document or graphics-symbol role have an accessible text",
      "help": "<svg> elements with an img role must have an alternative text",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/svg-img-alt?application=axeAPI",
      "nodes": []
    },
    {
      "id": "td-headers-attr",
      "impact": null,
      "tags": [
        "cat.tables",
        "wcag2a",
        "wcag131",
        "section508",
        "section508.22.g",
        "TTv5",
        "TT14.b",
        "EN-301-549",
        "EN-9.1.3.1"
      ],
      "description": "Ensure that each cell in a table that uses the headers attribute refers only to other cells in that table",
      "help": "Table cells that use the headers attribute must only refer to cells in the same table",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/td-headers-attr?application=axeAPI",
      "nodes": []
    },
    {
      "id": "th-has-data-cells",
      "impact": null,
      "tags": [
        "cat.tables",
        "wcag2a",
        "wcag131",
        "section508",
        "section508.22.g",
        "TTv5",
        "TT14.b",
        "EN-301-549",
        "EN-9.1.3.1"
      ],
      "description": "Ensure that <th> elements and elements with role=columnheader/rowheader have data cells they describe",
      "help": "Table headers in a data table must refer to data cells",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/th-has-data-cells?application=axeAPI",
      "nodes": []
    },
    {
      "id": "valid-lang",
      "impact": null,
      "tags": [
        "cat.language",
        "wcag2aa",
        "wcag312",
        "TTv5",
        "TT11.b",
        "EN-301-549",
        "EN-9.3.1.2",
        "ACT"
      ],
      "description": "Ensure lang attributes have valid values",
      "help": "lang attribute must have a valid value",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/valid-lang?application=axeAPI",
      "nodes": []
    },
    {
      "id": "video-caption",
      "impact": null,
      "tags": [
        "cat.text-alternatives",
        "wcag2a",
        "wcag122",
        "section508",
        "section508.22.a",
        "TTv5",
        "TT17.a",
        "EN-301-549",
        "EN-9.1.2.2"
      ],
      "description": "Ensure <video> elements have captions",
      "help": "<video> elements must have captions",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/video-caption?application=axeAPI",
      "nodes": []
    },
    {
      "id": "no-autoplay-audio",
      "impact": null,
      "tags": [
        "cat.time-and-media",
        "wcag2a",
        "wcag142",
        "TTv5",
        "TT2.a",
        "EN-301-549",
        "EN-9.1.4.2",
        "ACT"
      ],
      "description": "Ensure <video> or <audio> elements do not autoplay audio for more than 3 seconds without a control mechanism to stop or mute the audio",
      "help": "<video> or <audio> elements must not play automatically",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/no-autoplay-audio?application=axeAPI",
      "nodes": []
    }
  ],
  "passes": [
    {
      "id": "aria-hidden-body",
      "impact": null,
      "tags": [
        "cat.aria",
        "wcag2a",
        "wcag131",
        "wcag412",
        "EN-301-549",
        "EN-9.1.3.1",
        "EN-9.4.1.2"
      ],
      "description": "Ensure aria-hidden=\"true\" is not present on the document body.",
      "help": "aria-hidden=\"true\" must not be present on the document body",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/aria-hidden-body?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "aria-hidden-body",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "No aria-hidden attribute is present on document body"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<body>",
          "target": [
            "body"
          ]
        }
      ]
    },
    {
      "id": "avoid-inline-spacing",
      "impact": null,
      "tags": [
        "cat.structure",
        "wcag21aa",
        "wcag1412",
        "EN-301-549",
        "EN-9.1.4.12",
        "ACT"
      ],
      "description": "Ensure that text spacing set through style attributes can be adjusted with custom stylesheets",
      "help": "Inline text spacing must be adjustable with custom stylesheets",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/avoid-inline-spacing?application=axeAPI",
      "nodes": [
        {
          "any": [],
          "all": [
            {
              "id": "important-letter-spacing",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "Letter-spacing in the style attribute is not set to !important, or meets the minimum"
            },
            {
              "id": "important-word-spacing",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "word-spacing in the style attribute is not set to !important, or meets the minimum"
            },
            {
              "id": "important-line-height",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "line-height in the style attribute is not set to !important, or meets the minimum"
            }
          ],
          "none": [],
          "impact": null,
          "html": "<div style=\"margin-bottom: 48px;\">",
          "target": [
            "#deals > .container > div:nth-child(1)"
          ]
        }
      ]
    },
    {
      "id": "button-name",
      "impact": null,
      "tags": [
        "cat.name-role-value",
        "wcag2a",
        "wcag412",
        "section508",
        "section508.22.a",
        "TTv5",
        "TT6.a",
        "EN-301-549",
        "EN-9.4.1.2",
        "ACT"
      ],
      "description": "Ensure buttons have discernible text",
      "help": "Buttons must have discernible text",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/button-name?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "button-has-visible-text",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element has inner text that is visible to screen readers"
            },
            {
              "id": "non-empty-title",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element has a title attribute"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<button title=\"Search\">\ud83d\udd0d</button>",
          "target": [
            "button[title=\"Search\"]"
          ]
        }
      ]
    },
    {
      "id": "bypass",
      "impact": null,
      "tags": [
        "cat.keyboard",
        "wcag2a",
        "wcag241",
        "section508",
        "section508.22.o",
        "TTv5",
        "TT9.a",
        "EN-301-549",
        "EN-9.2.4.1"
      ],
      "description": "Ensure each page has at least one mechanism for a user to bypass navigation and jump straight to the content",
      "help": "Page must have means to bypass repeated blocks",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/bypass?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "internal-link-present",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "Valid skip link found"
            },
            {
              "id": "header-present",
              "data": null,
              "relatedNodes": [
                {
                  "html": "<h1>Cartwell</h1>",
                  "target": [
                    "h1"
                  ]
                },
                {
                  "html": "<h2>Discover Your Next <em>Favorite</em> Thing</h2>",
                  "target": [
                    ".hero-content > h2"
                  ]
                },
                {
                  "html": "<h3>50K+</h3>",
                  "target": [
                    ".hero-stat:nth-child(1) > h3"
                  ]
                },
                {
                  "html": "<h3>4.9\u2605</h3>",
                  "target": [
                    ".hero-stat:nth-child(2) > h3"
                  ]
                },
                {
                  "html": "<h3>2M+</h3>",
                  "target": [
                    ".hero-stat:nth-child(3) > h3"
                  ]
                },
                {
                  "html": "<h2 class=\"section-title\">Gift Guides &amp; Collections</h2>",
                  "target": [
                    ".gift-guides-header > .section-title"
                  ]
                },
                {
                  "html": "<h3>The Ultimate Tech Gift Guide 2024</h3>",
                  "target": [
                    ".guide-card:nth-child(1) > .guide-card-body > h3"
                  ]
                },
                {
                  "html": "<h3>Cozy Home Essentials They'll Actually Use</h3>",
                  "target": [
                    ".guide-card:nth-child(2) > .guide-card-body > h3"
                  ]
                },
                {
                  "html": "<h3>Understated Luxury: Accessories Under $100</h3>",
                  "target": [
                    ".guide-card:nth-child(3) > .guide-card-body > h3"
                  ]
                },
                {
                  "html": "<h2 class=\"section-title\">Top Rated This Week</h2>",
                  "target": [
                    ".top-rated-header > div > .section-title"
                  ]
                },
                {
                  "html": "<h4>AuraSound Pro Wireless Headphones</h4>",
                  "target": [
                    ".product-card:nth-child(1) > .product-card-body > h4"
                  ]
                },
                {
                  "html": "<h4>Handcrafted Ceramic Mug Set (4pc)</h4>",
                  "target": [
                    ".product-card:nth-child(2) > .product-card-body > h4"
                  ]
                },
                {
                  "html": "<h4>Organic Cotton Waffle Throw Blanket</h4>",
                  "target": [
                    ".product-card:nth-child(3) > .product-card-body > h4"
                  ]
                },
                {
                  "html": "<h4>Italian Leather Crossbody Bag</h4>",
                  "target": [
                    ".product-card:nth-child(4) > .product-card-body > h4"
                  ]
                },
                {
                  "html": "<h2 class=\"section-title\">Flash Deals &amp; Customer Favorites</h2>",
                  "target": [
                    "#deals > .container > div:nth-child(1) > .section-title"
                  ]
                },
                {
                  "html": "<h3>SmartHome Hub Pro \u2014 Complete Bundle</h3>",
                  "target": [
                    ".deal-featured-content > h3"
                  ]
                },
                {
                  "html": "<h4>Bamboo Desk Organizer</h4>",
                  "target": [
                    ".deal-card-sm:nth-child(1) > .deal-card-sm-info > h4"
                  ]
                },
                {
                  "html": "<h4>Stainless Steel Water Bottle</h4>",
                  "target": [
                    ".deal-card-sm:nth-child(2) > .deal-card-sm-info > h4"
                  ]
                },
                {
                  "html": "<h4>LED Desk Lamp w/ Charger</h4>",
                  "target": [
                    ".deal-card-sm:nth-child(3) > .deal-card-sm-info > h4"
                  ]
                },
                {
                  "html": "<h4>Merino Wool Travel Socks (3pk)</h4>",
                  "target": [
                    ".deal-card-sm:nth-child(4) > .deal-card-sm-info > h4"
                  ]
                },
                {
                  "html": "<h2>Find Your Perfect Fit</h2>",
                  "target": [
                    ".size-guide-content > h2"
                  ]
                },
                {
                  "html": "<h4>\ud83d\udccf Size Recommendation Tool</h4>",
                  "target": [
                    ".size-guide-tool > h4"
                  ]
                },
                {
                  "html": "<h2 class=\"section-title\">Trusted by 2 Million+ Shoppers</h2>",
                  "target": [
                    ".testimonials-header > .section-title"
                  ]
                },
                {
                  "html": "<h5>Sarah Mitchell</h5>",
                  "target": [
                    ".testimonial-card:nth-child(1) > .reviewer > .reviewer-info > h5"
                  ]
                },
                {
                  "html": "<h5>James Kowalski</h5>",
                  "target": [
                    ".testimonial-card:nth-child(2) > .reviewer > .reviewer-info > h5"
                  ]
                },
                {
                  "html": "<h5>Priya Deshmukh</h5>",
                  "target": [
                    ".testimonial-card:nth-child(3) > .reviewer > .reviewer-info > h5"
                  ]
                },
                {
                  "html": "<h2 class=\"section-title\">Frequently Asked Questions</h2>",
                  "target": [
                    ".faq-header > .section-title"
                  ]
                },
                {
                  "html": "<h2>Join the Cartwell Community</h2>",
                  "target": [
                    ".newsletter-content > h2"
                  ]
                },
                {
                  "html": "<h3>Cartwell</h3>",
                  "target": [
                    ".footer-brand > h3"
                  ]
                },
                {
                  "html": "<h4>Shop</h4>",
                  "target": [
                    ".footer-col:nth-child(2) > h4"
                  ]
                },
                {
                  "html": "<h4>Support</h4>",
                  "target": [
                    ".footer-col:nth-child(3) > h4"
                  ]
                },
                {
                  "html": "<h4>Company</h4>",
                  "target": [
                    ".footer-col:nth-child(4) > h4"
                  ]
                },
                {
                  "html": "<h4>Contact</h4>",
                  "target": [
                    ".footer-col:nth-child(5) > h4"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Page has a heading"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<html lang=\"en\">",
          "target": [
            "html"
          ]
        }
      ]
    },
    {
      "id": "color-contrast",
      "impact": "serious",
      "tags": [
        "cat.color",
        "wcag2aa",
        "wcag143",
        "TTv5",
        "TT13.c",
        "EN-301-549",
        "EN-9.1.4.3",
        "ACT"
      ],
      "description": "Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds",
      "help": "Elements must meet minimum color contrast ratio thresholds",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/color-contrast?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ffffff",
                "bgColor": "#1a1a2e",
                "contrastRatio": 17.05,
                "fontSize": "10.2pt (13.6px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [],
              "impact": "serious",
              "message": "Element has sufficient color contrast of 17.05"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<div class=\"announcement-bar\">\n        \ud83c\udf89 Summer Sale Live Now \u2014 Use code <span>CARTWELL25</span> for 25% off your first order. Free shipping on orders over $75!\n    </div>",
          "target": [
            ".announcement-bar"
          ]
        }
      ]
    },
    {
      "id": "document-title",
      "impact": null,
      "tags": [
        "cat.text-alternatives",
        "wcag2a",
        "wcag242",
        "TTv5",
        "TT12.a",
        "EN-301-549",
        "EN-9.2.4.2",
        "ACT"
      ],
      "description": "Ensure each HTML document contains a non-empty <title> element",
      "help": "Documents must have <title> element to aid in navigation",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/document-title?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "doc-has-title",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "Document has a non-empty <title> element"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<html lang=\"en\">",
          "target": [
            "html"
          ]
        }
      ]
    },
    {
      "id": "form-field-multiple-labels",
      "impact": null,
      "tags": [
        "cat.forms",
        "wcag2a",
        "wcag332",
        "TTv5",
        "TT5.c",
        "EN-301-549",
        "EN-9.3.3.2"
      ],
      "description": "Ensure form field does not have multiple label elements",
      "help": "Form field must not have multiple label elements",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/form-field-multiple-labels?application=axeAPI",
      "nodes": [
        {
          "any": [],
          "all": [],
          "none": [
            {
              "id": "multiple-label",
              "data": null,
              "relatedNodes": [],
              "impact": "moderate",
              "message": "Form field does not have multiple label elements"
            }
          ],
          "impact": null,
          "html": "<select id=\"sizeCategory\">",
          "target": [
            "#sizeCategory"
          ]
        }
      ]
    },
    {
      "id": "html-has-lang",
      "impact": null,
      "tags": [
        "cat.language",
        "wcag2a",
        "wcag311",
        "TTv5",
        "TT11.a",
        "EN-301-549",
        "EN-9.3.1.1",
        "ACT"
      ],
      "description": "Ensure every HTML document has a lang attribute",
      "help": "<html> element must have a lang attribute",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/html-has-lang?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "has-lang",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "The <html> element has a lang attribute"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<html lang=\"en\">",
          "target": [
            "html"
          ]
        }
      ]
    },
    {
      "id": "html-lang-valid",
      "impact": null,
      "tags": [
        "cat.language",
        "wcag2a",
        "wcag311",
        "TTv5",
        "TT11.a",
        "EN-301-549",
        "EN-9.3.1.1",
        "ACT"
      ],
      "description": "Ensure the lang attribute of the <html> element has a valid value",
      "help": "<html> element must have a valid value for the lang attribute",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/html-lang-valid?application=axeAPI",
      "nodes": [
        {
          "any": [],
          "all": [],
          "none": [
            {
              "id": "valid-lang",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "Value of lang attribute is included in the list of valid languages"
            }
          ],
          "impact": null,
          "html": "<html lang=\"en\">",
          "target": [
            "html"
          ]
        }
      ]
    },
    {
      "id": "image-alt",
      "impact": null,
      "tags": [
        "cat.text-alternatives",
        "wcag2a",
        "wcag111",
        "section508",
        "section508.22.a",
        "TTv5",
        "TT7.a",
        "TT7.b",
        "EN-301-549",
        "EN-9.1.1.1",
        "ACT"
      ],
      "description": "Ensure <img> elements have alternative text or a role of none or presentation",
      "help": "Images must have alternative text",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/image-alt?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "has-alt",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element has an alt attribute"
            }
          ],
          "all": [],
          "none": [
            {
              "id": "alt-space-value",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element has a valid alt attribute value"
            }
          ],
          "impact": null,
          "html": "<img src=\"https://placehold.co/42x42/1a1a2e/e63946?text=C&amp;font=montserrat\" alt=\"Cartwell Logo\">",
          "target": [
            "img[alt=\"Cartwell Logo\"]"
          ]
        }
      ]
    },
    {
      "id": "label",
      "impact": null,
      "tags": [
        "cat.forms",
        "wcag2a",
        "wcag412",
        "section508",
        "section508.22.n",
        "TTv5",
        "TT5.c",
        "EN-301-549",
        "EN-9.4.1.2",
        "ACT"
      ],
      "description": "Ensure every form element has a label",
      "help": "Form elements must have labels",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/label?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "non-empty-placeholder",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element has a placeholder attribute"
            }
          ],
          "all": [],
          "none": [
            {
              "id": "hidden-explicit-label",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Form element has a visible explicit <label>"
            }
          ],
          "impact": null,
          "html": "<input type=\"email\" placeholder=\"Enter your email address\" required=\"\">",
          "target": [
            "input"
          ]
        }
      ]
    },
    {
      "id": "link-in-text-block",
      "impact": null,
      "tags": [
        "cat.color",
        "wcag2a",
        "wcag141",
        "TTv5",
        "TT13.a",
        "EN-301-549",
        "EN-9.1.4.1"
      ],
      "description": "Ensure links are distinguished from surrounding text in a way that does not rely on color",
      "help": "Links must be distinguishable without relying on color",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/link-in-text-block?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "link-in-text-block-style",
              "data": null,
              "relatedNodes": [
                {
                  "html": "<div class=\"deal-featured-content\">",
                  "target": [
                    ".deal-featured-content"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Links can be distinguished from surrounding text by visual styling"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<a href=\"#\" class=\"btn btn-primary\">Buy Now \u2014 Save 50%</a>",
          "target": [
            ".btn-primary.btn[href=\"#\"]"
          ]
        }
      ]
    },
    {
      "id": "link-name",
      "impact": null,
      "tags": [
        "cat.name-role-value",
        "wcag2a",
        "wcag244",
        "wcag412",
        "section508",
        "section508.22.a",
        "TTv5",
        "TT6.a",
        "EN-301-549",
        "EN-9.2.4.4",
        "EN-9.4.1.2",
        "ACT"
      ],
      "description": "Ensure links have discernible text",
      "help": "Links must have discernible text",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/link-name?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "has-visible-text",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "Element has text that is visible to screen readers"
            }
          ],
          "all": [],
          "none": [
            {
              "id": "focusable-no-name",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "Element is not in tab order or has accessible text"
            }
          ],
          "impact": null,
          "html": "<a href=\"#home\">Home</a>",
          "target": [
            "a[href$=\"#home\"]"
          ]
        }
      ]
    },
    {
      "id": "list",
      "impact": null,
      "tags": [
        "cat.structure",
        "wcag2a",
        "wcag131",
        "EN-301-549",
        "EN-9.1.3.1"
      ],
      "description": "Ensure that lists are structured correctly",
      "help": "<ul> and <ol> must only directly contain <li>, <script> or <template> elements",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/list?application=axeAPI",
      "nodes": [
        {
          "any": [],
          "all": [],
          "none": [
            {
              "id": "only-listitems",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "List element only has direct children that are allowed inside <li> elements"
            }
          ],
          "impact": null,
          "html": "<ul>",
          "target": [
            ".footer-col:nth-child(2) > ul"
          ]
        }
      ]
    },
    {
      "id": "listitem",
      "impact": null,
      "tags": [
        "cat.structure",
        "wcag2a",
        "wcag131",
        "EN-301-549",
        "EN-9.1.3.1"
      ],
      "description": "Ensure <li> elements are used semantically",
      "help": "<li> elements must be contained in a <ul> or <ol>",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/listitem?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "listitem",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "List item has a <ul>, <ol> or role=\"list\" parent element"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<li><a href=\"#\">New Arrivals</a></li>",
          "target": [
            ".footer-col:nth-child(2) > ul > li:nth-child(1)"
          ]
        }
      ]
    },
    {
      "id": "meta-viewport",
      "impact": null,
      "tags": [
        "cat.sensory-and-visual-cues",
        "wcag2aa",
        "wcag144",
        "EN-301-549",
        "EN-9.1.4.4",
        "ACT"
      ],
      "description": "Ensure <meta name=\"viewport\"> does not disable text scaling and zooming",
      "help": "Zooming and scaling must not be disabled",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/meta-viewport?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "meta-viewport",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "<meta> tag does not disable zooming on mobile devices"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">",
          "target": [
            "meta[name=\"viewport\"]"
          ]
        }
      ]
    },
    {
      "id": "nested-interactive",
      "impact": null,
      "tags": [
        "cat.keyboard",
        "wcag2a",
        "wcag412",
        "TTv5",
        "TT6.a",
        "EN-301-549",
        "EN-9.4.1.2"
      ],
      "description": "Ensure interactive controls are not nested as they are not always announced by screen readers or can cause focus problems for assistive technologies",
      "help": "Interactive controls must not be nested",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/nested-interactive?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "no-focusable-content",
              "data": null,
              "relatedNodes": [],
              "impact": "serious",
              "message": "Element does not have focusable descendants"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<img src=\"https://placehold.co/42x42/1a1a2e/e63946?text=C&amp;font=montserrat\" alt=\"Cartwell Logo\">",
          "target": [
            "img[alt=\"Cartwell Logo\"]"
          ]
        }
      ]
    },
    {
      "id": "target-size",
      "impact": null,
      "tags": [
        "cat.sensory-and-visual-cues",
        "wcag22aa",
        "wcag258"
      ],
      "description": "Ensure touch targets have sufficient size and space",
      "help": "All touch targets must be 24px large, or leave sufficient space",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/target-size?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "target-size",
              "data": {
                "minSize": 24,
                "width": 40.7,
                "height": 24.5
              },
              "relatedNodes": [],
              "impact": "serious",
              "message": "Control has sufficient size (40.7px by 24.5px, should be at least 24px by 24px)"
            },
            {
              "id": "target-offset",
              "data": {
                "closestOffset": 24,
                "minOffset": 24
              },
              "relatedNodes": [],
              "impact": "serious",
              "message": "Target has sufficient space from its closest neighbors. Safe clickable space has a diameter of 24px which is at least 24px."
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<a href=\"#home\">Home</a>",
          "target": [
            "a[href$=\"#home\"]"
          ]
        }
      ]
    }
  ],
  "incomplete": [
    {
      "id": "color-contrast",
      "impact": "serious",
      "tags": [
        "cat.color",
        "wcag2aa",
        "wcag143",
        "TTv5",
        "TT13.c",
        "EN-301-549",
        "EN-9.1.4.3",
        "ACT"
      ],
      "description": "Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds",
      "help": "Elements must meet minimum color contrast ratio thresholds",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/color-contrast?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ffffff",
                "bgColor": "#e63946",
                "contrastRatio": 4.16,
                "fontSize": "7.8pt (10.4px)",
                "fontWeight": "bold",
                "messageKey": "shortTextContent",
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<span class=\"cart-count\">3</span>",
                  "target": [
                    ".cart-count"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element content is too short to determine if it is actual text content"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"cart-count\">3</span>",
          "target": [
            ".cart-count"
          ],
          "failureSummary": "Fix any of the following:\n  Element content is too short to determine if it is actual text content"
        }
      ]
    }
  ],
  "violations": [
    {
      "id": "color-contrast",
      "impact": "serious",
      "tags": [
        "cat.color",
        "wcag2aa",
        "wcag143",
        "TTv5",
        "TT13.c",
        "EN-301-549",
        "EN-9.1.4.3",
        "ACT"
      ],
      "description": "Ensure the contrast between foreground and background colors meets WCAG 2 AA minimum contrast ratio thresholds",
      "help": "Elements must meet minimum color contrast ratio thresholds",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/color-contrast?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#e63946",
                "bgColor": "#fafafa",
                "contrastRatio": 3.99,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<body>",
                  "target": [
                    "body"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.99 (foreground color: #e63946, background color: #fafafa, font size: 9.0pt (12px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"section-label\">Curated For You</span>",
          "target": [
            ".gift-guides-header > .section-label"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.99 (foreground color: #e63946, background color: #fafafa, font size: 9.0pt (12px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#e63946",
                "bgColor": "#fdebed",
                "contrastRatio": 3.62,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<span class=\"tag\">Tech &amp; Gadgets</span>",
                  "target": [
                    ".guide-card:nth-child(1) > .guide-card-body > .tag"
                  ]
                },
                {
                  "html": "<div class=\"guide-card\">",
                  "target": [
                    ".guide-card:nth-child(1)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.62 (foreground color: #e63946, background color: #fdebed, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"tag\">Tech &amp; Gadgets</span>",
          "target": [
            ".guide-card:nth-child(1) > .guide-card-body > .tag"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.62 (foreground color: #e63946, background color: #fdebed, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#e63946",
                "bgColor": "#ffffff",
                "contrastRatio": 4.16,
                "fontSize": "10.2pt (13.6px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"guide-card\">",
                  "target": [
                    ".guide-card:nth-child(1)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.16 (foreground color: #e63946, background color: #ffffff, font size: 10.2pt (13.6px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<a href=\"#\">Browse Guide \u2192</a>",
          "target": [
            ".guide-card:nth-child(1) > .guide-card-body > .guide-meta > a[href=\"#\"]"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.16 (foreground color: #e63946, background color: #ffffff, font size: 10.2pt (13.6px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#e63946",
                "bgColor": "#fdebed",
                "contrastRatio": 3.62,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<span class=\"tag\">Home &amp; Living</span>",
                  "target": [
                    ".guide-card:nth-child(2) > .guide-card-body > .tag"
                  ]
                },
                {
                  "html": "<div class=\"guide-card\">",
                  "target": [
                    ".guide-card:nth-child(2)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.62 (foreground color: #e63946, background color: #fdebed, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"tag\">Home &amp; Living</span>",
          "target": [
            ".guide-card:nth-child(2) > .guide-card-body > .tag"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.62 (foreground color: #e63946, background color: #fdebed, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#e63946",
                "bgColor": "#ffffff",
                "contrastRatio": 4.16,
                "fontSize": "10.2pt (13.6px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"guide-card\">",
                  "target": [
                    ".guide-card:nth-child(2)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.16 (foreground color: #e63946, background color: #ffffff, font size: 10.2pt (13.6px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<a href=\"#\">Browse Guide \u2192</a>",
          "target": [
            ".guide-card:nth-child(2) > .guide-card-body > .guide-meta > a[href=\"#\"]"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.16 (foreground color: #e63946, background color: #ffffff, font size: 10.2pt (13.6px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#e63946",
                "bgColor": "#fdebed",
                "contrastRatio": 3.62,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<span class=\"tag\">Fashion &amp; Style</span>",
                  "target": [
                    ".guide-card:nth-child(3) > .guide-card-body > .tag"
                  ]
                },
                {
                  "html": "<div class=\"guide-card\">",
                  "target": [
                    ".guide-card:nth-child(3)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.62 (foreground color: #e63946, background color: #fdebed, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"tag\">Fashion &amp; Style</span>",
          "target": [
            ".guide-card:nth-child(3) > .guide-card-body > .tag"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.62 (foreground color: #e63946, background color: #fdebed, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#e63946",
                "bgColor": "#ffffff",
                "contrastRatio": 4.16,
                "fontSize": "10.2pt (13.6px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"guide-card\">",
                  "target": [
                    ".guide-card:nth-child(3)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.16 (foreground color: #e63946, background color: #ffffff, font size: 10.2pt (13.6px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<a href=\"#\">Browse Guide \u2192</a>",
          "target": [
            ".guide-card:nth-child(3) > .guide-card-body > .guide-meta > a[href=\"#\"]"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.16 (foreground color: #e63946, background color: #ffffff, font size: 10.2pt (13.6px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ffffff",
                "bgColor": "#e63946",
                "contrastRatio": 4.16,
                "fontSize": "8.4pt (11.2px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<span class=\"product-badge sale\">-30%</span>",
                  "target": [
                    ".product-card:nth-child(1) > .sale.product-badge"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.16 (foreground color: #ffffff, background color: #e63946, font size: 8.4pt (11.2px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"product-badge sale\">-30%</span>",
          "target": [
            ".product-card:nth-child(1) > .sale.product-badge"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.16 (foreground color: #ffffff, background color: #e63946, font size: 8.4pt (11.2px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ffffff",
                "bgColor": "#10b981",
                "contrastRatio": 2.53,
                "fontSize": "8.4pt (11.2px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<span class=\"product-badge new\">New</span>",
                  "target": [
                    ".new"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 2.53 (foreground color: #ffffff, background color: #10b981, font size: 8.4pt (11.2px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"product-badge new\">New</span>",
          "target": [
            ".new"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 2.53 (foreground color: #ffffff, background color: #10b981, font size: 8.4pt (11.2px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ffffff",
                "bgColor": "#e63946",
                "contrastRatio": 4.16,
                "fontSize": "8.4pt (11.2px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<span class=\"product-badge sale\">-20%</span>",
                  "target": [
                    ".product-card:nth-child(3) > .sale.product-badge"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.16 (foreground color: #ffffff, background color: #e63946, font size: 8.4pt (11.2px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"product-badge sale\">-20%</span>",
          "target": [
            ".product-card:nth-child(3) > .sale.product-badge"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.16 (foreground color: #ffffff, background color: #e63946, font size: 8.4pt (11.2px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#e63946",
                "bgColor": "#fafafa",
                "contrastRatio": 3.99,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<body>",
                  "target": [
                    "body"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.99 (foreground color: #e63946, background color: #fafafa, font size: 9.0pt (12px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"section-label\">Don't Miss Out</span>",
          "target": [
            "#deals > .container > div:nth-child(1) > .section-label"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.99 (foreground color: #e63946, background color: #fafafa, font size: 9.0pt (12px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#e63946",
                "bgColor": "#ffffff",
                "contrastRatio": 4.16,
                "fontSize": "9.6pt (12.8px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"deal-card-sm\">",
                  "target": [
                    ".deal-card-sm:nth-child(1)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.16 (foreground color: #e63946, background color: #ffffff, font size: 9.6pt (12.8px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"deal-discount\">40% OFF \u2014 $18.99</span>",
          "target": [
            ".deal-card-sm:nth-child(1) > .deal-card-sm-info > .deal-discount"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.16 (foreground color: #e63946, background color: #ffffff, font size: 9.6pt (12.8px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#e63946",
                "bgColor": "#ffffff",
                "contrastRatio": 4.16,
                "fontSize": "9.6pt (12.8px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"deal-card-sm\">",
                  "target": [
                    ".deal-card-sm:nth-child(2)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.16 (foreground color: #e63946, background color: #ffffff, font size: 9.6pt (12.8px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"deal-discount\">35% OFF \u2014 $22.75</span>",
          "target": [
            ".deal-card-sm:nth-child(2) > .deal-card-sm-info > .deal-discount"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.16 (foreground color: #e63946, background color: #ffffff, font size: 9.6pt (12.8px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#e63946",
                "bgColor": "#ffffff",
                "contrastRatio": 4.16,
                "fontSize": "9.6pt (12.8px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"deal-card-sm\">",
                  "target": [
                    ".deal-card-sm:nth-child(3)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.16 (foreground color: #e63946, background color: #ffffff, font size: 9.6pt (12.8px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"deal-discount\">25% OFF \u2014 $37.50</span>",
          "target": [
            ".deal-card-sm:nth-child(3) > .deal-card-sm-info > .deal-discount"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.16 (foreground color: #e63946, background color: #ffffff, font size: 9.6pt (12.8px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#e63946",
                "bgColor": "#ffffff",
                "contrastRatio": 4.16,
                "fontSize": "9.6pt (12.8px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"deal-card-sm\">",
                  "target": [
                    ".deal-card-sm:nth-child(4)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.16 (foreground color: #e63946, background color: #ffffff, font size: 9.6pt (12.8px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"deal-discount\">30% OFF \u2014 $27.99</span>",
          "target": [
            ".deal-card-sm:nth-child(4) > .deal-card-sm-info > .deal-discount"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.16 (foreground color: #e63946, background color: #ffffff, font size: 9.6pt (12.8px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ffffff",
                "bgColor": "#e63946",
                "contrastRatio": 4.16,
                "fontSize": "10.8pt (14.4px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<button class=\"btn btn-primary\" style=\"width:100%; justify-content: center; margin-bottom: 16px;\" onclick=\"findSize()\">Find My Size</button>",
                  "target": [
                    "button[onclick=\"findSize()\"]"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.16 (foreground color: #ffffff, background color: #e63946, font size: 10.8pt (14.4px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<button class=\"btn btn-primary\" style=\"width:100%; justify-content: center; margin-bottom: 16px;\" onclick=\"findSize()\">Find My Size</button>",
          "target": [
            "button[onclick=\"findSize()\"]"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.16 (foreground color: #ffffff, background color: #e63946, font size: 10.8pt (14.4px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#e63946",
                "bgColor": "#fafafa",
                "contrastRatio": 3.99,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<body>",
                  "target": [
                    "body"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.99 (foreground color: #e63946, background color: #fafafa, font size: 9.0pt (12px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"section-label\">What Our Customers Say</span>",
          "target": [
            ".testimonials-header > .section-label"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.99 (foreground color: #e63946, background color: #fafafa, font size: 9.0pt (12px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#e63946",
                "bgColor": "#ffffff",
                "contrastRatio": 4.16,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<section class=\"faq-section\">",
                  "target": [
                    ".faq-section"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 4.16 (foreground color: #e63946, background color: #ffffff, font size: 9.0pt (12px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"section-label\">Got Questions?</span>",
          "target": [
            ".faq-header > .section-label"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 4.16 (foreground color: #e63946, background color: #ffffff, font size: 9.0pt (12px), font weight: bold). Expected contrast ratio of 4.5:1"
        }
      ]
    },
    {
      "id": "select-name",
      "impact": "critical",
      "tags": [
        "cat.forms",
        "wcag2a",
        "wcag412",
        "section508",
        "section508.22.n",
        "TTv5",
        "TT5.c",
        "EN-301-549",
        "EN-9.4.1.2",
        "ACT"
      ],
      "description": "Ensure select element has an accessible name",
      "help": "Select element must have an accessible name",
      "helpUrl": "https://dequeuniversity.com/rules/axe/4.10/select-name?application=axeAPI",
      "nodes": [
        {
          "any": [
            {
              "id": "implicit-label",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element does not have an implicit (wrapped) <label>"
            },
            {
              "id": "explicit-label",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element does not have an explicit <label>"
            },
            {
              "id": "aria-label",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "aria-label attribute does not exist or is empty"
            },
            {
              "id": "aria-labelledby",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty"
            },
            {
              "id": "non-empty-title",
              "data": {
                "messageKey": "noAttr"
              },
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element has no title attribute"
            },
            {
              "id": "presentational-role",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element's default semantics were not overridden with role=\"none\" or role=\"presentation\""
            }
          ],
          "all": [],
          "none": [],
          "impact": "critical",
          "html": "<select id=\"sizeCategory\">",
          "target": [
            "#sizeCategory"
          ],
          "failureSummary": "Fix any of the following:\n  Element does not have an implicit (wrapped) <label>\n  Element does not have an explicit <label>\n  aria-label attribute does not exist or is empty\n  aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n  Element has no title attribute\n  Element's default semantics were not overridden with role=\"none\" or role=\"presentation\""
        },
        {
          "any": [
            {
              "id": "implicit-label",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element does not have an implicit (wrapped) <label>"
            },
            {
              "id": "explicit-label",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element does not have an explicit <label>"
            },
            {
              "id": "aria-label",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "aria-label attribute does not exist or is empty"
            },
            {
              "id": "aria-labelledby",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty"
            },
            {
              "id": "non-empty-title",
              "data": {
                "messageKey": "noAttr"
              },
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element has no title attribute"
            },
            {
              "id": "presentational-role",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element's default semantics were not overridden with role=\"none\" or role=\"presentation\""
            }
          ],
          "all": [],
          "none": [],
          "impact": "critical",
          "html": "<select id=\"sizeFit\">",
          "target": [
            "#sizeFit"
          ],
          "failureSummary": "Fix any of the following:\n  Element does not have an implicit (wrapped) <label>\n  Element does not have an explicit <label>\n  aria-label attribute does not exist or is empty\n  aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n  Element has no title attribute\n  Element's default semantics were not overridden with role=\"none\" or role=\"presentation\""
        },
        {
          "any": [
            {
              "id": "implicit-label",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element does not have an implicit (wrapped) <label>"
            },
            {
              "id": "explicit-label",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element does not have an explicit <label>"
            },
            {
              "id": "aria-label",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "aria-label attribute does not exist or is empty"
            },
            {
              "id": "aria-labelledby",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty"
            },
            {
              "id": "non-empty-title",
              "data": {
                "messageKey": "noAttr"
              },
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element has no title attribute"
            },
            {
              "id": "presentational-role",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element's default semantics were not overridden with role=\"none\" or role=\"presentation\""
            }
          ],
          "all": [],
          "none": [],
          "impact": "critical",
          "html": "<select id=\"sizeHeight\">",
          "target": [
            "#sizeHeight"
          ],
          "failureSummary": "Fix any of the following:\n  Element does not have an implicit (wrapped) <label>\n  Element does not have an explicit <label>\n  aria-label attribute does not exist or is empty\n  aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n  Element has no title attribute\n  Element's default semantics were not overridden with role=\"none\" or role=\"presentation\""
        },
        {
          "any": [
            {
              "id": "implicit-label",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element does not have an implicit (wrapped) <label>"
            },
            {
              "id": "explicit-label",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element does not have an explicit <label>"
            },
            {
              "id": "aria-label",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "aria-label attribute does not exist or is empty"
            },
            {
              "id": "aria-labelledby",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty"
            },
            {
              "id": "non-empty-title",
              "data": {
                "messageKey": "noAttr"
              },
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element has no title attribute"
            },
            {
              "id": "presentational-role",
              "data": null,
              "relatedNodes": [],
              "impact": "critical",
              "message": "Element's default semantics were not overridden with role=\"none\" or role=\"presentation\""
            }
          ],
          "all": [],
          "none": [],
          "impact": "critical",
          "html": "<select id=\"sizeUsual\">",
          "target": [
            "#sizeUsual"
          ],
          "failureSummary": "Fix any of the following:\n  Element does not have an implicit (wrapped) <label>\n  Element does not have an explicit <label>\n  aria-label attribute does not exist or is empty\n  aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n  Element has no title attribute\n  Element's default semantics were not overridden with role=\"none\" or role=\"presentation\""
        }
      ]
    }
  ],
  "coverage": {
    "contract": "main-document-vertical-scroll",
    "complete": true,
    "positions": [
      {
        "y": 0,
        "height": 7241
      },
      {
        "y": 576,
        "height": 7241
      },
      {
        "y": 1152,
        "height": 7241
      },
      {
        "y": 1728,
        "height": 7241
      },
      {
        "y": 2304,
        "height": 7241
      },
      {
        "y": 2880,
        "height": 7241
      },
      {
        "y": 3456,
        "height": 7241
      },
      {
        "y": 4032,
        "height": 7241
      },
      {
        "y": 4608,
        "height": 7241
      },
      {
        "y": 5184,
        "height": 7241
      },
      {
        "y": 5760,
        "height": 7241
      },
      {
        "y": 6336,
        "height": 7241
      },
      {
        "y": 6521,
        "height": 7241
      }
    ],
    "scans": 14,
    "max_states": 512,
    "settle_ms": 5000,
    "page_timeout_seconds": 150,
    "layout_stability": "consecutive 100ms size samples within one CSS pixel",
    "animation_settling": "finite animations present when scroll resources are ready finish or are cancelled",
    "interactive_states": "not exercised",
    "horizontal_scroll": "not exercised"
  }
}
System Prompt
You are a lead web developer at a top digital agency, tasked with creating a one-page website for a new client based on the given specifications, delivered as an HTML file. First non-whitespace char '<', last non-whitespace char '>'. Use the following services to generate placeholder images where needed:
- placehold.co (text): https://placehold.co/[{w}x{h}|{size}][/{bg-color}/{text-color}]?text={text}&font=[lato|lora|montserrat|noto sans|open sans|oswald|playfair display|poppins|pt sans|raleway|roboto|source sans|source sans pro]
- picsum.photos (photos): https://picsum.photos/[{w}/{h}|{size}]?[grayscale][&blur={1-10}]
- pravatar.cc (avatars): https://i.pravatar.cc/{size}?u={identifier}
Choose sizes appropriate to layout.
User Prompt
Create a **complete, polished, production-quality** primary web page for a new client in the "Shopping" sector.
Your goal is to generate the full HTML code for a page that is not just functional but also visually compelling, content-rich, and feels like a finished product ready for launch.

**Client & Category:**
- Industry: "Shopping"
- Description: Online shopping, e-commerce, deals, retail products, and gift guides.

**Your Creative Task:**
1.  **Invent:** Create a unique, professional-sounding site name and a strong tagline fitting the "Shopping" category.
2.  **Define Page:** Determine the most effective primary page type (e.g., homepage, service landing page, category portal) to showcase this fictional entity.
3.  **Design:** Develop an opinionated, modern, and professional layout. Make distinct choices about structure and flow.

**Content & Structure Requirements (Deliver a COMPLETE page):**
-   **Overall:** The final page must feel substantial and complete, with realistic amounts of text (multiple paragraphs per section where appropriate, avoid single sentences), well-integrated placeholder images, and logical flow. It should look like a real website a business would proudly use.
-   **HEADER:** Include the invented site name, tagline, a logo placeholder image, and a primary navigation bar. Ensure the navigation has **at least 5-7 clearly defined, relevant links** including: "Reviews", "New Arrivals", "Contact".
-   **MAIN CONTENT:** Structure this area with **at least 3-4 distinct, well-developed sections**.
    -   Address key topics relevant to the "Shopping" category. Consider themes similar to: "Gift Guides", "Top Rated", "Customer Favorites".
    -   **Content Depth:** Populate each section with **substantial, realistic text** (multiple sentences/paragraphs). Use authentic industry language and terminology like: "price match", "SKU", "loyalty program".
    -   **Visuals:** Integrate relevant placeholder images logically within the content sections.
    -   **Calls to Action:** Include clear and contextually relevant CTAs. Use strong verbs similar to: "Track Order", "Quick View", "Buy Now".
-   **ENGAGEMENT (Recommended):** Strongly consider incorporating **one meaningful interactive element** that would genuinely benefit a user in the "Shopping" sector. Ideas similar but not limited to: "size guide".
-   **SIDEBAR (Optional):** If your design includes a sidebar, populate it with **useful, relevant content**. Ideas: "recommendations", "flash sales", "new arrivals".
-   **FOOTER:** Include a professional footer with invented contact details, copyright (current year), social media links, and standard links (Privacy, Terms).
-   **MODERN WEB PATTERNS:** Include modern web patterns like testimonial cards, feature grids, or FAQ accordions where appropriate.