/* WordsmithDirect Optimized Stylesheet - Complete Rewrite */
/* File: styles.css */
/* Version: 2.0 - Single Source of Truth Architecture */
/* Date: August 18, 2025 */

/* ============================
   CSS CUSTOM PROPERTIES (VARIABLES)
   ============================ */
:root {
    /* Brand Colors */
    --brand-blue: #0066FF;
    --blue-700: #1d4ed8;
    --blue-800: #1e40af;
    --blue-50: #eff6ff;
    --blue-100: #dbeafe;
    
    /* Neutral Colors */
    --slate-50: #f8fafc;
    --slate-100: #f1f5f9;
    --slate-200: #e2e8f0;
    --slate-400: #94a3b8;
    --slate-500: #64748b;
    --slate-600: #475569;
    --slate-700: #334155;
    --slate-800: #1e293b;
    --slate-900: #0f172a;
    
    /* Accent Colors */
    --green-500: #10b981;
    --green-600: #059669;
    --green-700: #047857;
    
    /* Additional Variables */
    --primary-600: #2563eb;
    --clickhere-red: #FFD700;
    
    /* Footer Trust Icons - Global Control */
    --trust-icon-1: "⚡";
    --trust-text-1: "48-Hour Email Responses";
    --trust-icon-2: "🎯";
    --trust-text-2: "FinTech & Wellness Expert";
    --trust-icon-3: "✅";
    --trust-text-3: "Blueprint Process Guaranteed";
    --trust-icon-4: "📈";
    --trust-text-4: "Conversion-Focused Results";
    
    /* Typography */
    --font-primary: 'Inter', sans-serif;
    --font-serif: 'Lora', serif;
    
    /* Spacing */
    --container-max-width: 1200px;
    --section-padding: 80px 0;
    
    /* Shadows */
    --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1);
    --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1);
    --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1);
    
    /* Footer Trust Icons - Global Control */
    --trust-icon-1: "⚡";
    --trust-text-1: "48-Hour Email Responses";
    --trust-icon-2: "🎯";
    --trust-text-2: "FinTech & Wellness Expert";
    --trust-icon-3: "✅";
    --trust-text-3: "Blueprint Process Guaranteed";
    --trust-icon-4: "📈";
    --trust-text-4: "Conversion-Focused Results";
}

/* ============================
   GLOBAL RESET & BASE STYLES
   ============================ */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: var(--font-primary);
    line-height: 1.6;
    color: var(--slate-700);
    background-color: #ffffff;
    font-display: swap;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden; /* Prevent horizontal scroll/wobble on mobile */
}

/* ============================
   SKIP TO CONTENT (ACCESSIBILITY)
   ============================ */
.skip-to-content {
    position: absolute;
    left: -9999px;
    z-index: 999;
    padding: 1em;
    background-color: var(--brand-blue);
    color: white;
    text-decoration: none;
    font-weight: 700;
    border-radius: 0 0 4px 0;
}

.skip-to-content:focus {
    left: 0;
    top: 0;
}

html {
    scroll-padding-top: 80px;
}

/* Container */
.container {
    max-width: var(--container-max-width);
    margin: 0 auto;
    padding: 0 20px;
}


/* ============================
   MODERN HEADER SYSTEM (#wd-header)
   ============================ */

/* Main Header Container */
#wd-header {
    width: 100%;
    background: #fff;
    border-bottom: 1px solid #e6e8ec;
}

#wd-header * {
    box-sizing: border-box;
}

#wd-header .wd-header-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 6px 10px;
    display: grid;
    grid-template-columns: auto minmax(0,1fr) auto;
    align-items: center;
    column-gap: clamp(56px, 5vw, 72px);
}

/* Header Logo System */
#wd-header .wd-logo img {
    height: 128px;
    width: auto;
    display: block;
}

@media(max-width:1366px) {
    #wd-header .wd-logo img {
        height: 116px;
    }
}

@media(min-width:1536px) {
    #wd-header .wd-logo img {
        height: 140px;
    }
}

/* Header Logo Box for Estimate Pages */
.header-logo-box {
    background: #ffffff;        /* pure white */
    padding: 12px;
    border-radius: 8px;
    display: inline-block;
}

/* Header Navigation */
#wd-header nav {
    justify-self: center;
    display: flex;
    gap: clamp(14px, 1.6vw, 18px);
}

#wd-header nav a {
    font-size: 20px;
    font-weight: 700;
    color: #1f2937;
    text-decoration: underline;
    text-decoration-color: #000000;
    text-underline-offset: 6px;
    line-height: 1.2;
    padding: 3px 4px;
    white-space: normal;
}

#wd-header nav a:hover {
    color: var(--brand-blue);
    text-decoration: underline;
    text-decoration-color: var(--brand-blue);
    text-underline-offset: 6px;
}

#wd-header .is-active {
    color: var(--brand-blue);
    text-decoration: underline;
    text-decoration-color: var(--brand-blue);
    text-underline-offset: 6px;
}

@media(max-width:1366px) {
    #wd-header nav {
        gap: 16px;
    }
    #wd-header nav a {
        font-size: 19px;
    }
}

/* Header CTA Button - Single Source of Truth */
#wd-header .btn-primary-clickhere {
    justify-self: end;
    padding: 12px 18px;
    border-radius: 16px;
    min-width: 0;
    width: auto;
    max-width: clamp(420px, 33vw, 480px);
    box-shadow: 0 2px 0 rgba(0,0,0,.45);
    transition: transform .12s ease, box-shadow .12s ease;
    margin-left: clamp(20px, 2.2vw, 28px);
    background-color: var(--brand-blue);
    color: white;
    border: 2px solid black;
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1.2;
    text-decoration: none;
    position: relative;
    overflow: hidden;
}

#wd-header .btn-primary-clickhere .clickhere-text {
    font-weight: 800;
    line-height: 1.08;
    white-space: nowrap;
    letter-spacing: -0.15px;
    font-size: clamp(20px, 1.4vw, 22.5px);
    color: var(--clickhere-red);
}

#wd-header .btn-primary-clickhere .cta-subtext {
    display: block;
    white-space: nowrap;
    font-weight: 700;
    line-height: 1.14;
    font-size: clamp(13px, 1.0vw, 14px);
    color: #fff;
    margin-top: 4px;
}

#wd-header .btn-primary-clickhere:hover {
    transform: translateY(-1px);
    box-shadow: 0 3px 0 rgba(0,0,0,.5);
    background-color: var(--blue-700);
}

/* Header CTA Shimmer Effect */
#wd-header .btn-primary-clickhere::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: left 0.5s;
}

#wd-header .btn-primary-clickhere:hover::before {
    left: 100%;
}

/* Mobile Header Adjustments */
@media(max-width:1024px) {
    #wd-header nav,
    #wd-header .btn-primary-clickhere {
        display: none !important;
    }
    #wd-header .wd-logo img {
        height: 92px;
    }
    #wd-header .wd-header-inner {
        column-gap: 24px;
    }

    /* Show hamburger button on mobile */
    .mobile-menu-toggle {
        display: flex !important;
    }
}

/* Hamburger Menu System */
.mobile-menu-toggle {
    display: none; /* Hidden by default on desktop */
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    cursor: pointer;
    padding: 8px;
    z-index: 10001;
    position: relative;
}

.hamburger-icon {
    font-size: 2rem;
    color: #0066FF;
    line-height: 1;
}

