/* =============================================
   MASTER CUSTOM CSS - ReliableAutoQuotes.com
   
   HOW TO SWITCH THEMES:
   1. Find the theme you want below (Theme 1 to Theme 15)
   2. Delete the /* on the line BEFORE :root {
   3. Delete the */ on the line AFTER the closing }
   4. Make sure ALL other themes stay commented out
   5. Save and refresh your site!
============================================= */


/* =============================================
   ACTIVE THEME — UNCOMMENT ONLY ONE
   ============================================= */


/* --- THEME 1: OCEAN BLUE & GREEN (Default) --- */
/*:root {*/
/*    --c-primary: #0A2647;*/
/*    --c-primary-light: #144272;*/
/*    --c-accent: #2C74B3;*/
/*    --c-accent-light: #205295;*/
/*    --c-accent-dark: #1E5090;*/
/*    --c-highlight: #00C48C;*/
/*    --c-highlight-dark: #00A676;*/
/*    --c-bg: #F8FAFC;*/
/*    --c-bg-dark: #0A2647;*/
/*    --c-white: #FFFFFF;*/
/*    --c-text: #1E293B;*/
/*    --c-text-light: #64748B;*/
/*    --c-gray-100: #F1F5F9;*/
/*    --c-gray-200: #E2E8F0;*/
/*    --c-gray-300: #CBD5E1;*/
/*    --c-gray-400: #94A3B8;*/
/*    --c-gray-500: #64748B;*/
/*    --c-gray-600: #475569;*/
/*}*/


/* --- THEME 2: EMERALD & GOLD --- */

:root {
    --c-primary: #064E3B;
    --c-primary-light: #065F46;
    --c-accent: #D97706;
    --c-accent-light: #F59E0B;
    --c-accent-dark: #B45309;
    --c-highlight: #10B981;
    --c-highlight-dark: #059669;
    --c-bg: #F0FDF4;
    --c-bg-dark: #064E3B;
    --c-white: #FFFFFF;
    --c-text: #1E293B;
    --c-text-light: #4B5563;
    --c-gray-100: #ECFDF5;
    --c-gray-200: #D1FAE5;
    --c-gray-300: #A7F3D0;
    --c-gray-400: #6EE7B7;
    --c-gray-500: #34D399;
    --c-gray-600: #10B981;
}



/* --- THEME 3: SUNSET ORANGE --- */
/*
:root {
    --c-primary: #1E293B;
    --c-primary-light: #334155;
    --c-accent: #EA580C;
    --c-accent-light: #F97316;
    --c-accent-dark: #C2410C;
    --c-highlight: #FBBF24;
    --c-highlight-dark: #D97706;
    --c-bg: #FFF7ED;
    --c-bg-dark: #1E293B;
    --c-white: #FFFFFF;
    --c-text: #1C1917;
    --c-text-light: #57534E;
    --c-gray-100: #FFF7ED;
    --c-gray-200: #FFEDD5;
    --c-gray-300: #FED7AA;
    --c-gray-400: #FDBA74;
    --c-gray-500: #FB923C;
    --c-gray-600: #F97316;
}
*/


/* --- THEME 4: ROYAL PURPLE --- */
/*
:root {
    --c-primary: #2E1065;
    --c-primary-light: #4C1D95;
    --c-accent: #7C3AED;
    --c-accent-light: #8B5CF6;
    --c-accent-dark: #6D28D9;
    --c-highlight: #EC4899;
    --c-highlight-dark: #DB2777;
    --c-bg: #FAF5FF;
    --c-bg-dark: #2E1065;
    --c-white: #FFFFFF;
    --c-text: #1E1B4B;
    --c-text-light: #6B7280;
    --c-gray-100: #F5F3FF;
    --c-gray-200: #EDE9FE;
    --c-gray-300: #DDD6FE;
    --c-gray-400: #C4B5FD;
    --c-gray-500: #A78BFA;
    --c-gray-600: #8B5CF6;
}
*/


/* --- THEME 5: MINTY FRESH --- */
/*
:root {
    --c-primary: #134E4A;
    --c-primary-light: #115E59;
    --c-accent: #0D9488;
    --c-accent-light: #14B8A6;
    --c-accent-dark: #0F766E;
    --c-highlight: #2DD4BF;
    --c-highlight-dark: #14B8A6;
    --c-bg: #F0FDFA;
    --c-bg-dark: #134E4A;
    --c-white: #FFFFFF;
    --c-text: #042f2e;
    --c-text-light: #475569;
    --c-gray-100: #F0FDFA;
    --c-gray-200: #CCFBF1;
    --c-gray-300: #99F6E4;
    --c-gray-400: #5EEAD4;
    --c-gray-500: #2DD4BF;
    --c-gray-600: #14B8A6;
}
*/


