Qwen Qwen3.7 Plus – News Weather Information

via Alibaba · Generated

  • AIMAC Debt 4.99
  • Cost $0.026
  • Total Violations 23
  • HTML Size 78 KB
  • Em Dashes 10

Screenshot

View Qwen Qwen3.7 Plus News Weather Information page View Live Page

Accessibility Issues Found

23 Serious

  • color-contrast serious 23 instances

    Elements must meet minimum color contrast ratio thresholds

    Example HTML <div class="tagline">Your World, In Focus</div>

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>Meridian Pulse — Your World, In Focus</title>
    <style>
        @import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;700;900&family=Source+Sans+3:wght@300;400;500;600;700&family=Roboto+Mono:wght@400;500&display=swap');

        :root {
            --navy: #0f1923;
            --navy-light: #1a2a3a;
            --accent: #d42b2b;
            --accent-hover: #b81f1f;
            --gold: #f0a500;
            --sky: #4a9eed;
            --text-primary: #1a1a1a;
            --text-secondary: #555;
            --text-light: #888;
            --bg-light: #f5f6f8;
            --bg-white: #ffffff;
            --border: #e0e3e8;
            --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 8px 30px rgba(0,0,0,0.12);
            --radius: 8px;
            --transition: all 0.3s ease;
        }

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

        body {
            font-family: 'Source Sans 3', -apple-system, BlinkMacSystemFont, sans-serif;
            color: var(--text-primary);
            background: var(--bg-white);
            line-height: 1.6;
            -webkit-font-smoothing: antialiased;
        }

        /* TOP BAR */
        .top-bar {
            background: var(--navy);
            color: #ccc;
            font-size: 0.8rem;
            padding: 6px 0;
            border-bottom: 1px solid rgba(255,255,255,0.1);
        }

        .top-bar .container {
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .top-bar a {
            color: #ccc;
            text-decoration: none;
            transition: var(--transition);
        }

        .top-bar a:hover {
            color: var(--gold);
        }

        .top-bar-left {
            display: flex;
            gap: 16px;
            align-items: center;
        }

        .top-bar-right {
            display: flex;
            gap: 14px;
            align-items: center;
        }

        .live-dot {
            width: 8px;
            height: 8px;
            background: var(--accent);
            border-radius: 50%;
            display: inline-block;
            animation: pulse-dot 1.5s infinite;
            margin-right: 4px;
        }

        @keyframes pulse-dot {
            0%, 100% { opacity: 1; transform: scale(1); }
            50% { opacity: 0.5; transform: scale(1.3); }
        }

        /* HEADER */
        .header {
            background: var(--bg-white);
            border-bottom: 3px solid var(--accent);
            position: sticky;
            top: 0;
            z-index: 1000;
            box-shadow: var(--shadow-md);
        }

        .header-main {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 16px 0;
        }

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

        .logo-area img {
            height: 48px;
            width: auto;
        }

        .logo-text h1 {
            font-family: 'Playfair Display', serif;
            font-size: 1.8rem;
            font-weight: 900;
            color: var(--navy);
            letter-spacing: -0.5px;
            line-height: 1.1;
        }

        .logo-text .tagline {
            font-size: 0.75rem;
            color: var(--text-light);
            font-weight: 400;
            letter-spacing: 1px;
            text-transform: uppercase;
        }

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

        .btn {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            padding: 10px 20px;
            border-radius: 4px;
            font-weight: 600;
            font-size: 0.85rem;
            text-decoration: none;
            cursor: pointer;
            border: none;
            transition: var(--transition);
            font-family: inherit;
        }

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

        .btn-primary:hover {
            background: var(--accent-hover);
            transform: translateY(-1px);
            box-shadow: var(--shadow-md);
        }

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

        .btn-outline:hover {
            background: var(--navy);
            color: white;
        }

        .btn-gold {
            background: var(--gold);
            color: var(--navy);
        }

        .btn-gold:hover {
            background: #d99200;
            transform: translateY(-1px);
        }

        /* NAVIGATION */
        .main-nav {
            background: var(--navy-light);
        }

        .main-nav ul {
            display: flex;
            list-style: none;
            gap: 0;
        }

        .main-nav a {
            display: block;
            padding: 12px 18px;
            color: #ddd;
            text-decoration: none;
            font-size: 0.88rem;
            font-weight: 500;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            transition: var(--transition);
            position: relative;
        }

        .main-nav a:hover,
        .main-nav a.active {
            color: white;
            background: rgba(255,255,255,0.08);
        }

        .main-nav a.active::after {
            content: '';
            position: absolute;
            bottom: 0;
            left: 18px;
            right: 18px;
            height: 3px;
            background: var(--accent);
        }

        .main-nav a.breaking {
            color: var(--gold);
        }

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

        /* BREAKING NEWS TICKER */
        .ticker-wrap {
            background: var(--accent);
            color: white;
            padding: 10px 0;
            overflow: hidden;
        }

        .ticker-inner {
            display: flex;
            align-items: center;
            gap: 16px;
        }

        .ticker-label {
            background: rgba(0,0,0,0.3);
            padding: 4px 12px;
            font-weight: 700;
            font-size: 0.75rem;
            text-transform: uppercase;
            letter-spacing: 1px;
            white-space: nowrap;
            border-radius: 3px;
        }

        .ticker-content {
            display: flex;
            animation: ticker-scroll 30s linear infinite;
            gap: 60px;
            white-space: nowrap;
        }

        .ticker-content span {
            font-size: 0.88rem;
            font-weight: 500;
        }

        .ticker-content span::before {
            content: '●';
            margin-right: 10px;
            color: var(--gold);
        }

        @keyframes ticker-scroll {
            0% { transform: translateX(0); }
            100% { transform: translateX(-50%); }
        }

        /* HERO SECTION */
        .hero-section {
            padding: 32px 0;
            background: var(--bg-light);
        }

        .hero-grid {
            display: grid;
            grid-template-columns: 1.4fr 0.6fr;
            gap: 24px;
        }

        .hero-main {
            position: relative;
            border-radius: var(--radius);
            overflow: hidden;
            box-shadow: var(--shadow-lg);
            cursor: pointer;
        }

        .hero-main img {
            width: 100%;
            height: 460px;
            object-fit: cover;
            display: block;
            transition: transform 0.5s ease;
        }

        .hero-main:hover img {
            transform: scale(1.02);
        }

        .hero-overlay {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            padding: 40px 32px 32px;
            background: linear-gradient(transparent, rgba(0,0,0,0.85));
            color: white;
        }

        .hero-category {
            display: inline-block;
            background: var(--accent);
            color: white;
            padding: 4px 12px;
            font-size: 0.72rem;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 1px;
            border-radius: 3px;
            margin-bottom: 12px;
        }

        .hero-overlay h2 {
            font-family: 'Playfair Display', serif;
            font-size: 2rem;
            font-weight: 900;
            line-height: 1.2;
            margin-bottom: 10px;
        }

        .hero-overlay p {
            font-size: 0.95rem;
            opacity: 0.9;
            line-height: 1.5;
        }

        .hero-meta {
            margin-top: 12px;
            font-size: 0.78rem;
            opacity: 0.7;
        }

        .hero-sidebar {
            display: flex;
            flex-direction: column;
            gap: 16px;
        }

        .hero-side-card {
            position: relative;
            border-radius: var(--radius);
            overflow: hidden;
            flex: 1;
            cursor: pointer;
            box-shadow: var(--shadow-sm);
        }

        .hero-side-card img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
            transition: transform 0.4s ease;
        }

        .hero-side-card:hover img {
            transform: scale(1.05);
        }

        .hero-side-overlay {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            padding: 20px 16px 16px;
            background: linear-gradient(transparent, rgba(0,0,0,0.8));
            color: white;
        }

        .hero-side-overlay .hero-category {
            font-size: 0.65rem;
            padding: 3px 8px;
            margin-bottom: 8px;
        }

        .hero-side-overlay h3 {
            font-family: 'Playfair Display', serif;
            font-size: 1.05rem;
            font-weight: 700;
            line-height: 1.3;
        }

        /* MAIN LAYOUT */
        .main-layout {
            display: grid;
            grid-template-columns: 1fr 340px;
            gap: 36px;
            padding: 40px 0;
        }

        /* SECTION HEADERS */
        .section-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            margin-bottom: 24px;
            padding-bottom: 12px;
            border-bottom: 2px solid var(--navy);
        }

        .section-header h2 {
            font-family: 'Playfair Display', serif;
            font-size: 1.5rem;
            font-weight: 900;
            color: var(--navy);
        }

        .section-header .view-all {
            font-size: 0.82rem;
            color: var(--accent);
            text-decoration: none;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.5px;
        }

        .section-header .view-all:hover {
            text-decoration: underline;
        }

        /* NEWS CARDS */
        .news-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 24px;
            margin-bottom: 48px;
        }

        .news-card {
            background: var(--bg-white);
            border-radius: var(--radius);
            overflow: hidden;
            box-shadow: var(--shadow-sm);
            border: 1px solid var(--border);
            transition: var(--transition);
            cursor: pointer;
        }

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

        .news-card img {
            width: 100%;
            height: 180px;
            object-fit: cover;
            display: block;
        }

        .news-card-body {
            padding: 18px;
        }

        .news-card-category {
            font-size: 0.7rem;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 1px;
            color: var(--accent);
            margin-bottom: 8px;
        }

        .news-card-body h3 {
            font-family: 'Playfair Display', serif;
            font-size: 1.1rem;
            font-weight: 700;
            line-height: 1.3;
            margin-bottom: 8px;
            color: var(--navy);
        }

        .news-card-body p {
            font-size: 0.88rem;
            color: var(--text-secondary);
            line-height: 1.5;
            margin-bottom: 12px;
        }

        .news-card-meta {
            display: flex;
            align-items: center;
            gap: 10px;
            font-size: 0.75rem;
            color: var(--text-light);
        }

        .news-card-meta img {
            width: 28px;
            height: 28px;
            border-radius: 50%;
            object-fit: cover;
        }

        /* INVESTIGATIVE SECTION */
        .investigative-section {
            margin-bottom: 48px;
        }

        .investigative-feature {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 0;
            border-radius: var(--radius);
            overflow: hidden;
            box-shadow: var(--shadow-lg);
            margin-bottom: 24px;
        }

        .investigative-feature img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            display: block;
            min-height: 320px;
        }

        .investigative-content {
            padding: 36px;
            background: var(--navy);
            color: white;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }

        .investigative-badge {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            background: rgba(212, 43, 43, 0.2);
            border: 1px solid var(--accent);
            color: var(--accent);
            padding: 5px 12px;
            font-size: 0.7rem;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 1px;
            border-radius: 3px;
            margin-bottom: 16px;
            width: fit-content;
        }

        .investigative-content h3 {
            font-family: 'Playfair Display', serif;
            font-size: 1.6rem;
            font-weight: 900;
            line-height: 1.25;
            margin-bottom: 14px;
        }

        .investigative-content p {
            font-size: 0.92rem;
            line-height: 1.7;
            opacity: 0.85;
            margin-bottom: 12px;
        }

        .investigative-content .btn {
            margin-top: 12px;
            width: fit-content;
        }

        /* WEATHER SECTION */
        .weather-section {
            margin-bottom: 48px;
            background: linear-gradient(135deg, #1a3a5c 0%, #0f2847 100%);
            border-radius: var(--radius);
            padding: 32px;
            color: white;
            box-shadow: var(--shadow-lg);
        }

        .weather-section .section-header {
            border-bottom-color: rgba(255,255,255,0.2);
        }

        .weather-section .section-header h2 {
            color: white;
        }

        .weather-section .section-header .view-all {
            color: var(--gold);
        }

        .weather-current {
            display: grid;
            grid-template-columns: auto 1fr auto;
            gap: 32px;
            align-items: center;
            margin-bottom: 28px;
            padding-bottom: 24px;
            border-bottom: 1px solid rgba(255,255,255,0.15);
        }

        .weather-temp {
            text-align: center;
        }

        .weather-temp .temp-value {
            font-size: 4.5rem;
            font-weight: 300;
            line-height: 1;
        }

        .weather-temp .temp-unit {
            font-size: 1.5rem;
            vertical-align: top;
            opacity: 0.7;
        }

        .weather-temp .temp-condition {
            font-size: 1rem;
            opacity: 0.8;
            margin-top: 4px;
        }

        .weather-details {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 12px;
        }

        .weather-detail-item {
            display: flex;
            align-items: center;
            gap: 8px;
            font-size: 0.88rem;
        }

        .weather-detail-item .label {
            opacity: 0.6;
            font-size: 0.78rem;
        }

        .weather-detail-item .value {
            font-weight: 600;
        }

        .weather-location {
            text-align: right;
        }

        .weather-location .city {
            font-size: 1.3rem;
            font-weight: 600;
        }

        .weather-location .date {
            font-size: 0.85rem;
            opacity: 0.7;
        }

        /* Weather Radar Interactive */
        .weather-radar {
            position: relative;
            background: rgba(0,0,0,0.3);
            border-radius: var(--radius);
            overflow: hidden;
            margin-bottom: 24px;
            cursor: crosshair;
        }

        .weather-radar img {
            width: 100%;
            height: 220px;
            object-fit: cover;
            display: block;
            opacity: 0.8;
        }

        .radar-overlay {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            padding: 16px;
        }

        .radar-top {
            display: flex;
            justify-content: space-between;
            align-items: flex-start;
        }

        .radar-label {
            background: rgba(0,0,0,0.6);
            padding: 6px 12px;
            border-radius: 4px;
            font-size: 0.78rem;
            font-weight: 600;
            backdrop-filter: blur(4px);
        }

        .radar-controls {
            display: flex;
            gap: 8px;
        }

        .radar-btn {
            background: rgba(255,255,255,0.15);
            border: 1px solid rgba(255,255,255,0.3);
            color: white;
            padding: 6px 12px;
            border-radius: 4px;
            font-size: 0.75rem;
            cursor: pointer;
            transition: var(--transition);
            backdrop-filter: blur(4px);
        }

        .radar-btn:hover, .radar-btn.active {
            background: var(--sky);
            border-color: var(--sky);
        }

        .radar-bottom {
            display: flex;
            justify-content: space-between;
            align-items: flex-end;
        }

        .radar-timeline {
            display: flex;
            gap: 4px;
            align-items: flex-end;
        }

        .radar-timeline-bar {
            width: 6px;
            background: rgba(255,255,255,0.4);
            border-radius: 2px;
            transition: var(--transition);
            cursor: pointer;
        }

        .radar-timeline-bar:hover, .radar-timeline-bar.active {
            background: var(--gold);
        }

        .radar-legend {
            display: flex;
            gap: 8px;
            align-items: center;
            font-size: 0.7rem;
            opacity: 0.8;
        }

        .legend-color {
            width: 12px;
            height: 12px;
            border-radius: 2px;
        }

        /* Weather Forecast */
        .forecast-grid {
            display: grid;
            grid-template-columns: repeat(5, 1fr);
            gap: 12px;
        }

        .forecast-day {
            text-align: center;
            padding: 16px 8px;
            background: rgba(255,255,255,0.08);
            border-radius: 6px;
            border: 1px solid rgba(255,255,255,0.1);
            transition: var(--transition);
        }

        .forecast-day:hover {
            background: rgba(255,255,255,0.15);
        }

        .forecast-day .day-name {
            font-size: 0.78rem;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.5px;
            margin-bottom: 8px;
            opacity: 0.8;
        }

        .forecast-day .day-icon {
            font-size: 1.8rem;
            margin-bottom: 8px;
        }

        .forecast-day .day-temp {
            font-size: 1.1rem;
            font-weight: 700;
        }

        .forecast-day .day-low {
            font-size: 0.8rem;
            opacity: 0.6;
        }

        .weather-alert {
            background: rgba(240, 165, 0, 0.15);
            border: 1px solid var(--gold);
            border-radius: 6px;
            padding: 14px 18px;
            margin-top: 20px;
            display: flex;
            align-items: flex-start;
            gap: 12px;
        }

        .weather-alert-icon {
            font-size: 1.3rem;
            flex-shrink: 0;
        }

        .weather-alert-text {
            font-size: 0.85rem;
            line-height: 1.5;
        }

        .weather-alert-text strong {
            color: var(--gold);
        }

        /* SIDEBAR */
        .sidebar {
            position: sticky;
            top: 120px;
            align-self: start;
        }

        .sidebar-widget {
            margin-bottom: 32px;
            background: var(--bg-white);
            border: 1px solid var(--border);
            border-radius: var(--radius);
            overflow: hidden;
        }

        .sidebar-widget-header {
            padding: 14px 18px;
            background: var(--navy);
            color: white;
            font-family: 'Playfair Display', serif;
            font-size: 1rem;
            font-weight: 700;
        }

        .sidebar-widget-body {
            padding: 18px;
        }

        /* Most Read */
        .most-read-item {
            display: flex;
            gap: 14px;
            padding: 12px 0;
            border-bottom: 1px solid var(--border);
            cursor: pointer;
            transition: var(--transition);
        }

        .most-read-item:last-child {
            border-bottom: none;
        }

        .most-read-item:hover {
            opacity: 0.8;
        }

        .most-read-number {
            font-family: 'Playfair Display', serif;
            font-size: 1.8rem;
            font-weight: 900;
            color: var(--accent);
            line-height: 1;
            min-width: 30px;
        }

        .most-read-text h4 {
            font-size: 0.88rem;
            font-weight: 600;
            line-height: 1.3;
            margin-bottom: 4px;
            color: var(--navy);
        }

        .most-read-text .meta {
            font-size: 0.72rem;
            color: var(--text-light);
        }

        /* Events Widget */
        .event-item {
            padding: 12px 0;
            border-bottom: 1px solid var(--border);
        }

        .event-item:last-child {
            border-bottom: none;
        }

        .event-date {
            display: flex;
            align-items: center;
            gap: 10px;
            margin-bottom: 6px;
        }

        .event-date-box {
            background: var(--accent);
            color: white;
            padding: 6px 10px;
            border-radius: 4px;
            text-align: center;
            min-width: 48px;
        }

        .event-date-box .month {
            font-size: 0.6rem;
            text-transform: uppercase;
            font-weight: 700;
            letter-spacing: 1px;
        }

        .event-date-box .day {
            font-size: 1.2rem;
            font-weight: 700;
            line-height: 1;
        }

        .event-info h4 {
            font-size: 0.85rem;
            font-weight: 600;
            color: var(--navy);
            margin-bottom: 2px;
        }

        .event-info p {
            font-size: 0.75rem;
            color: var(--text-light);
        }

        /* Newsletter Widget */
        .newsletter-widget {
            background: linear-gradient(135deg, var(--navy), var(--navy-light));
            border: none;
            color: white;
        }

        .newsletter-widget .sidebar-widget-header {
            background: transparent;
            border-bottom: 1px solid rgba(255,255,255,0.1);
        }

        .newsletter-widget .sidebar-widget-body p {
            font-size: 0.85rem;
            opacity: 0.85;
            margin-bottom: 14px;
            line-height: 1.5;
        }

        .newsletter-form {
            display: flex;
            flex-direction: column;
            gap: 10px;
        }

        .newsletter-form input {
            padding: 10px 14px;
            border: 1px solid rgba(255,255,255,0.2);
            border-radius: 4px;
            background: rgba(255,255,255,0.1);
            color: white;
            font-size: 0.88rem;
            font-family: inherit;
            outline: none;
            transition: var(--transition);
        }

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

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

        .newsletter-form .btn {
            width: 100%;
            justify-content: center;
        }

        /* LOCAL COVERAGE SECTION */
        .local-section {
            margin-bottom: 48px;
        }

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

        .local-card {
            background: var(--bg-white);
            border: 1px solid var(--border);
            border-radius: var(--radius);
            padding: 20px;
            transition: var(--transition);
            cursor: pointer;
        }

        .local-card:hover {
            box-shadow: var(--shadow-md);
            border-color: var(--accent);
        }

        .local-card-icon {
            width: 40px;
            height: 40px;
            background: var(--bg-light);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            font-size: 1.2rem;
            margin-bottom: 12px;
        }

        .local-card h4 {
            font-size: 1rem;
            font-weight: 700;
            color: var(--navy);
            margin-bottom: 8px;
        }

        .local-card p {
            font-size: 0.85rem;
            color: var(--text-secondary);
            line-height: 1.5;
        }

        /* TESTIMONIAL / TRUST SECTION */
        .trust-section {
            background: var(--bg-light);
            padding: 48px 0;
            margin: 0 -24px;
            padding-left: 24px;
            padding-right: 24px;
        }

        .trust-section .section-header {
            text-align: center;
            justify-content: center;
            border-bottom: none;
            margin-bottom: 32px;
        }

        .trust-section .section-header h2 {
            font-size: 1.8rem;
        }

        .trust-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 24px;
            max-width: 1280px;
            margin: 0 auto;
        }

        .trust-card {
            background: var(--bg-white);
            border-radius: var(--radius);
            padding: 28px;
            box-shadow: var(--shadow-sm);
            border: 1px solid var(--border);
            position: relative;
        }

        .trust-card::before {
            content: '"';
            font-family: 'Playfair Display', serif;
            font-size: 4rem;
            color: var(--accent);
            opacity: 0.2;
            position: absolute;
            top: 10px;
            left: 20px;
            line-height: 1;
        }

        .trust-card p {
            font-size: 0.92rem;
            line-height: 1.7;
            color: var(--text-secondary);
            margin-bottom: 18px;
            font-style: italic;
        }

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

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

        .trust-card-author .name {
            font-weight: 700;
            font-size: 0.88rem;
            color: var(--navy);
        }

        .trust-card-author .role {
            font-size: 0.75rem;
            color: var(--text-light);
        }

        .trust-stars {
            color: var(--gold);
            font-size: 0.85rem;
            margin-bottom: 12px;
        }

        /* FAQ SECTION */
        .faq-section {
            padding: 48px 0;
        }

        .faq-section .section-header {
            text-align: center;
            justify-content: center;
            border-bottom: none;
            margin-bottom: 32px;
        }

        .faq-list {
            max-width: 800px;
            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 {
            padding: 18px 24px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            cursor: pointer;
            background: var(--bg-white);
            transition: var(--transition);
            user-select: none;
        }

        .faq-question:hover {
            background: var(--bg-light);
        }

        .faq-question h4 {
            font-size: 0.95rem;
            font-weight: 600;
            color: var(--navy);
        }

        .faq-toggle {
            font-size: 1.3rem;
            color: var(--accent);
            transition: transform 0.3s ease;
            font-weight: 300;
            width: 24px;
            height: 24px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .faq-item.open .faq-toggle {
            transform: rotate(45deg);
        }

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

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

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

        /* CTA BANNER */
        .cta-banner {
            background: linear-gradient(135deg, var(--navy) 0%, #1a3a5c 100%);
            padding: 56px 0;
            text-align: center;
            color: white;
            position: relative;
            overflow: hidden;
        }

        .cta-banner::before {
            content: '';
            position: absolute;
            top: -50%;
            left: -50%;
            width: 200%;
            height: 200%;
            background: radial-gradient(circle at 30% 50%, rgba(212,43,43,0.1) 0%, transparent 50%);
        }

        .cta-banner h2 {
            font-family: 'Playfair Display', serif;
            font-size: 2.2rem;
            font-weight: 900;
            margin-bottom: 12px;
            position: relative;
        }

        .cta-banner p {
            font-size: 1.05rem;
            opacity: 0.85;
            max-width: 600px;
            margin: 0 auto 28px;
            line-height: 1.6;
            position: relative;
        }

        .cta-buttons {
            display: flex;
            gap: 14px;
            justify-content: center;
            position: relative;
        }

        /* FOOTER */
        .footer {
            background: var(--navy);
            color: #aaa;
            padding: 56px 0 0;
        }

        .footer-grid {
            display: grid;
            grid-template-columns: 1.5fr 1fr 1fr 1fr;
            gap: 40px;
            padding-bottom: 40px;
            border-bottom: 1px solid rgba(255,255,255,0.1);
        }

        .footer-brand .logo-text h3 {
            font-family: 'Playfair Display', serif;
            font-size: 1.4rem;
            font-weight: 900;
            color: white;
            margin-bottom: 12px;
        }

        .footer-brand p {
            font-size: 0.88rem;
            line-height: 1.7;
            margin-bottom: 18px;
        }

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

        .footer-social a {
            width: 36px;
            height: 36px;
            border-radius: 50%;
            background: rgba(255,255,255,0.1);
            display: flex;
            align-items: center;
            justify-content: center;
            color: #ccc;
            text-decoration: none;
            font-size: 0.85rem;
            transition: var(--transition);
        }

        .footer-social a:hover {
            background: var(--accent);
            color: white;
        }

        .footer-col h4 {
            color: white;
            font-size: 0.88rem;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 1px;
            margin-bottom: 18px;
        }

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

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

        .footer-col a {
            color: #aaa;
            text-decoration: none;
            font-size: 0.85rem;
            transition: var(--transition);
        }

        .footer-col a:hover {
            color: white;
            padding-left: 4px;
        }

        .footer-bottom {
            padding: 20px 0;
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-size: 0.78rem;
        }

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

        .footer-bottom-links a {
            color: #aaa;
            text-decoration: none;
            transition: var(--transition);
        }

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

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

        /* RESPONSIVE */
        @media (max-width: 1024px) {
            .hero-grid {
                grid-template-columns: 1fr;
            }
            .hero-sidebar {
                flex-direction: row;
            }
            .hero-side-card {
                height: 200px;
            }
            .main-layout {
                grid-template-columns: 1fr;
            }
            .sidebar {
                position: static;
                display: grid;
                grid-template-columns: repeat(2, 1fr);
                gap: 20px;
            }
            .footer-grid {
                grid-template-columns: repeat(2, 1fr);
            }
        }

        @media (max-width: 768px) {
            .header-main {
                flex-direction: column;
                gap: 12px;
            }
            .main-nav ul {
                overflow-x: auto;
            }
            .hero-main img {
                height: 300px;
            }
            .hero-overlay h2 {
                font-size: 1.4rem;
            }
            .hero-sidebar {
                flex-direction: column;
            }
            .news-grid {
                grid-template-columns: 1fr;
            }
            .investigative-feature {
                grid-template-columns: 1fr;
            }
            .local-grid {
                grid-template-columns: 1fr;
            }
            .trust-grid {
                grid-template-columns: 1fr;
            }
            .forecast-grid {
                grid-template-columns: repeat(3, 1fr);
            }
            .weather-current {
                grid-template-columns: 1fr;
                text-align: center;
            }
            .weather-location {
                text-align: center;
            }
            .sidebar {
                grid-template-columns: 1fr;
            }
            .footer-grid {
                grid-template-columns: 1fr;
            }
            .footer-bottom {
                flex-direction: column;
                gap: 10px;
                text-align: center;
            }
            .cta-buttons {
                flex-direction: column;
                align-items: center;
            }
        }
    </style>
</head>
<body>

    <!-- TOP BAR -->
    <div class="top-bar">
        <div class="container">
            <div class="top-bar-left">
                <span><span class="live-dot"></span> LIVE</span>
                <span>Thursday, July 10, 2025</span>
                <span>|</span>
                <span>Last updated: 2:34 PM EDT</span>
            </div>
            <div class="top-bar-right">
                <a href="#">Newsletters</a>
                <a href="#">Podcasts</a>
                <a href="#">Corrections</a>
                <a href="#">Contact Us</a>
            </div>
        </div>
    </div>

    <!-- HEADER -->
    <header class="header">
        <div class="container">
            <div class="header-main">
                <div class="logo-area">
                    <img src="https://placehold.co/48x48/d42b2b/ffffff?text=MP&font=montserrat" alt="Meridian Pulse Logo">
                    <div class="logo-text">
                        <h1>Meridian Pulse</h1>
                        <div class="tagline">Your World, In Focus</div>
                    </div>
                </div>
                <div class="header-actions">
                    <a href="#" class="btn btn-outline">Sign In</a>
                    <a href="#" class="btn btn-primary">Subscribe Now</a>
                </div>
            </div>
        </div>
        <nav class="main-nav">
            <div class="container">
                <ul>
                    <li><a href="#" class="active">Home</a></li>
                    <li><a href="#" class="breaking">⚡ Breaking</a></li>
                    <li><a href="#">National</a></li>
                    <li><a href="#">World</a></li>
                    <li><a href="#">Politics</a></li>
                    <li><a href="#">Weather</a></li>
                    <li><a href="#">Investigations</a></li>
                    <li><a href="#">Opinion</a></li>
                    <li><a href="#">Archive</a></li>
                </ul>
            </div>
        </nav>
    </header>

    <!-- BREAKING NEWS TICKER -->
    <div class="ticker-wrap">
        <div class="container">
            <div class="ticker-inner">
                <span class="ticker-label">Breaking News</span>
                <div class="ticker-content">
                    <span>Federal Reserve signals potential rate adjustment in upcoming September meeting amid cooling inflation data</span>
                    <span>Category 2 hurricane tracking toward southeastern coast — mandatory evacuations issued for coastal counties</span>
                    <span>Landmark bipartisan infrastructure bill passes Senate with 72-28 vote, heads to House for final approval</span>
                    <span>Tech giants report mixed Q2 earnings as AI investment spending continues to accelerate across the sector</span>
                    <span>Federal Reserve signals potential rate adjustment in upcoming September meeting amid cooling inflation data</span>
                    <span>Category 2 hurricane tracking toward southeastern coast — mandatory evacuations issued for coastal counties</span>
                    <span>Landmark bipartisan infrastructure bill passes Senate with 72-28 vote, heads to House for final approval</span>
                    <span>Tech giants report mixed Q2 earnings as AI investment spending continues to accelerate across the sector</span>
                </div>
            </div>
        </div>
    </div>

    <!-- HERO SECTION -->
    <section class="hero-section">
        <div class="container">
            <div class="hero-grid">
                <div class="hero-main">
                    <img src="https://picsum.photos/800/460?random=1" alt="Lead story">
                    <div class="hero-overlay">
                        <span class="hero-category">National</span>
                        <h2>Supreme Court Issues Landmark Ruling on Digital Privacy Standards in Unanimous Decision</h2>
                        <p>In a historic 9-0 decision, the court established new precedents for how law enforcement agencies can access citizens' digital communications and cloud-stored data, reshaping the landscape of Fourth Amendment protections for the digital age.</p>
                        <div class="hero-meta">By <strong>Sarah Mitchell</strong> &bull; 18 minutes ago &bull; 8 min read</div>
                    </div>
                </div>
                <div class="hero-sidebar">
                    <div class="hero-side-card">
                        <img src="https://picsum.photos/400/220?random=2" alt="World news">
                        <div class="hero-side-overlay">
                            <span class="hero-category" style="background:var(--sky)">World</span>
                            <h3>EU Leaders Convene Emergency Summit on Energy Security Amid Supply Chain Disruptions</h3>
                        </div>
                    </div>
                    <div class="hero-side-card">
                        <img src="https://picsum.photos/400/220?random=3" alt="Weather story">
                        <div class="hero-side-overlay">
                            <span class="hero-category" style="background:var(--gold);color:var(--navy)">Weather</span>
                            <h3>Record Heatwave Grips Southwest: Temperatures Expected to Surpass 120°F Through Weekend</h3>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- MAIN CONTENT AREA -->
    <div class="container">
        <div class="main-layout">
            <main>
                <!-- LATEST NEWS GRID -->
                <div class="section-header">
                    <h2>Latest Headlines</h2>
                    <a href="#" class="view-all">View All Stories →</a>
                </div>
                <div class="news-grid">
                    <article class="news-card">
                        <img src="https://picsum.photos/400/180?random=4" alt="News">
                        <div class="news-card-body">
                            <div class="news-card-category">Politics</div>
                            <h3>Congressional Committee Unveils Bipartisan Framework for Comprehensive Immigration Reform</h3>
                            <p>After months of closed-door negotiations, a coalition of twelve senators from both parties presented a detailed proposal addressing border security, pathway provisions, and visa modernization that could reshape decades of policy.</p>
                            <div class="news-card-meta">
                                <img src="https://i.pravatar.cc/28?u=reporter1" alt="Author">
                                <span><strong>David Chen</strong> &bull; 2 hours ago</span>
                            </div>
                        </div>
                    </article>
                    <article class="news-card">
                        <img src="https://picsum.photos/400/180?random=5" alt="News">
                        <div class="news-card-body">
                            <div class="news-card-category">Science</div>
                            <h3>NASA's James Webb Telescope Captures New Evidence of Atmospheric Conditions on Distant Exoplanet</h3>
                            <p>Researchers analyzing spectroscopic data from the deep-space observatory have identified chemical signatures consistent with water vapor and carbon dioxide in the atmosphere of a planet located 120 light-years from Earth.</p>
                            <div class="news-card-meta">
                                <img src="https://i.pravatar.cc/28?u=reporter2" alt="Author">
                                <span><strong>Elena Vasquez</strong> &bull; 3 hours ago</span>
                            </div>
                        </div>
                    </article>
                    <article class="news-card">
                        <img src="https://picsum.photos/400/180?random=6" alt="News">
                        <div class="news-card-body">
                            <div class="news-card-category">Economy</div>
                            <h3>Job Market Shows Resilience as Unemployment Holds Steat at 3.8% for Third Consecutive Month</h3>
                            <p>The Bureau of Labor Statistics released its monthly employment report showing 185,000 new positions added across healthcare, technology, and construction sectors, defying analyst expectations of a slowdown.</p>
                            <div class="news-card-meta">
                                <img src="https://i.pravatar.cc/28?u=reporter3" alt="Author">
                                <span><strong>Marcus Webb</strong> &bull; 4 hours ago</span>
                            </div>
                        </div>
                    </article>
                    <article class="news-card">
                        <img src="https://picsum.photos/400/180?random=7" alt="News">
                        <div class="news-card-body">
                            <div class="news-card-category">Health</div>
                            <h3>WHO Announces Global Initiative to Improve Pandemic Preparedness and Early Warning Systems</h3>
                            <p>The World Health Organization unveiled a comprehensive strategy involving 140 member nations to establish real-time pathogen surveillance networks and rapid-response protocols designed to prevent future global health crises.</p>
                            <div class="news-card-meta">
                                <img src="https://i.pravatar.cc/28?u=reporter4" alt="Author">
                                <span><strong>Priya Sharma</strong> &bull; 5 hours ago</span>
                            </div>
                        </div>
                    </article>
                </div>

                <!-- INVESTIGATIVE REPORTS -->
                <div class="investigative-section">
                    <div class="section-header">
                        <h2>Investigative Reports</h2>
                        <a href="#" class="view-all">All Investigations →</a>
                    </div>
                    <div class="investigative-feature">
                        <img src="https://picsum.photos/600/400?random=8" alt="Investigative report">
                        <div class="investigative-content">
                            <div class="investigative-badge">🔍 Investigative Series</div>
                            <h3>Behind Closed Doors: A Six-Month Investigation Into Municipal Water Infrastructure Failures</h3>
                            <p>Our investigative team spent half a year examining records across 47 municipalities, uncovering a pattern of deferred maintenance, misallocated funds, and regulatory gaps that have left millions of Americans without reliable access to clean drinking water. The findings reveal systemic issues that federal agencies have struggled to address despite repeated warnings from local engineers.</p>
                            <p>This multi-part series examines the human cost of infrastructure neglect and profiles the communities bearing the heaviest burden of these failures, from rural Appalachia to suburban developments outside major metropolitan areas.</p>
                            <a href="#" class="btn btn-primary">Read Full Investigation</a>
                        </div>
                    </div>
                </div>

                <!-- WEATHER SECTION -->
                <div class="weather-section">
                    <div class="section-header">
                        <h2>☁️ Weather Center</h2>
                        <a href="#" class="view-all">Full Forecast →</a>
                    </div>
                    <div class="weather-current">
                        <div class="weather-temp">
                            <div class="temp-value">84<span class="temp-unit">°F</span></div>
                            <div class="temp-condition">Partly Cloudy</div>
                        </div>
                        <div class="weather-details">
                            <div class="weather-detail-item">
                                <span class="label">Humidity:</span>
                                <span class="value">62%</span>
                            </div>
                            <div class="weather-detail-item">
                                <span class="label">Wind:</span>
                                <span class="value">12 mph SE</span>
                            </div>
                            <div class="weather-detail-item">
                                <span class="label">UV Index:</span>
                                <span class="value">7 (High)</span>
                            </div>
                            <div class="weather-detail-item">
                                <span class="label">Pressure:</span>
                                <span class="value">30.12 inHg</span>
                            </div>
                            <div class="weather-detail-item">
                                <span class="label">Visibility:</span>
                                <span class="value">10 mi</span>
                            </div>
                            <div class="weather-detail-item">
                                <span class="label">Dew Point:</span>
                                <span class="value">69°F</span>
                            </div>
                        </div>
                        <div class="weather-location">
                            <div class="city">Washington, D.C.</div>
                            <div class="date">Thursday, July 10</div>
                            <div style="margin-top:8px;font-size:0.8rem;opacity:0.7">H: 89° / L: 71°</div>
                        </div>
                    </div>

                    <!-- Interactive Weather Radar -->
                    <div class="weather-radar" id="weatherRadar">
                        <img src="https://picsum.photos/800/220?random=20&blur=2" alt="Weather radar map">
                        <div class="radar-overlay">
                            <div class="radar-top">
                                <span class="radar-label">📡 Live Radar — Mid-Atlantic Region</span>
                                <div class="radar-controls">
                                    <button class="radar-btn active" onclick="setRadarType('precip')">Precipitation</button>
                                    <button class="radar-btn" onclick="setRadarType('temp')">Temperature</button>
                                    <button class="radar-btn" onclick="setRadarType('wind')">Wind</button>
                                </div>
                            </div>
                            <div class="radar-bottom">
                                <div class="radar-timeline" id="radarTimeline">
                                </div>
                                <div class="radar-legend">
                                    <div class="legend-color" style="background:#4ade80"></div> Light
                                    <div class="legend-color" style="background:#facc15"></div> Moderate
                                    <div class="legend-color" style="background:#ef4444"></div> Heavy
                                    <div class="legend-color" style="background:#7c3aed"></div> Severe
                                </div>
                            </div>
                        </div>
                    </div>

                    <!-- 5-Day Forecast -->
                    <div class="forecast-grid">
                        <div class="forecast-day">
                            <div class="day-name">Fri</div>
                            <div class="day-icon">⛅</div>
                            <div class="day-temp">87°</div>
                            <div class="day-low">72°</div>
                        </div>
                        <div class="forecast-day">
                            <div class="day-name">Sat</div>
                            <div class="day-icon">🌤️</div>
                            <div class="day-temp">90°</div>
                            <div class="day-low">74°</div>
                        </div>
                        <div class="forecast-day">
                            <div class="day-name">Sun</div>
                            <div class="day-icon">🌦️</div>
                            <div class="day-temp">85°</div>
                            <div class="day-low">70°</div>
                        </div>
                        <div class="forecast-day">
                            <div class="day-name">Mon</div>
                            <div class="day-icon">⛈️</div>
                            <div class="day-temp">79°</div>
                            <div class="day-low">66°</div>
                        </div>
                        <div class="forecast-day">
                            <div class="day-name">Tue</div>
                            <div class="day-icon">☀️</div>
                            <div class="day-temp">83°</div>
                            <div class="day-low">68°</div>
                        </div>
                    </div>

                    <div class="weather-alert">
                        <span class="weather-alert-icon">⚠️</span>
                        <div class="weather-alert-text">
                            <strong>Heat Advisory in Effect:</strong> A heat advisory has been issued for the greater metropolitan area through Friday evening. Heat index values may reach 105°F. Stay hydrated, limit outdoor activities during peak hours (12 PM – 6 PM), and check on vulnerable neighbors. <a href="#" style="color:var(--gold);text-decoration:underline">Get safety tips →</a>
                        </div>
                    </div>
                </div>

                <!-- LOCAL COVERAGE -->
                <div class="local-section">
                    <div class="section-header">
                        <h2>Local Coverage</h2>
                        <a href="#" class="view-all">Your Area →</a>
                    </div>
                    <div class="local-grid">
                        <div class="local-card">
                            <div class="local-card-icon">🏛️</div>
                            <h4>City Council Approves $2.3B Transit Expansion Plan</h4>
                            <p>The unanimous vote greenlights three new metro lines, 40 additional bus routes, and dedicated cycling infrastructure across the district. Construction is expected to begin in early 2026 with the first phase completing by 2028.</p>
                        </div>
                        <div class="local-card">
                            <div class="local-card-icon">🏫</div>
                            <h4>School District Reports Record Enrollment for Fall Semester</h4>
                            <p>Administrators attribute the 12% increase to new family housing developments and expanded STEM programs that have drawn attention from families across the tri-county area. The district is hiring 180 additional teachers.</p>
                        </div>
                        <div class="local-card">
                            <div class="local-card-icon">🏥</div>
                            <h4>Regional Medical Center Opens State-of-the-Art Emergency Wing</h4>
                            <p>The $180 million facility features 64 treatment bays, a dedicated pediatric emergency unit, and helipad access. Officials say the expansion will reduce average wait times by 35% during peak hours.</p>
                        </div>
                    </div>
                </div>
            </main>

            <!-- SIDEBAR -->
            <aside class="sidebar">
                <!-- Most Read -->
                <div class="sidebar-widget">
                    <div class="sidebar-widget-header">📊 Most Read Today</div>
                    <div class="sidebar-widget-body">
                        <div class="most-read-item">
                            <span class="most-read-number">1</span>
                            <div class="most-read-text">
                                <h4>Supreme Court's Digital Privacy Ruling Sends Shockwaves Through Tech Industry</h4>
                                <span class="meta">National • 45K reads</span>
                            </div>
                        </div>
                        <div class="most-read-item">
                            <span class="most-read-number">2</span>
                            <div class="most-read-text">
                                <h4>Hurricane Season Forecast: Meteorologists Warn of Above-Average Activity</h4>
                                <span class="meta">Weather • 38K reads</span>
                            </div>
                        </div>
                        <div class="most-read-item">
                            <span class="most-read-number">3</span>
                            <div class="most-read-text">
                                <h4>Local Restaurant Owner's GoFundMe Raises $1.2M After Devastating Fire</h4>
                                <span class="meta">Community • 31K reads</span>
                            </div>
                        </div>
                        <div class="most-read-item">
                            <span class="most-read-number">4</span>
                            <div class="most-read-text">
                                <h4>Federal Investigation Reveals Widespread Fraud in Student Loan Forgiveness Program</h4>
                                <span class="meta">Investigations • 28K reads</span>
                            </div>
                        </div>
                        <div class="most-read-item">
                            <span class="most-read-number">5</span>
                            <div class="most-read-text">
                                <h4>Former CEO Testifies Before Congress on Cryptocurrency Exchange Collapse</h4>
                                <span class="meta">Economy • 24K reads</span>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Upcoming Events -->
                <div class="sidebar-widget">
                    <div class="sidebar-widget-header">📅 Upcoming Events</div>
                    <div class="sidebar-widget-body">
                        <div class="event-item">
                            <div class="event-date">
                                <div class="event-date-box">
                                    <div class="month">Jul</div>
                                    <div class="day">14</div>
                                </div>
                                <div class="event-info">
                                    <h4>Town Hall: Climate Action Plan Public Forum</h4>
                                    <p>City Hall Auditorium • 6:30 PM</p>
                                </div>
                            </div>
                        </div>
                        <div class="event-item">
                            <div class="event-date">
                                <div class="event-date-box">
                                    <div class="month">Jul</div>
                                    <div class="day">18</div>
                                </div>
                                <div class="event-info">
                                    <h4>Annual Community Health Fair & Screening</h4>
                                    <p>Central Park Pavilion • 9 AM – 4 PM</p>
                                </div>
                            </div>
                        </div>
                        <div class="event-item">
                            <div class="event-date">
                                <div class="event-date-box">
                                    <div class="month">Jul</div>
                                    <div class="day">22</div>
                                </div>
                                <div class="event-info">
                                    <h4>Meridian Pulse Live: Election Analysis Panel</h4>
                                    <p>Virtual Event • 7:00 PM EDT</p>
                                </div>
                            </div>
                        </div>
                        <div class="event-item">
                            <div class="event-date">
                                <div class="event-date-box">
                                    <div class="month">Aug</div>
                                    <div class="day">02</div>
                                </div>
                                <div class="event-info">
                                    <h4>Back-to-School Resource Fair for Families</h4>
                                    <p>Convention Center • 10 AM – 3 PM</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Newsletter -->
                <div class="sidebar-widget newsletter-widget">
                    <div class="sidebar-widget-header">✉️ Daily Briefing</div>
                    <div class="sidebar-widget-body">
                        <p>Get the top stories, weather updates, and investigative reports delivered to your inbox every morning at 6 AM. Trusted by over 250,000 readers.</p>
                        <form class="newsletter-form" onsubmit="handleSubscribe(event)">
                            <input type="email" placeholder="Enter your email address" required>
                            <button type="submit" class="btn btn-gold">Subscribe — It's Free</button>
                        </form>
                    </div>
                </div>

                <!-- Video Highlights -->
                <div class="sidebar-widget">
                    <div class="sidebar-widget-header">🎥 Video Highlights</div>
                    <div class="sidebar-widget-body" style="padding:0">
                        <div style="position:relative;cursor:pointer">
                            <img src="https://picsum.photos/340/190?random=15" alt="Video" style="width:100%;display:block">
                            <div style="position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:48px;height:48px;background:rgba(0,0,0,0.7);border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;font-size:1.2rem">▶</div>
                            <div style="position:absolute;bottom:0;left:0;right:0;padding:10px;background:linear-gradient(transparent,rgba(0,0,0,0.8));color:white;font-size:0.8rem;font-weight:600">Court Ruling Reaction: Legal Experts Weigh In</div>
                        </div>
                        <div style="position:relative;cursor:pointer;border-top:1px solid var(--border)">
                            <img src="https://picsum.photos/340/190?random=16" alt="Video" style="width:100%;display:block">
                            <div style="position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:48px;height:48px;background:rgba(0,0,0,0.7);border-radius:50%;display:flex;align-items:center;justify-content:center;color:white;font-size:1.2rem">▶</div>
                            <div style="position:absolute;bottom:0;left:0;right:0;padding:10px;background:linear-gradient(transparent,rgba(0,0,0,0.8));color:white;font-size:0.8rem;font-weight:600">Inside the Storm: Our Weather Team's Hurricane Coverage</div>
                        </div>
                    </div>
                </div>
            </aside>
        </div>
    </div>

    <!-- TRUST / TESTIMONIALS SECTION -->
    <section class="trust-section">
        <div class="container-wide">
            <div class="section-header">
                <h2>Trusted by Readers Nationwide</h2>
            </div>
            <div class="trust-grid">
                <div class="trust-card">
                    <div class="trust-stars">★★★★★</div>
                    <p>Meridian Pulse has become my go-to source for reliable, unbiased news coverage. Their investigative team consistently breaks stories that hold power accountable. The weather forecasting accuracy is remarkable — I plan my outdoor events around their extended forecasts with complete confidence.</p>
                    <div class="trust-card-author">
                        <img src="https://i.pravatar.cc/44?u=user1" alt="Reader">
                        <div>
                            <div class="name">Rebecca Thornton</div>
                            <div class="role">Small Business Owner, Richmond VA</div>
                        </div>
                    </div>
                </div>
                <div class="trust-card">
                    <div class="trust-stars">★★★★★</div>
                    <p>As a retired journalist myself, I appreciate the depth and rigor of their reporting. The daily briefing newsletter is impeccably curated — it gives me everything I need in five minutes. Their archive feature is invaluable for research. This is journalism done right, the way it should be.</p>
                    <div class="trust-card-author">
                        <img src="https://i.pravatar.cc/44?u=user2" alt="Reader">
                        <div>
                            <div class="name">James Whitfield</div>
                            <div class="role">Retired Editor, Philadelphia PA</div>
                        </div>
                    </div>
                </div>
                <div class="trust-card">
                    <div class="trust-stars">★★★★★</div>
                    <p>The real-time weather radar and severe weather alerts have literally helped my family prepare for dangerous conditions. When the tornado warning came through their app last spring, we had 22 minutes of lead time. That kind of timely, potentially life-saving information is priceless to us.</p>
                    <div class="trust-card-author">
                        <img src="https://i.pravatar.cc/44?u=user3" alt="Reader">
                        <div>
                            <div class="name">Maria Gonzalez</div>
                            <div class="role">Parent & Teacher, Oklahoma City OK</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- FAQ SECTION -->
    <section class="faq-section">
        <div class="container">
            <div class="section-header">
                <h2>Frequently Asked Questions</h2>
            </div>
            <div class="faq-list">
                <div class="faq-item">
                    <div class="faq-question" onclick="toggleFaq(this)">
                        <h4>How accurate are Meridian Pulse weather forecasts?</h4>
                        <span class="faq-toggle">+</span>
                    </div>
                    <div class="faq-answer">
                        <p>Our meteorological team utilizes data from NOAA, the National Weather Service, and proprietary modeling systems to deliver forecasts with a 94% accuracy rate for 24-hour predictions and 87% accuracy for seven-day outlooks. Our severe weather alert system has been recognized by the National Weather Association for its timeliness and precision, often providing critical lead time of 15-30 minutes for tornado and severe thunderstorm warnings.</p>
                    </div>
                </div>
                <div class="faq-item">
                    <div class="faq-question" onclick="toggleFaq(this)">
                        <h4>What's included in a Meridian Pulse subscription?</h4>
                        <span class="faq-toggle">+</span>
                    </div>
                    <div class="faq-answer">
                        <p>A digital subscription provides unlimited access to all news articles, investigative reports, and opinion pieces across our platform. Subscribers also receive the daily morning briefing newsletter, access to our complete news archive dating back to 2008, personalized weather alerts for multiple saved locations, ad-free reading experience, and exclusive access to subscriber-only podcasts and video content. Annual subscribers save 40% compared to monthly billing.</p>
                    </div>
                </div>
                <div class="faq-item">
                    <div class="faq-question" onclick="toggleFaq(this)">
                        <h4>How does Meridian Pulse ensure journalistic integrity?</h4>
                        <span class="faq-toggle">+</span>
                    </div>
                    <div class="faq-answer">
                        <p>We maintain a strict editorial firewall between our newsroom and any commercial interests. Every story undergoes a minimum of two editorial reviews before publication. Our fact-checking team verifies all claims against primary sources. We publish transparent corrections within 24 hours of identifying errors. Our editorial standards are audited annually by an independent press ethics board, and we are proud members of the Trust Project, an international initiative to increase transparency in news.</p>
                    </div>
                </div>
                <div class="faq-item">
                    <div class="faq-question" onclick="toggleFaq(this)">
                        <h4>Can I customize my news feed and weather alerts?</h4>
                        <span class="faq-toggle">+</span>
                    </div>
                    <div class="faq-answer">
                        <p>Absolutely. Your Meridian Pulse account allows you to follow specific topics, regions, and reporters. You can set up custom weather alerts for any location — ideal for travelers or those with family in different areas. Our smart feed algorithm learns your reading preferences over time while still ensuring you see critical breaking news and major headlines. You can also configure push notification preferences for breaking news, weather emergencies, and personalized story recommendations.</p>
                    </div>
                </div>
                <div class="faq-item">
                    <div class="faq-question" onclick="toggleFaq(this)">
                        <h4>How can I submit a news tip or story idea?</h4>
                        <span class="faq-toggle">+</span>
                    </div>
                    <div class="faq-answer">
                        <p>We welcome tips from the public through multiple secure channels. You can reach our tips line at tips@meridianpulse.com, use our encrypted submission form on the Contact page, or call our confidential hotline at 1-800-555-TIPS. For sensitive investigative information, we also support SecureDrop for anonymous encrypted communications. All tips are reviewed by our assignments desk within 24 hours, and we protect source confidentiality in accordance with shield law provisions.</p>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- CTA BANNER -->
    <section class="cta-banner">
        <div class="container">
            <h2>Stay Informed. Stay Prepared.</h2>
            <p>Join over 250,000 readers who trust Meridian Pulse for breaking news, accurate weather forecasts, and in-depth investigative reporting. Get unlimited access to award-winning journalism starting at just $1/week.</p>
            <div class="cta-buttons">
                <a href="#" class="btn btn-primary" style="padding:14px 32px;font-size:1rem">Subscribe Now — $1/Week</a>
                <a href="#" class="btn btn-outline" style="border-color:white;color:white;padding:14px 32px;font-size:1rem">Get Free Daily Alerts</a>
            </div>
        </div>
    </section>

    <!-- FOOTER -->
    <footer class="footer">
        <div class="container">
            <div class="footer-grid">
                <div class="footer-brand">
                    <div class="logo-text">
                        <h3>Meridian Pulse</h3>
                    </div>
                    <p>Delivering trusted news, accurate weather forecasts, and vital information to communities across the nation since 2008. Our mission is to empower readers with the knowledge they need to make informed decisions every day.</p>
                    <div class="footer-social">
                        <a href="#" title="Twitter/X">𝕏</a>
                        <a href="#" title="Facebook">f</a>
                        <a href="#" title="Instagram">◻</a>
                        <a href="#" title="YouTube">▶</a>
                        <a href="#" title="LinkedIn">in</a>
                        <a href="#" title="RSS">⊕</a>
                    </div>
                </div>
                <div class="footer-col">
                    <h4>Sections</h4>
                    <ul>
                        <li><a href="#">National News</a></li>
                        <li><a href="#">World News</a></li>
                        <li><a href="#">Politics</a></li>
                        <li><a href="#">Weather Center</a></li>
                        <li><a href="#">Investigations</a></li>
                        <li><a href="#">Opinion & Editorial</a></li>
                        <li><a href="#">Science & Tech</a></li>
                        <li><a href="#">News Archive</a></li>
                    </ul>
                </div>
                <div class="footer-col">
                    <h4>Company</h4>
                    <ul>
                        <li><a href="#">About Us</a></li>
                        <li><a href="#">Our Team</a></li>
                        <li><a href="#">Careers</a></li>
                        <li><a href="#">Advertise With Us</a></li>
                        <li><a href="#">Press Releases</a></li>
                        <li><a href="#">Ethics Policy</a></li>
                        <li><a href="#">Corrections</a></li>
                        <li><a href="#">Contact Us</a></li>
                    </ul>
                </div>
                <div class="footer-col">
                    <h4>Contact</h4>
                    <ul>
                        <li><a href="#">📍 1200 Pennsylvania Ave NW<br>&nbsp;&nbsp;&nbsp;&nbsp;Suite 400, Washington, DC 20004</a></li>
                        <li><a href="tel:+12025551234">📞 (202) 555-1234</a></li>
                        <li><a href="mailto:info@meridianpulse.com">✉️ info@meridianpulse.com</a></li>
                        <li><a href="#">💬 Live Chat Support</a></li>
                        <li style="margin-top:12px"><a href="#">News Tips: tips@meridianpulse.com</a></li>
                        <li><a href="#">1-800-555-TIPS (Confidential)</a></li>
                    </ul>
                </div>
            </div>
            <div class="footer-bottom">
                <span>© 2025 Meridian Pulse Media Group. All rights reserved.</span>
                <div class="footer-bottom-links">
                    <a href="#">Privacy Policy</a>
                    <a href="#">Terms of Service</a>
                    <a href="#">Cookie Settings</a>
                    <a href="#">Accessibility</a>
                    <a href="#">Sitemap</a>
                </div>
            </div>
        </div>
    </footer>

    <script>
        // FAQ Accordion
        function toggleFaq(element) {
            const item = element.parentElement;
            const isOpen = item.classList.contains('open');
            
            // Close all
            document.querySelectorAll('.faq-item').forEach(faq => {
                faq.classList.remove('open');
            });
            
            // Open clicked if it was closed
            if (!isOpen) {
                item.classList.add('open');
            }
        }

        // Weather Radar Controls
        function setRadarType(type) {
            document.querySelectorAll('.radar-btn').forEach(btn => btn.classList.remove('active'));
            event.target.classList.add('active');
            
            const radar = document.getElementById('weatherRadar');
            const img = radar.querySelector('img');
            
            const blurMap = { precip: 2, temp: 3, wind: 1 };
            img.style.filter = `blur(${blurMap[type] || 2}px)`;
            img.src = `https://picsum.photos/800/220?random=${type === 'precip' ? 20 : type === 'temp' ? 21 : 22}&blur=${blurMap[type]}`;
        }

        // Generate Radar Timeline Bars
        (function() {
            const timeline = document.getElementById('radarTimeline');
            for (let i = 0; i < 24; i++) {
                const bar = document.createElement('div');
                bar.className = 'radar-timeline-bar' + (i === 12 ? ' active' : '');
                bar.style.height = (Math.random() * 20 + 8) + 'px';
                bar.title = `${i}:00`;
                bar.addEventListener('click', function() {
                    document.querySelectorAll('.radar-timeline-bar').forEach(b => b.classList.remove('active'));
                    this.classList.add('active');
                });
                timeline.appendChild(bar);
            }
        })();

        // Newsletter Subscribe Handler
        function handleSubscribe(e) {
            e.preventDefault();
            const input = e.target.querySelector('input');
            const btn = e.target.querySelector('button');
            btn.textContent = '✓ Subscribed!';
            btn.style.background = '#22c55e';
            btn.style.color = 'white';
            input.value = '';
            setTimeout(() => {
                btn.textContent = 'Subscribe — It\'s Free';
                btn.style.background = '';
                btn.style.color = '';
            }, 3000);
        }

        // Smooth scroll behavior
        document.documentElement.style.scrollBehavior = 'smooth';
    </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:07.888Z",
  "url": "https://benchmark.aimac.invalid/bb70252e2298ba79189edf94495ee9bd885099f2535a3b22d5d13ff1b02f036b.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": "select-name",
      "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 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": []
    },
    {
      "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": "<html lang=\"en\" style=\"scroll-behavior: smooth;\">",
          "target": [
            "html"
          ]
        }
      ]
    },
    {
      "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"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<button class=\"radar-btn active\" onclick=\"setRadarType('precip')\">Precipitation</button>",
          "target": [
            "button[onclick=\"setRadarType('precip')\"]"
          ]
        }
      ]
    },
    {
      "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": "header-present",
              "data": null,
              "relatedNodes": [
                {
                  "html": "<h1>Meridian Pulse</h1>",
                  "target": [
                    "h1"
                  ]
                },
                {
                  "html": "<h2>Supreme Court Issues Landmark Ruling on Digital Privacy Standards in Unanimous Decision</h2>",
                  "target": [
                    ".hero-overlay > h2"
                  ]
                },
                {
                  "html": "<h3>EU Leaders Convene Emergency Summit on Energy Security Amid Supply Chain Disruptions</h3>",
                  "target": [
                    ".hero-side-card:nth-child(1) > .hero-side-overlay > h3"
                  ]
                },
                {
                  "html": "<h3>Record Heatwave Grips Southwest: Temperatures Expected to Surpass 120\u00b0F Through Weekend</h3>",
                  "target": [
                    ".hero-side-card:nth-child(2) > .hero-side-overlay > h3"
                  ]
                },
                {
                  "html": "<h2>Latest Headlines</h2>",
                  "target": [
                    "main > .section-header > h2"
                  ]
                },
                {
                  "html": "<h3>Congressional Committee Unveils Bipartisan Framework for Comprehensive Immigration Reform</h3>",
                  "target": [
                    "article:nth-child(1) > .news-card-body > h3"
                  ]
                },
                {
                  "html": "<h3>NASA's James Webb Telescope Captures New Evidence of Atmospheric Conditions on Distant Exoplanet</h3>",
                  "target": [
                    "article:nth-child(2) > .news-card-body > h3"
                  ]
                },
                {
                  "html": "<h3>Job Market Shows Resilience as Unemployment Holds Steat at 3.8% for Third Consecutive Month</h3>",
                  "target": [
                    "article:nth-child(3) > .news-card-body > h3"
                  ]
                },
                {
                  "html": "<h3>WHO Announces Global Initiative to Improve Pandemic Preparedness and Early Warning Systems</h3>",
                  "target": [
                    "article:nth-child(4) > .news-card-body > h3"
                  ]
                },
                {
                  "html": "<h2>Investigative Reports</h2>",
                  "target": [
                    ".investigative-section > .section-header > h2"
                  ]
                },
                {
                  "html": "<h3>Behind Closed Doors: A Six-Month Investigation Into Municipal Water Infrastructure Failures</h3>",
                  "target": [
                    ".investigative-content > h3"
                  ]
                },
                {
                  "html": "<h2>\u2601\ufe0f Weather Center</h2>",
                  "target": [
                    ".weather-section > .section-header > h2"
                  ]
                },
                {
                  "html": "<h2>Local Coverage</h2>",
                  "target": [
                    ".local-section > .section-header > h2"
                  ]
                },
                {
                  "html": "<h4>City Council Approves $2.3B Transit Expansion Plan</h4>",
                  "target": [
                    ".local-card:nth-child(1) > h4"
                  ]
                },
                {
                  "html": "<h4>School District Reports Record Enrollment for Fall Semester</h4>",
                  "target": [
                    ".local-card:nth-child(2) > h4"
                  ]
                },
                {
                  "html": "<h4>Regional Medical Center Opens State-of-the-Art Emergency Wing</h4>",
                  "target": [
                    ".local-card:nth-child(3) > h4"
                  ]
                },
                {
                  "html": "<h4>Supreme Court's Digital Privacy Ruling Sends Shockwaves Through Tech Industry</h4>",
                  "target": [
                    ".most-read-item:nth-child(1) > .most-read-text > h4"
                  ]
                },
                {
                  "html": "<h4>Hurricane Season Forecast: Meteorologists Warn of Above-Average Activity</h4>",
                  "target": [
                    ".most-read-item:nth-child(2) > .most-read-text > h4"
                  ]
                },
                {
                  "html": "<h4>Local Restaurant Owner's GoFundMe Raises $1.2M After Devastating Fire</h4>",
                  "target": [
                    ".most-read-item:nth-child(3) > .most-read-text > h4"
                  ]
                },
                {
                  "html": "<h4>Federal Investigation Reveals Widespread Fraud in Student Loan Forgiveness Program</h4>",
                  "target": [
                    ".most-read-item:nth-child(4) > .most-read-text > h4"
                  ]
                },
                {
                  "html": "<h4>Former CEO Testifies Before Congress on Cryptocurrency Exchange Collapse</h4>",
                  "target": [
                    ".most-read-item:nth-child(5) > .most-read-text > h4"
                  ]
                },
                {
                  "html": "<h4>Town Hall: Climate Action Plan Public Forum</h4>",
                  "target": [
                    ".event-item:nth-child(1) > .event-date > .event-info > h4"
                  ]
                },
                {
                  "html": "<h4>Annual Community Health Fair &amp; Screening</h4>",
                  "target": [
                    ".event-item:nth-child(2) > .event-date > .event-info > h4"
                  ]
                },
                {
                  "html": "<h4>Meridian Pulse Live: Election Analysis Panel</h4>",
                  "target": [
                    ".event-item:nth-child(3) > .event-date > .event-info > h4"
                  ]
                },
                {
                  "html": "<h4>Back-to-School Resource Fair for Families</h4>",
                  "target": [
                    ".event-item:nth-child(4) > .event-date > .event-info > h4"
                  ]
                },
                {
                  "html": "<h2>Trusted by Readers Nationwide</h2>",
                  "target": [
                    ".container-wide > .section-header > h2"
                  ]
                },
                {
                  "html": "<h2>Frequently Asked Questions</h2>",
                  "target": [
                    ".container > .section-header > h2"
                  ]
                },
                {
                  "html": "<h4>How accurate are Meridian Pulse weather forecasts?</h4>",
                  "target": [
                    ".faq-item:nth-child(1) > .faq-question[onclick=\"toggleFaq(this)\"] > h4"
                  ]
                },
                {
                  "html": "<h4>What's included in a Meridian Pulse subscription?</h4>",
                  "target": [
                    ".faq-item:nth-child(2) > .faq-question[onclick=\"toggleFaq(this)\"] > h4"
                  ]
                },
                {
                  "html": "<h4>How does Meridian Pulse ensure journalistic integrity?</h4>",
                  "target": [
                    ".faq-item:nth-child(3) > .faq-question[onclick=\"toggleFaq(this)\"] > h4"
                  ]
                },
                {
                  "html": "<h4>Can I customize my news feed and weather alerts?</h4>",
                  "target": [
                    ".faq-item:nth-child(4) > .faq-question[onclick=\"toggleFaq(this)\"] > h4"
                  ]
                },
                {
                  "html": "<h4>How can I submit a news tip or story idea?</h4>",
                  "target": [
                    ".faq-item:nth-child(5) > .faq-question[onclick=\"toggleFaq(this)\"] > h4"
                  ]
                },
                {
                  "html": "<h2>Stay Informed. Stay Prepared.</h2>",
                  "target": [
                    ".container > h2"
                  ]
                },
                {
                  "html": "<h3>Meridian Pulse</h3>",
                  "target": [
                    ".logo-text > h3"
                  ]
                },
                {
                  "html": "<h4>Sections</h4>",
                  "target": [
                    ".footer-col:nth-child(2) > h4"
                  ]
                },
                {
                  "html": "<h4>Company</h4>",
                  "target": [
                    ".footer-col:nth-child(3) > h4"
                  ]
                },
                {
                  "html": "<h4>Contact</h4>",
                  "target": [
                    ".footer-col:nth-child(4) > h4"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Page has a heading"
            },
            {
              "id": "landmark",
              "data": null,
              "relatedNodes": [
                {
                  "html": "<main>",
                  "target": [
                    "main"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Page has a landmark region"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<html lang=\"en\" style=\"scroll-behavior: smooth;\">",
          "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": "#cccccc",
                "bgColor": "#0f1923",
                "contrastRatio": 11.04,
                "fontSize": "9.6pt (12.8px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [],
              "impact": "serious",
              "message": "Element has sufficient color contrast of 11.04"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<span><span class=\"live-dot\"></span> LIVE</span>",
          "target": [
            ".top-bar-left > span:nth-child(1)"
          ]
        }
      ]
    },
    {
      "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\" style=\"scroll-behavior: smooth;\">",
          "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": "<input type=\"email\" placeholder=\"Enter your email address\" required=\"\">",
          "target": [
            "input"
          ]
        }
      ]
    },
    {
      "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\" style=\"scroll-behavior: smooth;\">",
          "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\" style=\"scroll-behavior: smooth;\">",
          "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/48x48/d42b2b/ffffff?text=MP&amp;font=montserrat\" alt=\"Meridian Pulse Logo\">",
          "target": [
            "img[alt=\"Meridian Pulse 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=\"weather-alert-text\">",
                  "target": [
                    ".weather-alert-text"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Links can be distinguished from surrounding text by visual styling"
            }
          ],
          "all": [],
          "none": [],
          "impact": null,
          "html": "<a href=\"#\" style=\"color:var(--gold);text-decoration:underline\">Get safety tips \u2192</a>",
          "target": [
            ".weather-alert-text > a[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=\"#\">Newsletters</a>",
          "target": [
            ".top-bar-right > a[href=\"#\"]:nth-child(1)"
          ]
        }
      ]
    },
    {
      "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": [
            ".container > 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=\"#\" class=\"active\">Home</a></li>",
          "target": [
            ".container > 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/48x48/d42b2b/ffffff?text=MP&amp;font=montserrat\" alt=\"Meridian Pulse Logo\">",
          "target": [
            "img[alt=\"Meridian Pulse 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-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=\"#\">Newsletters</a>",
          "target": [
            ".top-bar-right > a[href=\"#\"]:nth-child(1)"
          ]
        }
      ]
    }
  ],
  "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": null,
                "bgColor": null,
                "contrastRatio": 0,
                "fontSize": "24.0pt (32px)",
                "fontWeight": "bold",
                "messageKey": "bgGradient",
                "expectedContrastRatio": "3:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"hero-overlay\">",
                  "target": [
                    ".hero-overlay"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element's background color could not be determined due to a background gradient"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<h2>Supreme Court Issues Landmark Ruling on Digital Privacy Standards in Unanimous Decision</h2>",
          "target": [
            ".hero-overlay > h2"
          ],
          "failureSummary": "Fix any of the following:\n  Element's background color could not be determined due to a background gradient"
        }
      ]
    }
  ],
  "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": "#888888",
                "bgColor": "#ffffff",
                "contrastRatio": 3.54,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<header class=\"header\">",
                  "target": [
                    "header"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<div class=\"tagline\">Your World, In Focus</div>",
          "target": [
            ".tagline"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#ffffff",
                "bgColor": "#4a9eed",
                "contrastRatio": 2.83,
                "fontSize": "7.8pt (10.4px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<span class=\"hero-category\" style=\"background:var(--sky)\">World</span>",
                  "target": [
                    ".hero-side-card:nth-child(1) > .hero-side-overlay > .hero-category"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 2.83 (foreground color: #ffffff, background color: #4a9eed, font size: 7.8pt (10.4px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"hero-category\" style=\"background:var(--sky)\">World</span>",
          "target": [
            ".hero-side-card:nth-child(1) > .hero-side-overlay > .hero-category"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 2.83 (foreground color: #ffffff, background color: #4a9eed, font size: 7.8pt (10.4px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#888888",
                "bgColor": "#ffffff",
                "contrastRatio": 3.54,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<article class=\"news-card\">",
                  "target": [
                    "article:nth-child(1)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span><strong>David Chen</strong> \u2022 2 hours ago</span>",
          "target": [
            "article:nth-child(1) > .news-card-body > .news-card-meta > span"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#888888",
                "bgColor": "#ffffff",
                "contrastRatio": 3.54,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<article class=\"news-card\">",
                  "target": [
                    "article:nth-child(1)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<strong>David Chen</strong>",
          "target": [
            "article:nth-child(1) > .news-card-body > .news-card-meta > span > strong"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#888888",
                "bgColor": "#ffffff",
                "contrastRatio": 3.54,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<article class=\"news-card\">",
                  "target": [
                    "article:nth-child(2)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span><strong>Elena Vasquez</strong> \u2022 3 hours ago</span>",
          "target": [
            "article:nth-child(2) > .news-card-body > .news-card-meta > span"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#888888",
                "bgColor": "#ffffff",
                "contrastRatio": 3.54,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<article class=\"news-card\">",
                  "target": [
                    "article:nth-child(2)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<strong>Elena Vasquez</strong>",
          "target": [
            "article:nth-child(2) > .news-card-body > .news-card-meta > span > strong"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#888888",
                "bgColor": "#ffffff",
                "contrastRatio": 3.54,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<article class=\"news-card\">",
                  "target": [
                    "article:nth-child(3)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span><strong>Marcus Webb</strong> \u2022 4 hours ago</span>",
          "target": [
            "article:nth-child(3) > .news-card-body > .news-card-meta > span"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#888888",
                "bgColor": "#ffffff",
                "contrastRatio": 3.54,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<article class=\"news-card\">",
                  "target": [
                    "article:nth-child(3)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<strong>Marcus Webb</strong>",
          "target": [
            "article:nth-child(3) > .news-card-body > .news-card-meta > span > strong"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#888888",
                "bgColor": "#ffffff",
                "contrastRatio": 3.54,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<article class=\"news-card\">",
                  "target": [
                    "article:nth-child(4)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span><strong>Priya Sharma</strong> \u2022 5 hours ago</span>",
          "target": [
            "article:nth-child(4) > .news-card-body > .news-card-meta > span"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#888888",
                "bgColor": "#ffffff",
                "contrastRatio": 3.54,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<article class=\"news-card\">",
                  "target": [
                    "article:nth-child(4)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<strong>Priya Sharma</strong>",
          "target": [
            "article:nth-child(4) > .news-card-body > .news-card-meta > span > strong"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#d42b2b",
                "bgColor": "#361d25",
                "contrastRatio": 3.07,
                "fontSize": "8.4pt (11.2px)",
                "fontWeight": "bold",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"investigative-badge\">\ud83d\udd0d Investigative Series</div>",
                  "target": [
                    ".investigative-badge"
                  ]
                },
                {
                  "html": "<div class=\"investigative-content\">",
                  "target": [
                    ".investigative-content"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.07 (foreground color: #d42b2b, background color: #361d25, font size: 8.4pt (11.2px), font weight: bold). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<div class=\"investigative-badge\">\ud83d\udd0d Investigative Series</div>",
          "target": [
            ".investigative-badge"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.07 (foreground color: #d42b2b, background color: #361d25, font size: 8.4pt (11.2px), font weight: bold). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#888888",
                "bgColor": "#ffffff",
                "contrastRatio": 3.54,
                "fontSize": "8.6pt (11.52px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"sidebar-widget\">",
                  "target": [
                    ".sidebar-widget:nth-child(1)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 8.6pt (11.52px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"meta\">National \u2022 45K reads</span>",
          "target": [
            ".most-read-item:nth-child(1) > .most-read-text > .meta"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 8.6pt (11.52px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#888888",
                "bgColor": "#ffffff",
                "contrastRatio": 3.54,
                "fontSize": "8.6pt (11.52px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"sidebar-widget\">",
                  "target": [
                    ".sidebar-widget:nth-child(1)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 8.6pt (11.52px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"meta\">Weather \u2022 38K reads</span>",
          "target": [
            ".most-read-item:nth-child(2) > .most-read-text > .meta"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 8.6pt (11.52px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#888888",
                "bgColor": "#ffffff",
                "contrastRatio": 3.54,
                "fontSize": "8.6pt (11.52px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"sidebar-widget\">",
                  "target": [
                    ".sidebar-widget:nth-child(1)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 8.6pt (11.52px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"meta\">Community \u2022 31K reads</span>",
          "target": [
            ".most-read-item:nth-child(3) > .most-read-text > .meta"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 8.6pt (11.52px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#888888",
                "bgColor": "#ffffff",
                "contrastRatio": 3.54,
                "fontSize": "8.6pt (11.52px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"sidebar-widget\">",
                  "target": [
                    ".sidebar-widget:nth-child(1)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 8.6pt (11.52px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"meta\">Investigations \u2022 28K reads</span>",
          "target": [
            ".most-read-item:nth-child(4) > .most-read-text > .meta"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 8.6pt (11.52px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#888888",
                "bgColor": "#ffffff",
                "contrastRatio": 3.54,
                "fontSize": "8.6pt (11.52px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"sidebar-widget\">",
                  "target": [
                    ".sidebar-widget:nth-child(1)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 8.6pt (11.52px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<span class=\"meta\">Economy \u2022 24K reads</span>",
          "target": [
            ".most-read-item:nth-child(5) > .most-read-text > .meta"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 8.6pt (11.52px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#888888",
                "bgColor": "#ffffff",
                "contrastRatio": 3.54,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"sidebar-widget\">",
                  "target": [
                    ".sidebar-widget:nth-child(2)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<p>City Hall Auditorium \u2022 6:30 PM</p>",
          "target": [
            ".event-item:nth-child(1) > .event-date > .event-info > p"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#888888",
                "bgColor": "#ffffff",
                "contrastRatio": 3.54,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"sidebar-widget\">",
                  "target": [
                    ".sidebar-widget:nth-child(2)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<p>Central Park Pavilion \u2022 9 AM \u2013 4 PM</p>",
          "target": [
            ".event-item:nth-child(2) > .event-date > .event-info > p"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#888888",
                "bgColor": "#ffffff",
                "contrastRatio": 3.54,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"sidebar-widget\">",
                  "target": [
                    ".sidebar-widget:nth-child(2)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<p>Virtual Event \u2022 7:00 PM EDT</p>",
          "target": [
            ".event-item:nth-child(3) > .event-date > .event-info > p"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#888888",
                "bgColor": "#ffffff",
                "contrastRatio": 3.54,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"sidebar-widget\">",
                  "target": [
                    ".sidebar-widget:nth-child(2)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<p>Convention Center \u2022 10 AM \u2013 3 PM</p>",
          "target": [
            ".event-item:nth-child(4) > .event-date > .event-info > p"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#888888",
                "bgColor": "#ffffff",
                "contrastRatio": 3.54,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"trust-card\">",
                  "target": [
                    ".trust-card:nth-child(1)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<div class=\"role\">Small Business Owner, Richmond VA</div>",
          "target": [
            ".trust-card:nth-child(1) > .trust-card-author > div > .role"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#888888",
                "bgColor": "#ffffff",
                "contrastRatio": 3.54,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"trust-card\">",
                  "target": [
                    ".trust-card:nth-child(2)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<div class=\"role\">Retired Editor, Philadelphia PA</div>",
          "target": [
            ".trust-card:nth-child(2) > .trust-card-author > div > .role"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
        },
        {
          "any": [
            {
              "id": "color-contrast",
              "data": {
                "fgColor": "#888888",
                "bgColor": "#ffffff",
                "contrastRatio": 3.54,
                "fontSize": "9.0pt (12px)",
                "fontWeight": "normal",
                "messageKey": null,
                "expectedContrastRatio": "4.5:1",
                "shadowColor": null
              },
              "relatedNodes": [
                {
                  "html": "<div class=\"trust-card\">",
                  "target": [
                    ".trust-card:nth-child(3)"
                  ]
                }
              ],
              "impact": "serious",
              "message": "Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
            }
          ],
          "all": [],
          "none": [],
          "impact": "serious",
          "html": "<div class=\"role\">Parent &amp; Teacher, Oklahoma City OK</div>",
          "target": [
            ".trust-card:nth-child(3) > .trust-card-author > div > .role"
          ],
          "failureSummary": "Fix any of the following:\n  Element has insufficient color contrast of 3.54 (foreground color: #888888, background color: #ffffff, font size: 9.0pt (12px), font weight: normal). Expected contrast ratio of 4.5:1"
        }
      ]
    }
  ],
  "coverage": {
    "contract": "main-document-vertical-scroll",
    "complete": true,
    "positions": [
      {
        "y": 0,
        "height": 5774
      },
      {
        "y": 576,
        "height": 5774
      },
      {
        "y": 1152,
        "height": 5774
      },
      {
        "y": 1728,
        "height": 5774
      },
      {
        "y": 2304,
        "height": 5774
      },
      {
        "y": 2880,
        "height": 5774
      },
      {
        "y": 3456,
        "height": 5774
      },
      {
        "y": 4032,
        "height": 5774
      },
      {
        "y": 4608,
        "height": 5774
      },
      {
        "y": 5054,
        "height": 5774
      }
    ],
    "scans": 11,
    "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 "News/Weather/Information" 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: "News/Weather/Information"
- Description: News outlets, weather forecasts, breaking news, and general information resources.

**Your Creative Task:**
1.  **Invent:** Create a unique, professional-sounding site name and a strong tagline fitting the "News/Weather/Information" 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: "National", "World", "Archive".
-   **MAIN CONTENT:** Structure this area with **at least 3-4 distinct, well-developed sections**.
    -   Address key topics relevant to the "News/Weather/Information" category. Consider themes similar to: "Local Coverage", "Weather Forecasts", "Investigative Reports".
    -   **Content Depth:** Populate each section with **substantial, realistic text** (multiple sentences/paragraphs). Use authentic industry language and terminology like: "weather patterns", "investigative", "headline".
    -   **Visuals:** Integrate relevant placeholder images logically within the content sections.
    -   **Calls to Action:** Include clear and contextually relevant CTAs. Use strong verbs similar to: "Get Alerts", "Sign Up", "Subscribe".
-   **ENGAGEMENT (Recommended):** Strongly consider incorporating **one meaningful interactive element** that would genuinely benefit a user in the "News/Weather/Information" sector. Ideas similar but not limited to: "weather radar".
-   **SIDEBAR (Optional):** If your design includes a sidebar, populate it with **useful, relevant content**. Ideas: "upcoming events", "most read", "video highlights".
-   **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.