/* Mobile Menu Drawer */
.mobile-menu {
    position: fixed;
    top: 0;
    right: -100%; /* Hidden off-screen by default */
    width: 300px;
    max-width: 85vw;
    height: 100vh;
    height: 100dvh; /* Use dynamic viewport height on mobile for better browser chrome handling */
    background: #ffffff;
    box-shadow: -2px 0 20px rgba(0, 0, 0, 0.3);
    transition: right 0.3s ease;
    z-index: 10000;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch; /* Smooth scrolling on iOS */
    visibility: hidden; /* Prevent interaction when hidden */
    display: flex;
    flex-direction: column;
}

.mobile-menu.active {
    right: 0; /* Slide into view */
    visibility: visible; /* Allow interaction when visible */
}

/* Mobile Menu Overlay Background */
.mobile-menu-overlay {
    position: fixed !important;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: rgba(0, 0, 0, 0.5);
    opacity: 0;
    visibility: hidden !important;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    z-index: 9999;
    display: none;
}

.mobile-menu-overlay.active {
    display: block;
    opacity: 1;
    visibility: visible !important;
}

/* Mobile Menu Header */
.mobile-menu-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    border-bottom: 2px solid #e2e8f0;
    background: #f8fafc;
    flex-shrink: 0; /* Keep header at top */
}

.mobile-menu-logo {
    font-size: 1.25rem;
    font-weight: 700;
    color: #0066FF;
}

.mobile-menu-close {
    background: none;
    border: none;
    font-size: 2rem;
    color: #1e293b;
    cursor: pointer;
    padding: 4px;
    line-height: 1;
}

/* Mobile Menu Navigation */
.mobile-menu nav {
    padding: 30px 0;
    /* No flex or overflow - let parent handle scrolling */
}

.mobile-menu nav a {
    display: block;
    padding: 16px 30px;
    font-size: 1.125rem;
    font-weight: 600;
    color: #1e293b;
    text-decoration: none;
    border-bottom: 1px solid #e2e8f0;
    transition: all 0.2s ease;
}

.mobile-menu nav a:hover,
.mobile-menu nav a:active {
    background: #f8fafc;
    color: #0066FF;
    padding-left: 40px;
}

.mobile-menu nav a.is-active {
    color: #0066FF;
    background: #eff6ff;
    border-left: 4px solid #0066FF;
}

/* Mobile Menu CTA */
.mobile-menu-cta {
    padding: 20px 30px 30px 30px; /* Extra bottom padding for mobile browser chrome */
    border-top: 2px solid #e2e8f0;
    flex-shrink: 0; /* Prevent CTA from shrinking */
}

.mobile-menu-cta .btn {
    width: 100%;
    display: block;
    text-align: center;
    padding: 16px 20px;
    background: #0066FF;
    color: white;
    text-decoration: none;
    border-radius: 8px;
    font-weight: 700;
    font-size: 1.125rem;
    transition: background 0.2s ease;
}

.mobile-menu-cta .btn:hover,
.mobile-menu-cta .btn:active {
    background: #0052cc;
    transform: scale(0.98);
}

/* Prevent body scroll when menu is open */
body.mobile-menu-open {
    overflow: hidden;
}

/* Hide hamburger button when menu is open */
body.mobile-menu-open .mobile-menu-toggle {
    display: none !important;
}

/* Header Active Link Styles */
#wd-header .wd-link:hover {
    color: var(--brand-blue) !important;
    text-decoration: underline;
    text-decoration-color: var(--brand-blue);
    text-underline-offset: 6px;
}

#wd-header .wd-link.is-active {
    color: var(--brand-blue) !important;
    text-decoration: underline;
    text-decoration-color: var(--brand-blue);
    text-underline-offset: 6px;
}

#wd-header .wd-link.is-active:hover {
    color: var(--brand-blue) !important;
    text-decoration: underline;
    text-decoration-color: var(--brand-blue);
    text-underline-offset: 6px;
}

@media (prefers-reduced-motion: reduce) {
    #wd-header * {
        transition: none !important;
    }
}

/* ============================
   BUTTON SYSTEM (NON-HEADER CTAs)
   ============================ */

/* Base Button Class */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 600 !important;
    text-decoration: none;
    border-radius: 8px;
    transition: all 0.3s ease;
    cursor: pointer;
    border: 2px solid #000000 !important;
    font-family: inherit;
    padding: 12px 24px !important;
    font-size: 16px !important;
}

.btn-primary {
    background-color: var(--brand-blue) !important;
    color: #ffffff !important;
    border: 2px solid #000000 !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.4);
}

.btn-primary:hover {
    background-color: var(--blue-700) !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.btn-primary:focus-visible {
    outline: 2px solid var(--brand-blue);
    outline-offset: 2px;
}

.btn-secondary {
    background: #ffffff !important;
    color: #1e293b !important;
    border: 2px solid #000000 !important;
    font-weight: 600 !important;
}

.btn-secondary:hover {
    background: #f8fafc !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.btn:disabled {
    opacity: 0.85 !important;
    cursor: not-allowed !important;
    transform: none !important;
    background: #f1f5f9 !important;
    color: #334155 !important;
    border: 2px solid #94a3b8 !important;
}

/* Standard Click Here CTA Buttons */
.btn-primary-clickhere {
    background-color: var(--brand-blue);
    color: white;
    border: 2px solid black;
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1.2;
    padding: 16px 24px;
    font-size: 16px;
    min-width: 280px;
    text-decoration: none;
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.btn-primary-clickhere::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: left 0.5s;
}

.btn-primary-clickhere:hover::before {
    left: 100%;
}

.btn-primary-clickhere:hover {
    background-color: var(--blue-700);
    transform: translateY(-1px);
}

.clickhere-text {
    font-size: 20px;
    font-weight: 600;
    color: var(--clickhere-red);
}

.cta-subtext {
    font-size: 15px;
    font-weight: 600;
    color: white;
}

/* Large Click Here CTA Buttons */
.btn-primary-clickhere-large {
    background-color: var(--brand-blue);
    color: white;
    border: 2px solid black;
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1.2;
    padding: 16px 32px;
    text-decoration: none;
    border-radius: 8px;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
}

.btn-primary-clickhere-large::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: left 0.5s;
}

.btn-primary-clickhere-large:hover::before {
    left: 100%;
}

.btn-primary-clickhere-large:hover {
    background-color: var(--blue-700);
    transform: translateY(-3px);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.3);
}

.btn-primary-clickhere-large:focus {
    outline: 3px solid rgba(255, 215, 0, 0.5);
    outline-offset: 2px;
}

.clickhere-text-large {
    font-size: 28px;
    font-weight: 700;
    color: var(--clickhere-red);
}

.cta-subtext-large {
    font-size: 16px;
    font-weight: 600;
    color: white;
}


/* Emergency Button (Copy Emergency Room) */
.btn-emergency {
    background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
    color: #1f2937;
    border: 2px solid #000;
    padding: 12px 24px;
    font-size: 1rem;
    font-weight: 700;
    border-radius: 8px;
    text-decoration: none;
    display: inline-block;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    position: relative;
    overflow: hidden;
}

.btn-emergency::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
    transition: left 0.5s;
}

.btn-emergency:hover::before {
    left: 100%;
}

.btn-emergency:hover {
    background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
}

.btn-emergency:active {
    transform: translateY(0);
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
}

/* Contact Green Button */
.btn-contact-green {
    background-color: #007849;
    color: white;
    border: 2px solid black;
    display: flex;
    flex-direction: column;
    align-items: center;
    line-height: 1.2;
    padding: 16px 32px;
    text-decoration: none;
    border-radius: 8px;
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
}

.btn-contact-green::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
    transition: left 0.5s;
}

.btn-contact-green:hover::before {
    left: 100%;
}