/* --- THEME 6: CRIMSON FIRE --- */
/*
:root {
    --c-primary: #1C1917;
    --c-primary-light: #292524;
    --c-accent: #DC2626;
    --c-accent-light: #EF4444;
    --c-accent-dark: #B91C1C;
    --c-highlight: #FCA5A5;
    --c-highlight-dark: #F87171;
    --c-bg: #FEF2F2;
    --c-bg-dark: #1C1917;
    --c-white: #FFFFFF;
    --c-text: #1C1917;
    --c-text-light: #57534E;
    --c-gray-100: #FEF2F2;
    --c-gray-200: #FECACA;
    --c-gray-300: #FCA5A5;
    --c-gray-400: #F87171;
    --c-gray-500: #EF4444;
    --c-gray-600: #DC2626;
}
*/


/* --- THEME 7: CYBERPUNK (Dark Mode) --- */
/*
:root {
    --c-primary: #000000;
    --c-primary-light: #18181B;
    --c-accent: #F43F5E;
    --c-accent-light: #FB7185;
    --c-accent-dark: #E11D48;
    --c-highlight: #22D3EE;
    --c-highlight-dark: #06B6D4;
    --c-bg: #09090B;
    --c-bg-dark: #000000;
    --c-white: #18181B;
    --c-text: #FAFAFA;
    --c-text-light: #A1A1AA;
    --c-gray-100: #27272A;
    --c-gray-200: #3F3F46;
    --c-gray-300: #52525B;
    --c-gray-400: #71717A;
    --c-gray-500: #A1A1AA;
    --c-gray-600: #D4D4D8;
}
*/


/* --- THEME 8: EARTHY TONES --- */
/*
:root {
    --c-primary: #44403C;
    --c-primary-light: #57534E;
    --c-accent: #B45309;
    --c-accent-light: #D97706;
    --c-accent-dark: #92400E;
    --c-highlight: #4D7C0F;
    --c-highlight-dark: #3F6212;
    --c-bg: #FFFBEB;
    --c-bg-dark: #44403C;
    --c-white: #FFFFFF;
    --c-text: #292524;
    --c-text-light: #78716C;
    --c-gray-100: #FEF3C7;
    --c-gray-200: #FDE68A;
    --c-gray-300: #FCD34D;
    --c-gray-400: #FBBF24;
    --c-gray-500: #F59E0B;
    --c-gray-600: #D97706;
}
*/


/* --- THEME 9: ARCTIC FROST --- */
/*
:root {
    --c-primary: #0F172A;
    --c-primary-light: #1E293B;
    --c-accent: #0284C7;
    --c-accent-light: #0EA5E9;
    --c-accent-dark: #0369A1;
    --c-highlight: #38BDF8;
    --c-highlight-dark: #0EA5E9;
    --c-bg: #F0F9FF;
    --c-bg-dark: #0F172A;
    --c-white: #FFFFFF;
    --c-text: #0C4A6E;
    --c-text-light: #64748B;
    --c-gray-100: #E0F2FE;
    --c-gray-200: #BAE6FD;
    --c-gray-300: #7DD3FC;
    --c-gray-400: #38BDF8;
    --c-gray-500: #0EA5E9;
    --c-gray-600: #0284C7;
}
*/


/* --- THEME 10: MINIMALIST MONOCHROME --- */
/*
:root {
    --c-primary: #111827;
    --c-primary-light: #1F2937;
    --c-accent: #374151;
    --c-accent-light: #4B5563;
    --c-accent-dark: #1F2937;
    --c-highlight: #111827;
    --c-highlight-dark: #000000;
    --c-bg: #F9FAFB;
    --c-bg-dark: #111827;
    --c-white: #FFFFFF;
    --c-text: #111827;
    --c-text-light: #6B7280;
    --c-gray-100: #F3F4F6;
    --c-gray-200: #E5E7EB;
    --c-gray-300: #D1D5DB;
    --c-gray-400: #9CA3AF;
    --c-gray-500: #6B7280;
    --c-gray-600: #4B5563;
}
*/


/* --- THEME 11: TROPICAL PARADISE --- */
/*
:root {
    --c-primary: #0F766E;
    --c-primary-light: #14B8A6;
    --c-accent: #F43F5E;
    --c-accent-light: #FB7185;
    --c-accent-dark: #E11D48;
    --c-highlight: #FBBF24;
    --c-highlight-dark: #F59E0B;
    --c-bg: #F0FDFA;
    --c-bg-dark: #0F766E;
    --c-white: #FFFFFF;
    --c-text: #134E4A;
    --c-text-light: #57534E;
    --c-gray-100: #CCFBF1;
    --c-gray-200: #99F6E4;
    --c-gray-300: #5EEAD4;
    --c-gray-400: #2DD4BF;
    --c-gray-500: #14B8A6;
    --c-gray-600: #0D9488;
}
*/


/* --- THEME 12: RUBY & SLATE --- */
/*
:root {
    --c-primary: #1E293B;
    --c-primary-light: #334155;
    --c-accent: #9F1239;
    --c-accent-light: #BE123C;
    --c-accent-dark: #881337;
    --c-highlight: #FDA4AF;
    --c-highlight-dark: #FB7185;
    --c-bg: #FFF1F2;
    --c-bg-dark: #1E293B;
    --c-white: #FFFFFF;
    --c-text: #1E293B;
    --c-text-light: #64748B;
    --c-gray-100: #FFE4E6;
    --c-gray-200: #FECDD3;
    --c-gray-300: #FDA4AF;
    --c-gray-400: #FB7185;
    --c-gray-500: #F43F5E;
    --c-gray-600: #E11D48;
}
*/


/* --- THEME 13: FOREST & SKY --- */
/*
:root {
    --c-primary: #1A2E05;
    --c-primary-light: #365314;
    --c-accent: #CA8A04;
    --c-accent-light: #EAB308;
    --c-accent-dark: #A16207;
    --c-highlight: #65A30D;
    --c-highlight-dark: #4D7C0F;
    --c-bg: #F7FEE7;
    --c-bg-dark: #1A2E05;
    --c-white: #FFFFFF;
    --c-text: #1A2E05;
    --c-text-light: #4D7C0F;
    --c-gray-100: #ECFCCB;
    --c-gray-200: #D9F99D;
    --c-gray-300: #BEF264;
    --c-gray-400: #A3E635;
    --c-gray-500: #84CC16;
    --c-gray-600: #65A30D;
}
*/


/* --- THEME 14: LAVENDER DREAMS --- */
/*
:root {
    --c-primary: #312E81;
    --c-primary-light: #3730A3;
    --c-accent: #7C3AED;
    --c-accent-light: #8B5CF6;
    --c-accent-dark: #6D28D9;
    --c-highlight: #F9A8D4;
    --c-highlight-dark: #F472B6;
    --c-bg: #FAF5FF;
    --c-bg-dark: #312E81;
    --c-white: #FFFFFF;
    --c-text: #1E1B4B;
    --c-text-light: #6B7280;
    --c-gray-100: #F5F3FF;
    --c-gray-200: #EDE9FE;
    --c-gray-300: #DDD6FE;
    --c-gray-400: #C4B5FD;
    --c-gray-500: #A78BFA;
    --c-gray-600: #8B5CF6;
}
*/


/* --- THEME 15: GOLDEN HOUR --- */
/*
:root {
    --c-primary: #1C1917;
    --c-primary-light: #292524;
    --c-accent: #D97706;
    --c-accent-light: #F59E0B;
    --c-accent-dark: #B45309;
    --c-highlight: #EAB308;
    --c-highlight-dark: #CA8A04;
    --c-bg: #FFFBEB;
    --c-bg-dark: #1C1917;
    --c-white: #FFFFFF;
    --c-text: #1C1917;
    --c-text-light: #57534E;
    --c-gray-100: #FEF3C7;
    --c-gray-200: #FDE68A;
    --c-gray-300: #FCD34D;
    --c-gray-400: #FBBF24;
    --c-gray-500: #F59E0B;
    --c-gray-600: #D97706;
}
*/



/* =============================================
   GLOBAL STYLE TOGGLES
   ============================================= */

/* --- UNCOMMENT FOR ROUNDED CORNERS EVERYWHERE --- */
/*
input, select, button, .formpanel, .quote-card, .coverage-card, .stat-card, .info-card, .sidebar-card, .edit-card {
    border-radius: 24px !important;
}
*/

/* --- UNCOMMENT FOR LARGER TEXT SITE-WIDE --- */
/*
body {
    font-size: 18px !important;
}
h1 { font-size: clamp(2.5rem, 6vw, 5rem) !important; }
h2 { font-size: clamp(1.8rem, 4vw, 3rem) !important; }
*/