.btn-contact-green:hover {
    background-color: #006040;
    transform: translateY(-3px);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.3);
}

.btn-contact-green:focus {
    outline: 3px solid rgba(255, 215, 0, 0.5);
    outline-offset: 2px;
}

.clickhere-text-large {
    font-size: 1.5rem;
    font-weight: 800;
    line-height: 1.08;
    color: #FFD700;
}

.cta-subtext-large {
    display: block;
    font-size: 0.9rem;
    line-height: 1.14;
    color: #fff;
    margin-top: 4px;
}

/* ============================
   MARQUEE ANNOUNCEMENT SYSTEM
   ============================ */
.marquee-container {
    background: linear-gradient(90deg, #E3F2FD, #BBDEFB);
    color: var(--slate-800);
    padding: 8px 0;
    overflow: hidden;
    white-space: nowrap;
    position: relative;
}

.marquee-content {
    display: inline-block;
    animation: scroll-left 15s linear infinite;
    font-weight: 600;
    font-size: 1.375rem;
}

@keyframes scroll-left {
    0% { transform: translateX(100%); }
    100% { transform: translateX(-100%); }
}

/* ============================
   HERO SECTION
   ============================ */
.hero {
    background: linear-gradient(135deg, var(--brand-blue) 0%, var(--blue-700) 50%, var(--blue-800) 100%);
    color: white;
    padding: 8px 0;
    text-align: center;
}

.hero-content {
    max-width: 1400px;
    margin: 0 auto;
    animation: none !important;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.hero-badge {
    display: inline-flex;
    align-items: center;
    background: rgba(255, 255, 255, 0.15);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 50px;
    padding: 8px 20px;
    margin-bottom: 32px;
    font-size: 16px;
    font-weight: 600;
    backdrop-filter: blur(10px);
    animation: none !important;
}

.badge-icon {
    display: inline-block;
    animation: flame-dance 2s ease-in-out infinite;
    filter: drop-shadow(0 0 6px rgba(255, 69, 0, 1)) drop-shadow(0 0 12px rgba(255, 140, 0, 0.8));
    transform-origin: bottom center;
    margin-right: 8px;
}

@keyframes flame-dance {
    0% { 
        transform: scale(0.9) rotate(-3deg);
        filter: drop-shadow(0 0 4px rgba(255, 69, 0, 0.8)) drop-shadow(0 0 8px rgba(255, 140, 0, 0.6));
    }
    50% {
        transform: scale(1.1) rotate(2deg);
        filter: drop-shadow(0 0 8px rgba(255, 69, 0, 1)) drop-shadow(0 0 16px rgba(255, 140, 0, 0.9));
    }
    100% { 
        transform: scale(1.05) rotate(-2deg);
        filter: drop-shadow(0 0 6px rgba(255, 69, 0, 1)) drop-shadow(0 0 12px rgba(255, 140, 0, 0.8));
    }
}


.hero-headline {
    font-size: 3.5rem;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 24px;
    font-family: var(--font-serif);
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    letter-spacing: -0.02em;
    max-width: 1300px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.hero-headline > span {
    display: block;
}

.hero-line-1,
.hero-line-2,
.hero-line-3 {
    white-space: nowrap;
    text-align: center;
}

.hero-headline-final {
    color: white;
}

.highlight {
    color: #93c5fd;
    font-weight: inherit;
    white-space: nowrap;
}

.highlight-yellow {
    color: var(--clickhere-red);
    font-weight: inherit;
}


.hero-subtitle {
    font-size: 1.25rem;
    line-height: 1.5;
    margin-bottom: 0px;
    color: white;
    transition: transform 0.3s ease;
    max-width: 780px;
    margin-left: auto;
    margin-right: auto;
}

.hero-subtitle:hover {
    transform: none;
}

.hero-subtitle strong {
    color: #FFD700;
    font-weight: 700;
}

.hero-subtitle + .hero-subtitle {
    margin-top: 0px;
}

.hero-subheadline-final {
    color: #fff;
    font-size: 1.35rem;
}

.hero-ctas-centered {
    display: flex;
    justify-content: center;
    margin-top: 15px;
}

.hero-guarantee {
    color: white;
    font-style: italic;
    font-size: 24px !important;
    font-weight: 700 !important;
    margin-top: 24px;
    opacity: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    line-height: 1.3;
}

.guarantee-star {
    color: var(--clickhere-red);
    font-size: 1.25em;
    font-weight: bold;
}

.guarantee-text {
    /* Styling for guarantee text spans */
}

/* ============================
   TRUST INDICATORS SECTION
   ============================ */
.trust-indicators {
    background: white;
    padding: 16px 0 5px 0;
}

.trust-subtitle {
    text-align: center;
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--slate-800);
    margin-bottom: 32px;
    letter-spacing: 0.5px;
    font-family: var(--font-serif);
    text-decoration: none !important;
    text-underline-offset: initial;
    text-decoration-thickness: initial;
    border: 0 !important;
}

.trust-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
    text-align: center;
}

.trust-item {
    padding: 20px;
    cursor: default;
}


.trust-icon {
    font-size: 3rem;
    margin-bottom: 16px;
}






.trust-title {
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--slate-800);
    margin-bottom: 16px;
    font-family: var(--font-serif);
}

.trust-desc {
    color: var(--slate-800);
    font-size: 1rem;
    line-height: 1.6;
    max-width: 600px;
    margin: 0 auto;
    text-align: center;
    word-wrap: break-word;
    hyphens: none;
    overflow-wrap: break-word;
}

/* ============================
   INDUSTRY SECTIONS
   ============================ */
.industry-sections {
    background: #ffffff !important;
    padding: 30px 0 40px 0;
}

.section-header {
    text-align: center;
    margin-bottom: 64px;
    margin-top: 0;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.section-title {
    font-size: 3.2rem;
    font-weight: 700;
    color: var(--slate-800);
    margin-bottom: 32px;
    font-family: var(--font-serif);
}

.section-subtitle {
    font-size: 1.2rem;
    color: var(--slate-800);
    line-height: 1.6;
    margin-top: 8px;
    display: block;
}

.industry-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 48px;
    align-items: start;
}

.industry-card {
    background: white;
    border-radius: 12px;
    padding: 32px;
    box-shadow: var(--shadow-lg);
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    min-height: 600px;
}

.industry-card:hover {
    box-shadow: var(--shadow-xl);
}

.card-header {
    display: flex;
    align-items: center;
    margin-bottom: 24px;
}

.card-icon {
    font-size: 2rem;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    margin-right: 12px;
    color: var(--primary-600);
}

.fintech-icon {
    background: var(--blue-100);
}

.wellness-icon {
    background: #dcfce7;
}

.card-title {
    font-size: 2.2rem;
    font-weight: 700;
    color: var(--slate-800);
    font-family: var(--font-serif);
    display: flex;
    align-items: center;
    margin-bottom: 20px;
    white-space: nowrap;
    min-height: 2.6rem;
}

.card-title a {
    display: inline-block;
    line-height: 1.2;
    vertical-align: top;
}

.card-description {
    color: var(--slate-800);
    margin-bottom: 24px;
    line-height: 1.6;
    font-size: 1.3rem;
}

.card-features {
    list-style: none;
    margin-bottom: 32px;
}

.card-features li {
    color: var(--slate-800);
    display: flex;
    align-items: flex-start;
    margin-bottom: 12px;
}

.card-features i {
    color: var(--green-500);
    font-weight: 700;
    margin-right: 12px;
    margin-top: 2px;
    flex-shrink: 0;
}

/* ============================
   PROCESS PREVIEW SECTION
   ============================ */
.process-preview {
    background: white;
    padding: 40px 0 80px 0;
}

.process-steps {
    display: flex;
    justify-content: center;
    gap: 4rem;
    padding: 2rem;
}

.process-step {
    width: 320px;
    text-align: center;
    padding: 1.5rem 1.5rem;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.1);
}

/* Removed conflicting step-number definition - using wizard form version instead */

.step-title {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--slate-800);
    margin-bottom: 16px;
    font-family: var(--font-serif);
    min-height: 2rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.step-description {
    color: var(--slate-600);
    line-height: 1.6;
}

.process-cta {
    text-align: center;
    margin-top: 20px;
}

.process-cta .btn-primary-clickhere {
    min-width: 280px;
    max-width: 320px;
    margin: 0 auto;
    display: flex;
}

/* ============================
   COPY EMERGENCY ROOM CALLOUT
   ============================ */
.copy-emergency-callout {
    background: linear-gradient(135deg, #dc2626 0%, #b91c1c 50%, #991b1b 100%);
    color: white;
    padding: 16px 0;
    border-top: 2px solid #fbbf24;
    border-bottom: 2px solid #fbbf24;
    position: relative;
    overflow: hidden;
    max-width: 600px;
    margin: 20px auto;
    border-radius: 8px;
}

.copy-emergency-callout::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: repeating-linear-gradient(
        45deg,
        transparent,
        transparent 8px,
        rgba(255, 255, 255, 0.05) 8px,
        rgba(255, 255, 255, 0.05) 16px
    );
    pointer-events: none;
}

.emergency-content {
    max-width: 420px;
    margin: 0 auto;
    text-align: center;
    position: relative;
    z-index: 1;
}

.emergency-header {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    margin-bottom: 8px;
}

.emergency-icon {
    font-size: 2rem;
    animation: none !important;
    filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.3));
}

@keyframes pulse-emergency {
    0%, 100% { 
        opacity: 1; 
        transform: scale(1);
    }
    50% { 
        opacity: 0.7; 
        transform: scale(1.1);
    }
}