/* --- UNCOMMENT FOR SHADOW DEPTH MODE --- */
/*
.formpanel, .stat-card, .quote-card, .info-card, .coverage-card {
    box-shadow: 0 20px 40px rgba(0,0,0,0.15) !important;
    border: none !important;
}
*/


/* =============================================
   INFO PAGE SPECIFIC STYLES
   ============================================= */

.info-page {
    padding-top: 60px;
}

.info-hero {
    background: linear-gradient(135deg, var(--c-primary, #0A2647) 0%, var(--c-primary-light, #144272) 50%, var(--c-accent-dark, #1E5090) 100%);
    padding: 30px 0 60px;
    text-align: center;
    color: white;
    position: relative;
    overflow: hidden;
}

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

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

.info-hero .container {
    position: relative;
    z-index: 2;
    max-width: 900px;
}

.info-hero__icon {
    font-size: 56px;
    margin-bottom: 20px;
    display: block;
}

.info-hero h1 {
    font-family: var(--f-display, 'Space Grotesk', sans-serif);
    font-size: 44px;
    font-weight: 900;
    margin-bottom: 16px;
    letter-spacing: -0.03em;
    line-height: 1.15;
}

.info-hero p {
    font-size: 20px;
    opacity: 0.85;
    max-width: 700px;
    margin: 0 auto;
    line-height: 1.6;
}

.info-breadcrumb {
    background: var(--c-white, #FFFFFF);
    border-bottom: 1px solid var(--c-gray-200, #E2E8F0);
    padding: 14px 0;
}

.info-breadcrumb .container {
    max-width: 1280px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: var(--c-gray-400, #94A3B8);
}

.info-breadcrumb a {
    color: var(--c-accent, #2C74B3);
    font-weight: 500;
    text-decoration: none;
}

.info-breadcrumb a:hover { text-decoration: underline; }
.info-breadcrumb span { color: var(--c-gray-300, #CBD5E1); }

.info-layout {
    max-width: 1280px;
    margin: 0 auto;
    padding: 48px 24px;
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 40px;
    align-items: start;
}

.info-layout--full {
    grid-template-columns: 1fr;
    max-width: 960px;
}

.info-main { min-width: 0; }

.info-card {
    background: var(--c-white, #FFFFFF);
    border-radius: 20px;
    padding: 40px 44px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 4px 12px rgba(0,0,0,0.03);
    border: 1px solid var(--c-gray-200, #E2E8F0);
    margin-bottom: 28px;
}

.info-card h2 {
    font-family: var(--f-display, 'Space Grotesk', sans-serif);
    font-size: 26px;
    font-weight: 800;
    color: var(--c-primary, #0A2647);
    margin: 36px 0 18px;
    display: flex;
    align-items: center;
    gap: 12px;
    line-height: 1.3;
}

.info-card h2:first-child { margin-top: 0; }
.info-card h2 .h2-icon { font-size: 30px; flex-shrink: 0; }

.info-card p {
    font-size: 16px;
    line-height: 1.8;
    color: var(--c-gray-600, #475569);
    margin-bottom: 20px;
}

.info-card ul, .info-card ol { padding-left: 24px; margin-bottom: 20px; }

.info-card li {
    font-size: 15px;
    line-height: 1.8;
    color: var(--c-gray-600, #475569);
    margin-bottom: 10px;
}

.info-card li strong { color: var(--c-primary, #0A2647); }

.info-card a {
    color: var(--c-accent, #2C74B3);
    font-weight: 500;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.info-card a:hover { text-decoration-color: var(--c-accent, #2C74B3); }

.grid-card-section { margin-top: 32px; }

.grid-card-section h3 {
    font-family: var(--f-display, 'Space Grotesk', sans-serif);
    font-size: 20px;
    font-weight: 700;
    color: var(--c-primary, #0A2647);
    margin-bottom: 20px;
}

.grid-cards {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 10px;
}

.grid-card-item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px 12px;
    background: var(--c-white, #FFFFFF);
    border: 1.5px solid var(--c-gray-200, #E2E8F0);
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    color: var(--c-primary, #0A2647);
    text-decoration: none;
    transition: all 0.2s ease;
    text-align: center;
    gap: 2px;
}

.grid-card-item:hover {
    background: var(--c-accent, #2C74B3);
    color: white;
    border-color: var(--c-accent, #2C74B3);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(44,116,179,0.3);
}

.grid-card-item:hover small { color: rgba(255,255,255,0.85) !important; }
.grid-card-item strong { color: var(--c-accent, #2C74B3); font-family: var(--f-display, sans-serif); }
.grid-card-item:hover strong { color: white; }

.feature-box {
    background: linear-gradient(135deg, rgba(44,116,179,0.06), rgba(0,196,140,0.04));
    border: 1.5px solid rgba(44,116,179,0.15);
    border-radius: 16px;
    padding: 24px 28px;
    margin: 24px 0;
}

.feature-box h4 {
    font-family: var(--f-display, sans-serif);
    font-size: 17px;
    font-weight: 700;
    color: var(--c-accent, #2C74B3);
    margin-bottom: 8px;
}

.feature-box p { font-size: 14px; margin-bottom: 0; }

.info-sidebar {
    position: sticky;
    top: 90px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.sb-card {
    background: var(--c-white, #FFFFFF);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04), 0 4px 12px rgba(0,0,0,0.03);
    border: 1px solid var(--c-gray-200, #E2E8F0);
}

.sb-card__header {
    background: linear-gradient(135deg, var(--c-primary, #0A2647), var(--c-primary-light, #144272));
    color: white;
    padding: 20px 24px;
    font-family: var(--f-display, sans-serif);
    font-size: 16px;
    font-weight: 700;
}

.sb-card__body { padding: 20px 24px; }
.sb-card__body ul { list-style: none; padding: 0; margin: 0; }
.sb-card__body li { margin-bottom: 0; border-bottom: 1px solid var(--c-gray-100, #F1F5F9); }
.sb-card__body li:last-child { border-bottom: none; }

.sb-card__body a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 0;
    color: var(--c-gray-600, #475569);
    font-weight: 500;
    font-size: 14px;
    text-decoration: none;
    transition: all 0.15s ease;
}

.sb-card__body a i { color: var(--c-accent, #2C74B3); width: 16px; text-align: center; }
.sb-card__body a:hover { color: var(--c-accent, #2C74B3); padding-left: 6px; }

.sb-cta {
    background: linear-gradient(135deg, var(--c-accent, #2C74B3), var(--c-accent-dark, #1E5090));
    border-radius: 20px;
    padding: 28px 24px;
    text-align: center;
    color: white;
    box-shadow: 0 8px 24px rgba(44,116,179,0.3);
}

.sb-cta__icon { font-size: 40px; margin-bottom: 12px; display: block; }
.sb-cta h3 { font-family: var(--f-display, sans-serif); font-size: 20px; font-weight: 800; margin-bottom: 8px; }
.sb-cta p { font-size: 14px; opacity: 0.85; margin-bottom: 20px; }

.sb-cta a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: white;
    color: var(--c-accent-dark, #1E5090);
    padding: 12px 28px;
    border-radius: 12px;
    font-weight: 700;
    font-size: 15px;
    text-decoration: none;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
}

.sb-cta a:hover { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,0.2); }

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

.sitemap-col h3 {
    font-family: var(--f-display, sans-serif);
    font-size: 18px;
    font-weight: 700;
    color: var(--c-accent, #2C74B3);
    margin-bottom: 16px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--c-gray-200, #E2E8F0);
}

.sitemap-col ul { list-style: none; padding: 0; }
.sitemap-col li { margin-bottom: 6px; }

.sitemap-col a {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border-radius: 8px;
    color: var(--c-gray-600, #475569);
    font-weight: 500;
    font-size: 15px;
    text-decoration: none;
}

.sitemap-col a:hover { background: #EFF6FF; color: #1E5090; }
.sitemap-col a i { font-size: 12px; color: var(--c-accent, #2C74B3); }

.legal-content h2 { font-size: 22px; margin-top: 40px; padding-top: 24px; border-top: 1px solid var(--c-gray-200, #E2E8F0); }
.legal-content h2:first-child { margin-top: 0; padding-top: 0; border-top: none; }

@media (max-width: 1024px) {
    .info-layout { grid-template-columns: 1fr; }
    .info-sidebar { position: static; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
    .sitemap-grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 640px) {
    .info-hero h1 { font-size: 30px; }
    .info-hero p { font-size: 16px; }
    .info-card { padding: 24px 20px; }
    .info-sidebar { grid-template-columns: 1fr; }
    .grid-cards { grid-template-columns: repeat(3, 1fr); }
    .sitemap-grid { grid-template-columns: 1fr; }
}

/* =============================================
   TCPA DISCLOSURE STYLES
   ============================================= */

.tcpa-disclosure {
    margin: 20px 0;
    padding: 16px 20px;
    background: #F8FAFC;
    border: 1px solid #E2E8F0;
    border-radius: 12px;
}

.tcpa-disclosure label {
    /*display: flex;*/
    align-items: flex-start;
    gap: 10px;
    cursor: pointer;
    font-size: 12px;
    line-height: 1.6;
    color: #64748B;
}

.tcpa-disclosure input[type="checkbox"] {
    margin-top: 3px;
    accent-color: #D97706;
    width: 16px;
    height: 16px;
    min-width: 16px;
    flex-shrink: 0;
    cursor: pointer;
}

.tcpa-disclosure a {
    color: #D97706;
    text-decoration: underline;
    font-weight: 500;
}

.tcpa-disclosure a:hover {
    color: #B45309;
}

.tcpa-disclosure strong {
    color: #064E3B;
}

@media (max-width: 768px) {
    .tcpa-disclosure {
        padding: 12px 14px;
    }
    .tcpa-disclosure label {
        font-size: 11px;
        line-height: 1.5;
    }
}

/* =============================================
   HAND-DRAWN SKETCH ICONS (site-wide)
   Applies a subtle "roughen" SVG filter to every
   Font Awesome icon so they read as hand-sketched.
   No markup changes required.
   ============================================= */
.fa,
.fas,
.far,
.fal,
.fab,
.fa-solid,
.fa-regular,
.fa-light,
.fa-brands,
i[class^="fa-"],
i[class*=" fa-"],
[class^="fa-"]::before,
[class*=" fa-"]::before {
    filter: url(#sketch-icons) !important;
    -webkit-filter: url(#sketch-icons) !important;
}

/* Slightly thicken icons so the sketchy edges stay crisp */
.fa,
.fas,
.far,
.fal,
.fab,
.fa-solid,
.fa-regular,
.fa-light,
.fa-brands,
i[class^="fa-"],
i[class*=" fa-"] {
    -webkit-text-stroke: 0.2px currentColor;
}

@media print {
    .fa, .fas, .far, .fal, .fab,
    .fa-solid, .fa-regular, .fa-light, .fa-brands,
    i[class^="fa-"], i[class*=" fa-"] {
        filter: none;
        -webkit-filter: none;
    }
}

/* =============================================
   FOOTER v2 — reference-style layout in the
   active theme color scheme (uses theme vars)
   ============================================= */
.site-footer.footer-v2 {
    background: var(--c-white, #fff);
    color: var(--c-text, #1E293B);
    padding-top: 0;
    border-top: 3px solid var(--c-primary, #064E3B);
}

/* --- Band 1: Commitment + Trust + ZIP --- */
.footer-v2 .fv-commit {
    background: var(--c-white, #fff);
    padding: 56px 0 48px;
}
.footer-v2 .fv-commit__inner {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 48px;
    align-items: center;
}
.footer-v2 .fv-commit__title {
    font-family: var(--f-display, sans-serif);
    font-size: 26px;
    font-weight: 800;
    color: var(--c-primary, #064E3B);
    margin: 0 0 14px;
}
.footer-v2 .fv-commit__text {
    font-size: 15px;
    line-height: 1.7;
    color: var(--c-text-light, #4B5563);
    max-width: 520px;
    margin: 0 0 26px;
}

/* ZIP CTA */
.footer-v2 .fv-zip__label {
    display: block;
    font-family: var(--f-display, sans-serif);
    font-weight: 700;
    font-size: 15px;
    color: var(--c-primary, #064E3B);
    margin-bottom: 10px;
}
.footer-v2 .fv-zip__wrap {
    display: flex;
    align-items: stretch;
    max-width: 420px;
    background: var(--c-white, #fff);
    border: 2px solid var(--c-gray-200, #D1FAE5);
    border-radius: var(--radius-full, 9999px);
    box-shadow: var(--shadow-md, 0 4px 6px rgba(0,0,0,.1));
    overflow: hidden;
}
.footer-v2 .fv-zip__icon {
    display: flex;
    align-items: center;
    padding: 0 6px 0 18px;
    color: var(--c-accent, #D97706);
    font-size: 18px;
}
.footer-v2 .fv-zip__input {
    flex: 1;
    border: 0;
    outline: 0;
    background: transparent;
    padding: 14px 12px;
    font-size: 16px;
    font-family: var(--f-primary, sans-serif);
    color: var(--c-text, #1E293B);
    min-width: 0;
}
.footer-v2 .fv-zip__input::placeholder { color: var(--c-gray-400, #6EE7B7); }
.footer-v2 .fv-zip__btn {
    border: 0;
    cursor: pointer;
    padding: 0 26px;
    font-family: var(--f-display, sans-serif);
    font-weight: 700;
    font-size: 15px;
    color: #fff;
    background: var(--c-highlight, #10B981);
    transition: var(--transition, all .3s ease);
}
.footer-v2 .fv-zip__btn:hover {
    background: var(--c-highlight-dark, #059669);
}

/* Trust rows */
.footer-v2 .fv-commit__right {
    display: flex;
    flex-direction: column;
    gap: 22px;
}
.footer-v2 .fv-trust {
    display: flex;
    align-items: center;
    gap: 16px;
}
.footer-v2 .fv-trust__icon {
    font-size: 34px;
    line-height: 1;
    color: var(--c-primary, #064E3B);
    flex-shrink: 0;
}
.footer-v2 .fv-trust__text {
    font-family: var(--f-display, sans-serif);
    font-weight: 700;
    font-size: 20px;
    color: var(--c-primary, #064E3B);
}

/* --- Band 2: Link columns --- */
.footer-v2 .fv-links {
    background: var(--c-white, #fff);
    padding: 8px 0 48px;
}
.footer-v2 .fv-links__inner {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
}
.footer-v2 .fv-col__title {
    font-family: var(--f-display, sans-serif);
    font-size: 16px;
    font-weight: 800;
    color: var(--c-primary, #064E3B);
    margin: 0 0 16px;
}
.footer-v2 .fv-col ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.footer-v2 .fv-col li { margin-bottom: 10px; }
.footer-v2 .fv-col a {
    color: var(--c-text-light, #4B5563);
    font-size: 14px;
    text-decoration: none;
    transition: var(--transition-fast, all .15s ease);
}
.footer-v2 .fv-col a:hover {
    color: var(--c-accent, #D97706);
    padding-left: 4px;
}

/* --- Band 3: Brand + badges + disclaimer --- */
.footer-v2 .fv-bottom {
    background: var(--c-gray-100, #ECFDF5);
    border-top: 1px solid var(--c-gray-200, #D1FAE5);
    padding: 36px 0;
}
.footer-v2 .fv-bottom__inner {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 40px;
    align-items: start;
}
.footer-v2 .fv-bottom__logo {
    height: 75px;
    width: auto;
    display: block;
    margin-bottom: 18px;
}
.footer-v2 .fv-badges {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.footer-v2 .fv-badge {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    font-size: 12px;
    color: var(--c-primary, #064E3B);
    background: var(--c-white, #fff);
    border: 1px solid var(--c-gray-200, #D1FAE5);
    border-radius: var(--radius-sm, 8px);
    padding: 8px 12px;
    width: fit-content;
}
.footer-v2 .fv-badge i {
    color: var(--c-accent, #D97706);
    font-size: 16px;
}
.footer-v2 .fv-bottom__legal p {
    font-size: 12px;
    line-height: 1.7;
    color: var(--c-gray-500, #34D399);
    margin: 0 0 12px;
}
.footer-v2 .fv-bottom__legal .fv-copy {
    color: var(--c-text-light, #4B5563);
    font-weight: 500;
    margin-top: 4px;
}
.footer-v2 .fv-bottom__legal a {
    color: var(--c-primary, #064E3B);
    text-decoration: underline;
    font-weight: 600;
}
.footer-v2 .fv-bottom__legal a:hover { color: var(--c-accent, #D97706); }

/* =============================================
   MOBILE STEPS SLIDER (infinite auto-scroll)
   Visible only on screens ≤768px
   Scrolls left→right; when end is reached it
   seamlessly loops back to the first card.
   ============================================= */
.steps-slider {
    display: none; /* hidden on desktop */
    overflow: hidden;
    width: 100%;
    padding: 8px 0 20px;
    position: relative;
}

.steps-slider__track {
    display: flex;
    gap: 16px;
    overflow: hidden;       /* JS controls scroll via translateX */
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;  /* Firefox */
    padding: 15px 20px 16px;
    will-change: transform; /* GPU-accelerated for smoothness */
}

.steps-slider__track::-webkit-scrollbar {
    display: none; /* Chrome / Safari */
}

.steps-slider__card {
    flex: 0 0 260px; /* fixed card width for mobile */
    background: var(--c-bg, #F8FAFC);
    border: 1px solid var(--c-gray-200, #E2E8F0);
    border-radius: var(--radius-xl, 24px);
    padding: 28px 22px 24px;
    text-align: center;
    position: relative;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.steps-slider__card:first-child {
    margin-left: 0;
}

.steps-slider__card:hover,
.steps-slider__card:active {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg, 0 10px 15px rgba(0,0,0,0.1));
}

.steps-slider__card-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.steps-slider__card-icon {
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 196, 140, 0.1);
    border-radius: var(--radius-md, 12px);
    margin-bottom: 4px;
}

.steps-slider__card-img {
    width: 40px;
    height: 40px;
    object-fit: contain;
}

.steps-slider__card-number {
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--c-accent, #D97706);
    color: white;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 13px;
    font-family: var(--f-display, sans-serif);
}

.steps-slider__card-title {
    font-family: var(--f-display, sans-serif);
    font-size: 16px;
    font-weight: 700;
    color: var(--c-primary, #064E3B);
    line-height: 1.3;
}

.steps-slider__card-desc {
    font-size: 13px;
    line-height: 1.6;
    color: var(--c-text-light, #4B5563);
}

/* Show slider only on mobile, hide desktop grid */
@media (max-width: 768px) {
    .steps-grid--desktop { display: none !important; }
    .steps-slider { display: block; }
}

/* Hide slider on desktop (redundant safety) */
@media (min-width: 769px) {
    .steps-slider { display: none !important; }
    .steps-grid--desktop { display: grid; }
}

/* Smaller phones: narrower cards */
@media (max-width: 380px) {
    .steps-slider__card { flex: 0 0 230px; padding: 24px 16px 20px; }
    .steps-slider__card-title { font-size: 14px; }
    .steps-slider__card-desc { font-size: 12px; }
}

/* Hand-drawn PNG icons inside "How it works" step cards */
.step-card__icon .step-card__img,
.step-card__img {
    width: 76px;
    height: 76px;
    object-fit: contain;
    display: inline-block;
    margin: 0 auto;
}

/* =============================================
   HAND-SKETCH PNG ICONS replacing emojis
   (.sk-ic is sized per container)
   ============================================= */
.sk-ic {
    display: inline-block;
    width: auto;
    max-width: 100%;
    object-fit: contain;
    vertical-align: middle;
}
/* Emoji replacements that sit inline with text/headings:
   size to the parent's font-size so they match what the emoji did. */
.sk-ic--inline {
    height: 1em;
    width: auto;
    display: inline-block;
    vertical-align: -0.15em;
    object-fit: contain;
}
/* Hero block icons are larger and sit on their own line */
.info-hero__icon .sk-ic--inline { height: 56px; vertical-align: middle; }
.testimonial-card__stars .sk-ic--inline { margin: 0 1px; }
.info-float__icon .sk-ic { height: 26px; }
.benefit-card__emoji .sk-ic { height: 40px; }
.stat-item__icon .sk-ic { height: 46px; }
.author-avatar .sk-ic { height: 100%; width: 100%; padding: 4px; }

/* --- Responsive --- */
@media (max-width: 860px) {
    .footer-v2 .fv-commit__inner { grid-template-columns: 1fr; gap: 28px; }
    .footer-v2 .fv-bottom__inner { grid-template-columns: 1fr; gap: 24px; }
    /* Keep all 3 link columns in a single row on tablet */
    .footer-v2 .fv-links__inner {
        grid-template-columns: repeat(3, 1fr);
        gap: 20px 16px;
    }
    .footer-v2 .fv-col__title { font-size: 14px; margin-bottom: 12px; }
    .footer-v2 .fv-col li { margin-bottom: 7px; }
    .footer-v2 .fv-col a { font-size: 13px; }
    .footer-v2 .fv-commit__right { gap: 16px; }
    .footer-v2 .fv-trust__icon { font-size: 26px; }
    .footer-v2 .fv-trust__text { font-size: 17px; }
    .footer-v2 .fv-zip__wrap { max-width: 90%; }
    .footer-v2 .fv-bottom__brand { display: flex; flex-direction: column; align-items: center; text-align: center; }
    .footer-v2 .fv-badges { align-items: center; }
}

@media (max-width: 480px) {
    /* Keep all 3 link columns in a single row on mobile too */
    .footer-v2 .fv-commit__text{
        max-width: 320px;
    }
    .cta-btn {
        font-size: 12px;
    }
    .footer-v2 .fv-links__inner {
        grid-template-columns: repeat(3, 1fr);
        gap: 16px 10px;
    }
    .footer-v2 .fv-col__title {
        font-size: 12px;
        margin-bottom: 10px;
        letter-spacing: 0.01em;
        line-height: 1.3;
    }
    .footer-v2 .fv-col li { margin-bottom: 5px; }
    .footer-v2 .fv-col a {
        font-size: 11px;
        line-height: 1.4;
    }
    .footer-v2 .fv-col a:hover { padding-left: 2px; }
    .footer-v2 .fv-commit { padding: 40px 0 32px; }
    .footer-v2 .fv-commit__title { font-size: 22px; }
}