.emergency-title {
    font-size: 1.625rem;
    font-weight: 700;
    color: white;
    margin: 0;
    font-family: var(--font-serif);
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.emergency-description {
    font-size: 1rem;
    line-height: 1.3;
    margin-bottom: 12px;
    color: #fef3c7;
    font-weight: 600;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

.emergency-cta {
    margin-top: 12px;
}

/* ============================
   FOOTER SYSTEM
   ============================ */

/* General Footer (Non-Homepage) */
.footer {
    background: var(--slate-900);
    color: white;
    padding: 60px 0 20px;
}

.footer-logo {
    height: 80px;
    width: auto;
    margin-bottom: 16px;
    filter: brightness(0) invert(1);
}

.footer-tagline {
    color: #94a3b8;
    line-height: 1.6;
}

.footer-heading {
    font-weight: 600;
    margin-bottom: 16px;
    color: white;
}

.footer-menu a {
    color: #94a3b8;
    text-decoration: none;
    transition: color 0.3s ease;
}

.footer-menu a:hover {
    color: white;
}

.footer-bottom {
    border-top: 1px solid #374151;
    padding-top: 20px;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.copyright {
    color: #1e293b;
    font-size: 0.875rem;
}

.hero-credit {
    color: #94a3b8;
    font-size: 0.875rem;
    font-style: italic;
}

/* Homepage Footer System */
.footer-homepage {
    background: white;
    color: var(--slate-700);
    padding: 16px 0 12px;
    border-top: 1px solid var(--slate-200);
}

.footer-content {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    margin-bottom: 16px;
}

.footer-brand {
    text-align: center;
}

.footer-logo-homepage {
    height: 115px;
    width: auto;
    pointer-events: auto !important; /* Ensure clickability */
    user-select: none;
    -webkit-user-select: none;
    -webkit-user-drag: none;
    -webkit-touch-callout: none;
}

.footer-tagline-homepage {
    color: #1e293b;
    line-height: 1.6;
    font-size: 16px;
    margin-bottom: 18px;
    max-width: 650px;
    margin-left: auto;
    margin-right: auto;
    transition: none;
}

.footer-tagline-homepage:hover {
    color: #1e293b;
}

.footer-tagline-homepage:last-of-type {
    margin-bottom: 18px;
}

.footer-cta {
    margin-top: 24px;
    margin-bottom: 32px;
}

.footer-links {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    max-width: 800px;
    margin: 24px auto;
    align-items: start;
}

/* Footer trust icons alignment system */
.footer-column {
    display: flex;
    flex-direction: column;
    position: relative;
}

.footer-column .footer-menu {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    min-height: 180px; /* Ensures consistent height across columns */
}

.footer-column .footer-trust-signals {
    margin-top: auto; /* Pushes trust signals to bottom */
    padding-top: 16px;
}

.footer-trust-item {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 40px; /* Increased for better alignment */
    font-size: 14px;
    color: var(--slate-600);
    font-weight: 600;
    padding: 8px 0;
    transition: all 0.3s ease;
    position: relative;
}

.footer-trust-item .trust-icon {
    font-size: 24px;
    width: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    line-height: 1;
}

.footer-trust-item .trust-text {
    line-height: 1.3;
    flex: 1;
}

/* Global Trust Icon Content Control */
.footer-trust-item:nth-child(1) .trust-icon::before {
    content: var(--trust-icon-1);
}

.footer-trust-item:nth-child(1) .trust-text::before {
    content: var(--trust-text-1);
}

.footer-trust-item:nth-child(2) .trust-icon::before {
    content: var(--trust-icon-2);
}

.footer-trust-item:nth-child(2) .trust-text::before {
    content: var(--trust-text-2);
}

/* Trust icons 3 & 4 for right column */
.footer-column:nth-child(2) .footer-trust-item:nth-child(1) .trust-icon::before {
    content: var(--trust-icon-3);
}

.footer-column:nth-child(2) .footer-trust-item:nth-child(1) .trust-text::before {
    content: var(--trust-text-3);
}

.footer-column:nth-child(2) .footer-trust-item:nth-child(2) .trust-icon::before {
    content: var(--trust-icon-4);
}

.footer-column:nth-child(2) .footer-trust-item:nth-child(2) .trust-text::before {
    content: var(--trust-text-4);
}

/* ============================
   FAQ STYLES
   ============================ */
.faq-hero {
    background: linear-gradient(135deg, var(--slate-800) 0%, var(--slate-900) 100%);
    color: white;
    padding: 24px 0;
    text-align: center;
}

.faq-hero-content {
    max-width: 800px;
    margin: 0 auto;
}

.faq-hero-headline {
    font-size: 2.5rem;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 24px;
    font-family: var(--font-serif);
    color: white;
}

.faq-hero-subheadline {
    font-size: 1.25rem;
    line-height: 1.6;
    color: #cbd5e1;
}

.faq-sections {
    background: var(--slate-50);
    padding: 80px 0;
}

.faq-category {
    background: white;
    border-radius: 12px;
    padding: 32px;
    margin-bottom: 40px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08);
    border: 1px solid rgba(0, 0, 0, 0.1);
}

/* Enhanced spacing for better visual hierarchy */
.faq-category:first-child {
    margin-top: 0;
}

.faq-category:last-child {
    margin-bottom: 0;
}

.faq-category-title {
    font-size: 1.75rem;
    font-weight: 700;
    color: var(--slate-800);
    margin-bottom: 24px;
    padding-bottom: 12px;
    border-bottom: 2px solid var(--brand-blue);
    font-family: var(--font-serif);
}

.faq-item {
    border-bottom: 1px solid var(--slate-200);
    margin-bottom: 16px;
}

.faq-item:last-child {
    border-bottom: none;
    margin-bottom: 0;
}

.faq-question {
    width: 100%;
    background: none;
    border: none;
    padding: 20px 0;
    text-align: left;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--slate-800);
    line-height: 1.4;
    transition: color 0.3s ease;
}

.faq-question:hover {
    color: var(--brand-blue);
}

.faq-question:hover .faq-icon {
    color: var(--brand-blue);
}

.faq-icon {
    font-size: 1.5rem;
    font-weight: 300;
    color: var(--slate-800);
    flex-shrink: 0;
    transition: transform 0.3s ease;
}

.faq-item.active .faq-icon {
    transform: rotate(180deg);
    color: var(--brand-blue);
}

.faq-item.active .faq-question {
    color: var(--brand-blue);
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
    padding: 0 0 0 0;
}

.faq-item.active .faq-answer {
    padding: 0 0 20px 0;
}

.faq-answer p {
    color: #1e293b;
    line-height: 1.6;
    font-size: 1rem;
    margin-bottom: 16px;
}

.faq-answer p:last-child {
    margin-bottom: 0;
}

/* ============================
   UTILITY CLASSES
   ============================ */

/* Inline Link Styling */
.inline-link,
.trust-desc a {
    color: var(--brand-blue);
    text-decoration: underline;
    text-underline-offset: 2px;
    font-weight: 600;
    transition: color 0.2s ease;
}

.inline-link:hover,
.trust-desc a:hover {
    color: #4f46e5;
}

/* No-wrap utility */
.no-wrap { 
    white-space: nowrap; 
}

/* Scroll margin for anchor links */
.section-anchor {
    scroll-margin-top: 96px;
}

/* Scroll Animation Classes */
.animate-on-scroll {
    opacity: 0;
    transform: translateY(50px);
    transition: all 0.8s ease-out;
}

.animate-on-scroll.animated {
    opacity: 1;
    transform: translateY(0);
}

.animate-on-scroll:nth-child(1) { transition-delay: 0s; }
.animate-on-scroll:nth-child(2) { transition-delay: 0.2s; }
.animate-on-scroll:nth-child(3) { transition-delay: 0.4s; }
.animate-on-scroll:nth-child(4) { transition-delay: 0.6s; }

/* ============================
   RESPONSIVE DESIGN SYSTEM
   ============================ */

/* Small Tablets and Large Phones */
@media (min-width: 640px) {
    .trust-grid {
        grid-template-columns: repeat(6, 1fr);
        gap: 5px 40px;
    }
    
    .trust-item:nth-child(1) { grid-column: 1 / 3; }
    .trust-item:nth-child(2) { grid-column: 3 / 5; }
    .trust-item:nth-child(3) { grid-column: 5 / 7; }
    .trust-item:nth-child(4) { grid-column: 2 / 4; }
    .trust-item:nth-child(5) { grid-column: 4 / 6; }
}

/* Tablets */
@media (min-width: 768px) {
    .nav-desktop {
        display: flex;
    }
    
    .nav-cta {
        display: block;
    }
    
    .mobile-menu-btn {
        display: none;
    }
    
    .hero-headline {
        font-size: 3.5rem;
    }
    
    .industry-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .process-steps {
        grid-template-columns: repeat(4, 1fr);
    }
    
    .footer-content {
        grid-template-columns: 2fr 3fr;
    }
    
    .footer-brand {
        text-align: left;
    }
}

/* Tablet Optimization */
@media (min-width: 768px) and (max-width: 1023px) {
    .hero-headline {
        font-size: 3.25rem;
    }
    
    .hero-subtitle {
        font-size: 1.375rem;
    }
    
    .btn-primary-clickhere {
        min-width: 320px;
    }
    
    .nav-desktop .nav-link {
        font-size: 1.25rem;
        padding: 10px 16px;
    }
}

/* Desktop */
@media (min-width: 1024px) {
    .hero-headline {
        font-size: 4rem;
    }
    
    .section-title {
        font-size: 3rem;
    }
}

/* Title Layout Fix */
@media (max-width: 1200px) {
    .hero-headline {
        font-size: 3.2rem;
        max-width: 800px;
    }
}

@media (max-width: 1024px) {
    .hero-headline {
        font-size: 2.8rem;
        max-width: 700px;
    }
}

/* Mobile Optimizations */
@media (max-width: 767px) {
    .hero {
        padding: 48px 0 56px;
    }
    
    .industry-grid {
        grid-template-columns: 1fr;
    }
    
    .trust-indicators {
        padding: 30px 0 40px 0;
    }
    
    .industry-sections {
        padding: 60px 0;
    }
    
    .process-preview {
        padding: 60px 0;
    }
    
    .section-header {
        margin-bottom: 48px;
    }
    
    .trust-item {
        padding: 24px;
    }
    
    .industry-card {
        padding: 32px;
        min-height: auto;
    }
    
    .trust-grid {
        gap: 32px;
    }
    
    .industry-grid {
        gap: 32px;
    }
    
    .nav-link-mobile {
        font-size: 18px;
        padding: 16px 0;
        min-height: 48px;
        display: flex;
        align-items: center;
    }
    
    .mobile-cta {
        padding: 16px 24px;
        font-size: 16px;
        min-height: 56px;
        border-radius: 8px;
        margin-top: 24px;
    }
    
    .mobile-menu-btn {
        width: 48px;
        height: 48px;
        padding: 12px;
    }
    
    .hero {
        padding: 60px 0 80px;
    }
    
    .hero-badge {
        font-size: 14px;
        padding: 6px 16px;
        margin-bottom: 24px;
    }
    
    .hero-headline {
        font-size: 2.75rem !important;
        line-height: 1.1;
        margin-bottom: 24px;
    }
    
    .hero-subtitle {
        font-size: 1.375rem;
        line-height: 1.5;
        margin-bottom: 20px;
    }
    
    .hero-ctas-centered {
        margin-top: 48px;
        padding: 0 16px;
    }
    
    .btn-primary-clickhere-large {
        min-width: 100%;
        max-width: 380px;
        padding: 18px 24px;
    }
    
    .clickhere-text-large {
        font-size: 26px;
    }
    
    .trust-title {
        font-size: 1.5rem;
    }
    
    .trust-desc {
        font-size: 1rem;
        line-height: 1.6;
    }
    
    .card-title {
        font-size: 1.75rem;
    }
    
    .card-description {
        font-size: 1.125rem;
    }
    
    .section-title {
        font-size: 2.25rem !important;
        line-height: 1.2;
    }
    
    .footer-content {
        text-align: center;
    }
    
    .footer-links {
        grid-template-columns: repeat(2, 1fr);
        gap: 24px;
    }
    
    /* Mobile Emergency Button */
    .emergency-header {
        flex-direction: column;
        gap: 8px;
    }
    
    .emergency-icon {
        font-size: 2.5rem;
    }
    
    .emergency-title {
        font-size: 2rem;
    }
    
    .emergency-description {
        font-size: 1.25rem;
    }
    
    .btn-emergency {
        padding: 14px 24px;
        font-size: 1.125rem;
    }
}

/* Responsive Line Break Controls (Base/Desktop - Hidden by default) */
.mobile-only-break {
    display: none;
}

.tablet-only-break {
    display: none;
}

/* Enhanced Touch Targets for Mobile */
@media (hover: none) and (pointer: coarse) {
    .btn, .nav-link, .nav-link-mobile {
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    
    .card-features a,
    .footer-link-homepage {
        padding: 8px;
        margin: -8px;
    }
}

/* Mobile CTA Optimization - 44px Touch Targets */
/* ========================================
   RESPONSIVE BREAKPOINTS
   ======================================== */

/* MOBILE PHONES ONLY (max-width: 480px) */
@media (max-width: 480px) {
    /* Prevent horizontal scroll */
    html, body {
        overflow-x: hidden !important;
        max-width: 100vw !important;
    }

    /* Hero section - tight mobile spacing */
    .hero {
        padding: 40px 20px !important;
    }

    .hero-content {
        max-width: 100% !important;
        padding: 0 8px !important;
    }

    .container {
        padding-left: 20px !important;
        padding-right: 20px !important;
        max-width: 100% !important;
    }

    /* Hero headline - mobile phone size */
    .hero-headline {
        font-size: 1.85rem !important;
        line-height: 1.2 !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
        max-width: 100% !important;
        text-align: center !important;
        letter-spacing: -0.5px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding: 0 8px !important;
    }

    /* CTA buttons - full width on mobile */
    .btn-primary-clickhere-large {
        min-width: auto !important;
        max-width: 100% !important;
        width: 100% !important;
        padding: 16px 20px !important;
    }

    .clickhere-text-large {
        font-size: 1.3rem !important;
    }

    .cta-subtext-large {
        font-size: 1rem !important;
    }

    /* Touch-friendly buttons */
    .btn,
    .btn-primary-clickhere,
    .btn-primary-clickhere-large,
    .btn-emergency {
        min-height: 44px !important;
        min-width: 44px !important;
        padding: 12px 20px !important;
        font-size: 16px !important;
        line-height: 1.2 !important;
    }

    /* Show line break for "7-14 Days" on mobile only */
    .mobile-only-break {
        display: inline !important;
    }

    /* Hide tablet-specific line breaks on mobile */
    .tablet-only-break {
        display: none !important;
    }

    /* Fix "7-14 Days" container on mobile */
    .trust-subtitle {
        flex-direction: column !important;
        gap: 12px !important;
        padding: 16px !important;
        font-size: 0.95rem !important;
    }

    /* Stack Blueprint Process cards vertically */
    .process-steps {
        flex-direction: column !important;
        align-items: center !important;
        gap: 2rem !important;
        padding: 1rem !important;
    }

    .process-step {
        width: 100% !important;
        max-width: 400px !important;
    }

    /* Footer - single column centered */
    .footer-content {
        display: flex !important;
        flex-direction: column !important;
        gap: 32px !important;
        align-items: center !important;
        text-align: center !important;
    }

    .footer-links {
        display: flex !important;
        flex-direction: column !important;
        gap: 32px !important;
        width: 100% !important;
    }

    .footer-column {
        width: 100% !important;
        text-align: center !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }

    .footer-heading-homepage {
        text-align: center !important;
        width: 100% !important;
    }

    .footer-menu {
        text-align: center !important;
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }

    .footer-menu li {
        text-align: center !important;
        list-style: none !important;
    }

    /* Hide original footer trust signals */
    .footer-column .footer-trust-signals {
        display: none !important;
    }

    /* Add trust signals via CSS */
    .footer-content::after {
        content: "⚡ 48-Hour Email Responses\A🎯 FinTech & Wellness Expert\A✅ Blueprint Process Guaranteed\A📈 Conversion-Focused Results";
        white-space: pre-line;
        display: block !important;
        font-size: 14px;
        color: var(--slate-600);
        font-weight: 600;
        line-height: 2;
        padding: 20px 0;
        border-top: 1px solid var(--slate-200);
        margin-top: 20px;
    }

    /* Industry cards - ensure proper spacing on phone */
    .industry-card {
        max-width: 100% !important;
        margin: 0 auto !important;
    }

    .card-title {
        font-size: 1.5rem !important;
    }
}

/* TABLETS (481px to 1024px) */
@media (min-width: 481px) and (max-width: 1024px) {
    /* Prevent horizontal scroll */
    html, body {
        overflow-x: hidden !important;
        max-width: 100vw !important;
    }

    /* Hero section - more space than phone */
    .hero {
        padding: 48px 32px !important;
    }

    .hero-content {
        max-width: 100% !important;
        padding: 0 16px !important;
    }

    .container {
        padding-left: 32px !important;
        padding-right: 32px !important;
        max-width: 100% !important;
    }

    /* Hero headline - tablet size (larger than phone) */
    .hero-headline {
        font-size: 2.75rem !important;
        line-height: 1.2 !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
        max-width: 100% !important;
        text-align: center !important;
        padding: 0 16px !important;
    }

    /* CTA buttons - responsive but not full width */
    .btn-primary-clickhere-large {
        max-width: 90% !important;
        padding: 18px 32px !important;
    }

    .clickhere-text-large {
        font-size: 1.5rem !important;
    }

    .cta-subtext-large {
        font-size: 1.1rem !important;
    }

    /* Touch-friendly buttons */
    .btn,
    .btn-primary-clickhere,
    .btn-primary-clickhere-large,
    .btn-emergency {
        min-height: 44px !important;
        min-width: 44px !important;
    }

    /* Hide "7-14 Days" line break on tablet */
    .mobile-only-break {
        display: none !important;
    }

    /* Show tablet-specific line breaks */
    .tablet-only-break {
        display: inline !important;
    }

    /* Trust subtitle - keep horizontal on tablet */
    .trust-subtitle {
        flex-direction: row !important;
        gap: 24px !important;
        padding: 20px 32px !important;
        font-size: 1.2rem !important;
    }

    /* Blueprint Process cards - 2 columns or centered */
    .process-steps {
        flex-direction: row !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 2rem !important;
        padding: 2rem !important;
    }

    .process-step {
        width: calc(50% - 1rem) !important;
        min-width: 280px !important;
        max-width: 450px !important;
    }

    /* Footer - can stay 2-column on tablet if space allows */
    .footer-links {
        display: flex !important;
        flex-direction: row !important;
        justify-content: center !important;
        gap: 48px !important;
    }

    .footer-column {
        text-align: left !important;
        min-width: 200px !important;
    }

    /* Industry cards - ensure full visibility and alignment */
    .industry-card {
        max-width: 100% !important;
        padding: 32px !important;
        display: flex !important;
        flex-direction: column !important;
    }

    .card-header {
        min-height: 100px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        justify-content: flex-start !important;
        margin-bottom: 16px !important;
    }

    .card-icon {
        font-size: 2.5rem !important;
        margin-bottom: 16px !important;
        height: 60px !important;
        width: 60px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    .card-title {
        font-size: 1.8rem !important;
        text-align: left !important;
        line-height: 1.3 !important;
    }

    .card-description {
        margin-bottom: 24px !important;
    }

    .card-features {
        display: flex !important;
        flex-direction: column !important;
        gap: 12px !important;
    }

    .industry-grid {
        gap: 2.5rem !important;
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        align-items: start !important;
    }

    /* Center 3rd trust card on tablet (2 on top row, 1 centered below) */
    .trust-cards-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    .trust-cards-grid > div:nth-child(3) {
        grid-column: 1 / -1;
        max-width: 50%;
        margin: 0 auto;
    }
}

/* LEGACY: Keep this for any missed edge cases */
@media (max-width: 768px) {
    .btn,
    .btn-primary-clickhere,
    .btn-primary-clickhere-large,
    .btn-emergency {
        min-height: 44px !important;
        min-width: 44px !important;
        padding: 12px 20px !important;
        font-size: 16px !important;
        line-height: 1.2 !important;
    }

    .mobile-cta {
        min-height: 44px !important;
        padding: 12px 20px !important;
    }

    .nav-link,
    .nav-link-mobile {
        min-height: 44px !important;
        display: flex !important;
        align-items: center !important;
        padding: 8px 12px !important;
    }

    .footer-column .footer-menu {
        min-height: auto;
    }

    .footer-trust-item {
        min-height: 36px;
        padding: 6px 0;
        font-size: 13px;
    }

    .footer-trust-item .trust-icon {
        font-size: 20px;
        width: 28px;
    }

    /* Stack Blueprint Process cards vertically on mobile */
    .process-steps {
        flex-direction: column !important;
        align-items: center !important;
        gap: 2rem !important;
        padding: 1rem !important;
    }

    .process-step {
        width: 100% !important;
        max-width: 400px !important;
    }

    /* FOOTER: Single column with all 4 trust signals stacked vertically */
    .footer-content {
        display: flex !important;
        flex-direction: column !important;
        gap: 32px !important;
        align-items: center !important;
        text-align: center !important;
    }

    .footer-links {
        display: flex !important;
        flex-direction: column !important;
        gap: 32px !important;
        width: 100% !important;
    }

    .footer-column {
        width: 100% !important;
        text-align: center !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }

    .footer-heading-homepage {
        text-align: center !important;
        width: 100% !important;
    }

    .footer-menu {
        text-align: center !important;
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }

    .footer-menu li {
        text-align: center !important;
        list-style: none !important;
    }

    /* Hide the original footer-trust-signals in columns */
    .footer-column .footer-trust-signals {
        display: none !important;
    }

    /* Create single vertical stack of trust signals after all links */
    .footer-links::after {
        content: '';
        display: block !important;
        width: 100%;
    }

    /* Alternative: Add trust signals container after footer-links */
    .footer-content::after {
        content: "⚡ 48-Hour Email Responses\A🎯 FinTech & Wellness Expert\A✅ Blueprint Process Guaranteed\A📈 Conversion-Focused Results";
        white-space: pre-line;
        display: block !important;
        font-size: 14px;
        color: var(--slate-600);
        font-weight: 600;
        line-height: 2;
        padding: 20px 0;
        border-top: 1px solid var(--slate-200);
        margin-top: 20px;
    }
}

/* Enhanced specificity for footer links */
.footer-homepage .footer-link-homepage,
footer.footer-homepage .footer-link-homepage {
    color: var(--slate-800) !important;
    font-weight: 600 !important;
    text-decoration: underline !important;
    text-decoration-color: var(--slate-600) !important;
}

.footer-homepage .footer-link-homepage:hover,
footer.footer-homepage .footer-link-homepage:hover {
    color: var(--brand-blue) !important;
    text-decoration-color: var(--brand-blue) !important;
}

/* Footer Active Link Styles - Maximum Specificity */
.footer-homepage .footer-link-homepage.is-active,
footer.footer-homepage .footer-link-homepage.is-active,
.footer-homepage .footer-menu .footer-link-homepage.is-active,
footer.footer-homepage .footer-menu .footer-link-homepage.is-active {
    color: var(--brand-blue) !important;
    text-decoration-color: var(--brand-blue) !important;
    font-weight: 800 !important;
    text-decoration: underline !important;
    text-underline-offset: 2px !important;
}

.footer-homepage .footer-link-homepage.is-active:hover,
footer.footer-homepage .footer-link-homepage.is-active:hover,
.footer-homepage .footer-menu .footer-link-homepage.is-active:hover,
footer.footer-homepage .footer-menu .footer-link-homepage.is-active:hover {
    color: var(--brand-blue) !important;
    text-decoration-color: var(--brand-blue) !important;
    font-weight: 800 !important;
    text-decoration: underline !important;
    text-underline-offset: 2px !important;
}

/* ============================
   ICON COLOR CLASSES
   ============================ */
.icon-success { color: #00FF00; }
.text-green-600 { color: #059669; }
.icon-research { color: #2563eb; } 
.icon-communication { color: #059669; }
.icon-community { color: #7c3aed; }
.icon-security { color: #dc2626; }
.icon-performance { color: #dc2626; }
.icon-speed { color: #7c3aed; }

/* ============================
   WIZARD FORMS STYLING SYSTEM
   ============================ */

/* Base color palette for all forms */
:root {
    --warm-cream: #FAF7F0;
    --soft-warm-gray: #F5F3F0;
    --pure-warm-white: #FEFCF8;
    --rich-charcoal: #2D3436;
    --warm-dark-gray: #636E72;
    --soft-taupe: #C7B299;
    --error-warm: #E74C3C;
}

/* Theme-specific accent colors */
.theme-fintech {
    --accent-primary: #D4AF37;
    --accent-secondary: #7FB069;
}

.theme-wellness {
    --accent-primary: #7FB069;
    --accent-secondary: #D4AF37;
}

.theme-generic {
    --accent-primary: #7F8C8D;
    --accent-secondary: #95A5A6;
}

/* Form body styling for wizard pages */
body.wizard-form {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background: linear-gradient(135deg, var(--warm-cream) 0%, var(--soft-warm-gray) 100%);
    color: #000000;
    line-height: 1.6;
    min-height: 100vh;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Form container and layout styles */
.boutique-container {
    max-width: 900px;
    margin: 2rem auto;
    padding: 3rem 2rem;
}

.form-header {
    text-align: center;
    margin-bottom: 3rem;
    padding: 2.5rem;
    background: linear-gradient(135deg, var(--pure-warm-white) 0%, var(--warm-cream) 100%);
    border-radius: 16px;
    box-shadow: 0 8px 32px rgba(45, 52, 54, 0.1);
    border: 1px solid var(--soft-taupe);
}

.logo-section {
    margin-bottom: 2rem;
}

.logo-section h1 {
    color: #000000;
    font-size: 2.2rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.logo-section .tagline {
    color: #000000;
    font-size: 1rem;
    font-weight: normal;
}

.form-title {
    color: #000000;
    font-size: 2rem;
    margin-bottom: 1rem;
    font-weight: 600;
}

.form-subtitle {
    color: #000000;
    font-size: 1.1rem;
    margin-bottom: 1.5rem;
    font-weight: normal;
}

.deadline-notice {
    background: linear-gradient(135deg, var(--pure-warm-white) 0%, var(--warm-cream) 100%);
    border: 2px solid var(--accent-primary);
    border-radius: 12px;
    padding: 1.5rem;
    margin-bottom: 3rem;
    text-align: center;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.deadline-notice strong {
    color: #000000;
    font-size: 1.1rem;
    font-weight: 700;
}

.progress-container {
    margin-bottom: 3rem;
}

.progress-bar {
    background: var(--soft-warm-gray);
    height: 12px;
    border-radius: 6px;
    overflow: hidden;
    margin-bottom: 1rem;
    box-shadow: inset 0 2px 4px rgba(45, 52, 54, 0.1);
}

.progress-fill {
    background: linear-gradient(90deg, var(--accent-primary) 0%, var(--accent-secondary) 100%);
    height: 100%;
    transition: width 0.3s ease;
    border-radius: 6px;
}

.progress-text {
    text-align: center;
    color: #000000;
    font-weight: 600;
    font-size: 1rem;
}

.wizard-step {
    display: none;
    background: linear-gradient(135deg, var(--pure-warm-white) 0%, var(--warm-cream) 100%);
    border-radius: 16px;
    padding: 3rem;
    box-shadow: 0 8px 32px rgba(45, 52, 54, 0.1);
    border: 1px solid var(--soft-taupe);
    margin-bottom: 2rem;
}

.wizard-step.active {
    display: block;
    animation: fadeInUp 0.5s ease;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.step-header {
    margin-bottom: 1.5rem;
    padding-bottom: 1rem;
    border-bottom: 2px solid var(--soft-warm-gray);
}

.step-number {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    background: #2563eb;
    color: white;
    font-size: 1.2rem;
    font-weight: 700;
    border-radius: 50%;
    margin-bottom: 1rem;
    box-shadow: 0 2px 8px rgba(37, 99, 235, 0.2);
}

.step-title {
    color: #000000;
    font-size: 1.8rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.step-description {
    color: #000000;
    font-size: 1.1rem;
    line-height: 1.7;
    font-weight: normal;
}

.form-group {
    margin-bottom: 2rem;
}

.form-label {
    display: block;
    color: #000000;
    font-weight: 600;
    margin-bottom: 0.8rem;
    font-size: 1.1rem;
}

.form-input,
.form-select,
.form-textarea {
    width: 100%;
    padding: 1rem 1.2rem;
    border: 2px solid var(--soft-taupe);
    border-radius: 8px;
    font-size: 1rem;
    background: var(--pure-warm-white);
    color: #000000;
    transition: all 0.3s ease;
}

.form-input:focus,
.form-select:focus,
.form-textarea:focus {
    outline: none;
    border-color: var(--accent-primary);
    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.2);
}

.form-textarea {
    min-height: 120px;
    resize: vertical;
}

.checkbox-group {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: 1rem;
    margin-top: 1rem;
}

.checkbox-item {
    display: flex;
    align-items: center;
    padding: 1rem;
    background: var(--soft-warm-gray);
    border-radius: 8px;
    border: 2px solid transparent;
    transition: all 0.3s ease;
    cursor: pointer;
}

.checkbox-item:hover {
    background: var(--pure-warm-white);
    border-color: var(--accent-primary);
}

.checkbox-item input[type="checkbox"] {
    margin-right: 0.8rem;
    width: 18px;
    height: 18px;
    accent-color: var(--accent-primary);
}

.checkbox-item label {
    color: #000000;
    font-weight: 500;
    cursor: pointer;
    font-size: 0.95rem;
}

.radio-group {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    gap: 1rem;
    margin-top: 1rem;
}

.radio-item {
    display: flex;
    align-items: center;
    padding: 1rem;
    background: var(--soft-warm-gray);
    border-radius: 8px;
    border: 2px solid transparent;
    transition: all 0.3s ease;
    cursor: pointer;
}

.radio-item:hover {
    background: var(--pure-warm-white);
    border-color: var(--accent-primary);
}

.radio-item input[type="radio"] {
    margin-right: 0.8rem;
    width: 18px;
    height: 18px;
    accent-color: var(--accent-primary);
}

.radio-item label {
    color: #000000;
    font-weight: 500;
    cursor: pointer;
    font-size: 0.95rem;
}

.button-group {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 3rem;
    padding-top: 2rem;
    border-top: 2px solid var(--soft-warm-gray);
}

.btn {
    padding: 12px 24px !important;
    border: 2px solid #000000 !important;
    border-radius: 8px;
    font-size: 16px !important;
    font-weight: 600 !important;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 120px;
}

.btn-primary {
    background: linear-gradient(135deg, #0066FF 0%, #0052CC 100%) !important;
    color: #ffffff !important;
    border: 2px solid #000000 !important;
    font-weight: 600 !important;
    padding: 12px 24px !important;
    font-size: 16px !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    text-shadow: 0 1px 2px rgba(0,0,0,0.4);
}

.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.3);
    background: linear-gradient(135deg, #0052CC 0%, #003D99 100%) !important;
}

.btn-secondary {
    background: #ffffff !important;
    color: #1e293b !important;
    border: 2px solid #000000 !important;
    font-weight: 600 !important;
    padding: 12px 24px !important;
    font-size: 16px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.btn-secondary:hover {
    background: #f8fafc !important;
    border-color: #000000 !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.btn:disabled {
    opacity: 0.85 !important;
    cursor: not-allowed !important;
    transform: none !important;
    background: #f1f5f9 !important;
    color: #334155 !important;
    border: 2px solid #94a3b8 !important;
}

.help-text {
    font-size: 0.9rem;
    color: #2c3e50;
    margin-top: 0.5rem;
    font-style: italic;
}

.wordsmith-voice {
    background: linear-gradient(135deg, var(--pure-warm-white) 0%, var(--soft-warm-gray) 100%);
    border-left: 4px solid var(--accent-primary);
    border-right: 4px solid var(--accent-primary);
    padding: 1.5rem;
    border-radius: 8px;
    margin: 1.5rem 0;
}

.wordsmith-voice p {
    color: #000000;
    font-style: italic;
    margin-bottom: 0.5rem;
}

.required {
    color: var(--error-warm);
}

/* Mobile responsive optimization for wizard forms */
@media (max-width: 768px) {
    .boutique-container {
        padding: 1rem;
    }
    
    .form-header {
        padding: 2rem 1.5rem;
    }
    
    .wizard-step {
        padding: 2rem 1.5rem;
    }
    
    .checkbox-group,
    .radio-group {
        grid-template-columns: 1fr;
    }
    
    .button-group {
        flex-direction: column;
    }
    
    .form-title {
        font-size: 1.8rem;
    }
    
    .logo-section h1 {
        font-size: 2rem;
    }
}

/* ============================
   END OF STYLESHEET
   ============================*/

/* Service/Feature List Styles (for accordions) */
.service-feature-list {
    list-style: none;
    padding-left: 0;
    margin: 20px 0;
}

.service-feature-item {
    padding: 8px 0;
    position: relative;
    padding-left: 25px;
    font-size: 1rem;
    color: var(--slate-600);
}

.service-feature-item strong {
    color: var(--slate-800);
}

.service-feature-icon {
    position: absolute;
    left: 0;
    color: #27ae60;
    font-weight: bold;
}

/* ============================
   ACCORDION STYLES (for solutions.html)
   ============================ */
.accordion-container {
    max-width: 800px;
    margin: 0 auto;
}

.accordion-item {
    border-bottom: 1px solid var(--slate-200);
}

.accordion-button {
    width: 100%;
    background: none;
    border: none;
    padding: 20px;
    text-align: left;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--slate-800);
    transition: background-color 0.2s ease;
}

.accordion-button:hover {
    background-color: var(--slate-50);
}

.accordion-icon {
    font-size: 1.5rem;
    transition: transform 0.3s ease;
}

.accordion-item.active .accordion-icon {
    transform: rotate(45deg);
}

.accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out;
    padding: 0 20px;
}

.accordion-content p {
    margin-bottom: 16px;
}

.accordion-item.active .accordion-content {
    padding-bottom: 20px;
}

/* Force clean 3-line hero title */
.hero-line,
.hero-line-blue {
    display: block;
    line-height: 1.15;   /* tighter, keeps each phrase separate */
    margin: 0;
    padding: 0;
    letter-spacing: 0;   /* reset so text doesn't collide */
}

/* White for first two lines */
.hero-line {
    color: #ffffff !important;
}

/* High-contrast blue for third line */
.hero-line-blue {
    color: #007BFF !important;  /* brighter than --brand-blue */
    font-weight: 800;           /* make it stand out */
    text-shadow: 0 2px 4px rgba(0,0,0,0.25); /* improves readability on gradient */
}

/* Countdown timer styling - consistent across all pages */
#countdown-timer {
    font-size: 1.2rem;   /* increase size */
    color: #000000;      /* true black */
    font-weight: 500;    /* slightly bolder for darker appearance */
}



