{"id":28677,"date":"2026-04-24T10:43:55","date_gmt":"2026-04-24T09:43:55","guid":{"rendered":"https:\/\/invoicefly.com\/?page_id=28677"},"modified":"2026-06-08T21:35:14","modified_gmt":"2026-06-08T20:35:14","slug":"plantilla-presupuesto","status":"publish","type":"page","link":"https:\/\/invoicefly.com\/es\/free-resources\/free-templates\/estimate-templates\/","title":{"rendered":"Plantillas de presupuesto gratuitas"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"28677\" class=\"elementor elementor-28677\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-15c3c5d e-con-full e-flex e-con e-parent\" data-id=\"15c3c5d\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-88856af elementor-widget elementor-widget-html\" data-id=\"88856af\" data-element_type=\"widget\" data-settings=\"{&quot;ekit_we_effect_on&quot;:&quot;none&quot;}\" data-widget_type=\"html.default\">\n\t\t\t\t\t<link rel=\"preconnect\" href=\"https:\/\/fonts.googleapis.com\" \/>\n<link rel=\"preconnect\" href=\"https:\/\/fonts.gstatic.com\" crossorigin \/>\n<link\n  rel=\"stylesheet\"\n  href=\"https:\/\/fonts.googleapis.com\/css2?family=Manrope:wght@400;500;600;700;800&family=JetBrains+Mono:wght@500;600&display=swap\"\n  media=\"print\"\n  onload=\"this.media = 'all'\"\n\/>\n<noscript\n  ><link\n    rel=\"stylesheet\"\n    href=\"https:\/\/fonts.googleapis.com\/css2?family=Manrope:wght@400;500;600;700;800&family=JetBrains+Mono:wght@500;600&display=swap\"\n\/><\/noscript>\n\n<style>\n  \/* ===== WORDPRESS \/ ELEMENTOR COMPATIBILITY ===== *\/\n\n  \/* 1. Remove the browser's default 8 px body margin. WP themes usually do\n        this already, but we enforce it here so the widget works even on bare\n        or misconfigured installs. *\/\n  html,\n  body {\n    margin: 0 !important;\n    padding: 0 !important;\n  }\n\n  \/* 2. Elementor columns, sections and widget containers default to\n        overflow:hidden which silently breaks position:sticky (the sticky bar)\n        and clips filter dropdowns + the backdrop modal. Override globally for\n        every Elementor layout primitive that could wrap this widget. *\/\n  .elementor-section,\n  .elementor-column,\n  .elementor-widget-wrap,\n  .elementor-widget-html,\n  .elementor-widget-container,\n  .e-container,\n  .e-con,\n  .e-con-inner,\n  .e-flex,\n  .e-child {\n    overflow: visible !important;\n  }\n\n  \/* 3. WP themes sometimes add underlines \/ colours to every <a> or\n        max-width:100% to every <img>. Reinforce our own resets so those\n        global rules can't leak inside the widget. *\/\n  .iftpl-widget a {\n    color: inherit !important;\n    text-decoration: none !important;\n  }\n  .iftpl-widget img {\n    display: block;\n    max-width: 100%;\n    height: auto;\n  }\n  .iftpl-widget *,\n  .iftpl-widget *::before,\n  .iftpl-widget *::after {\n    box-sizing: border-box;\n  }\n\n  \/* ===== ROOT SCOPE ===== *\/\n  .iftpl-widget {\n    --brand: #0044bb;\n    --brand-dark: #003299;\n    --brand-700: #0036a6;\n    --brand-600: #0044bb;\n    --brand-500: #1e5eff;\n    --brand-100: #d9e4ff;\n    --brand-50: #edf2ff;\n    --ink: #0a1628;\n    --ink-soft: #2a3a52;\n    --ink-mute: #4a5568;\n    --ink-faint: #6b7689;\n    --bg: #ffffff;\n    --bg-soft: #f6f8fb;\n    --bg-tint: #eef2f8;\n    --line: #e4e8f0;\n    --line-soft: #eff2f7;\n    --safety: #ff8c00;\n    --green: #16a34a;\n    --radius: 12px;\n    --radius-lg: 16px;\n    --radius-pill: 999px;\n    --shadow-sm:\n      0 1px 2px rgba(10, 22, 40, 0.04), 0 1px 1px rgba(10, 22, 40, 0.06);\n    --shadow-md:\n      0 4px 12px -2px rgba(10, 22, 40, 0.08),\n      0 2px 4px -1px rgba(10, 22, 40, 0.04);\n    --shadow-lg:\n      0 16px 32px -8px rgba(10, 22, 40, 0.12),\n      0 4px 8px -2px rgba(10, 22, 40, 0.06);\n    --shadow-brand: 0 8px 20px -4px rgba(0, 68, 187, 0.32);\n    --ease: cubic-bezier(0.32, 0.72, 0, 1);\n    --font:\n      \"Manrope\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\n    --font-mono: \"JetBrains Mono\", ui-monospace, \"SF Mono\", Menlo, monospace;\n\n    font-family: var(--font);\n    color: var(--ink);\n    line-height: 1.5;\n    -webkit-font-smoothing: antialiased;\n    background: var(--bg);\n    width: 100%;\n    box-sizing: border-box;\n    position: relative;\n  }\n  .iftpl-widget *,\n  .iftpl-widget *::before,\n  .iftpl-widget *::after {\n    box-sizing: border-box;\n  }\n  .iftpl-widget h1,\n  .iftpl-widget h2,\n  .iftpl-widget h3,\n  .iftpl-widget h4,\n  .iftpl-widget p,\n  .iftpl-widget ul,\n  .iftpl-widget li {\n    margin: 0;\n    padding: 0;\n  }\n  .iftpl-widget ul {\n    list-style: none;\n  }\n  .iftpl-widget button {\n    font-family: inherit;\n    cursor: pointer;\n    background: none;\n    border: none;\n    color: inherit;\n    padding: 0;\n  }\n  .iftpl-widget a {\n    color: inherit;\n    text-decoration: none;\n  }\n  .iftpl-widget input {\n    font-family: inherit;\n    color: inherit;\n  }\n  .iftpl-widget img {\n    display: block;\n    max-width: 100%;\n    height: auto;\n  }\n  .iftpl-widget svg {\n    display: inline-block;\n    vertical-align: middle;\n  }\n\n  \/* ===== BUTTONS ===== *\/\n  .iftpl-widget .btn {\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    gap: 8px;\n    padding: 12px 22px;\n    border-radius: var(--radius-pill);\n    font-size: 14.5px;\n    font-weight: 700;\n    border: 1.5px solid transparent;\n    text-decoration: none;\n    cursor: pointer;\n    transition:\n      background-color 0.2s var(--ease),\n      border-color 0.2s var(--ease),\n      box-shadow 0.2s var(--ease),\n      transform 0.2s var(--ease),\n      color 0.2s var(--ease);\n    white-space: nowrap;\n    text-transform: uppercase;\n    letter-spacing: 0.04em;\n  }\n  .iftpl-widget .btn-primary {\n    background: var(--brand);\n    color: white !important;\n    border-color: var(--brand);\n    box-shadow: var(--shadow-brand);\n  }\n  .iftpl-widget .btn-primary:hover {\n    background: var(--brand-dark);\n    border-color: var(--brand-dark);\n    transform: translateY(-1px);\n    box-shadow: 0 12px 28px -4px rgba(0, 68, 187, 0.42);\n  }\n  .iftpl-widget .btn-outline {\n    background: white;\n    color: var(--ink);\n    border-color: var(--line);\n  }\n  .iftpl-widget .btn-outline:hover {\n    border-color: var(--ink);\n    background: var(--bg-soft);\n  }\n  .iftpl-widget .btn-ghost {\n    background: transparent;\n    color: var(--ink-soft);\n    padding: 8px 14px;\n    font-weight: 600;\n  }\n  .iftpl-widget .btn-ghost:hover {\n    color: var(--ink);\n    background: var(--bg-soft);\n  }\n  .iftpl-widget .btn-lg {\n    padding: 14px 26px;\n    font-size: 15.5px;\n  }\n\n  \/* ===== HERO ===== *\/\n  .iftpl-widget .hero {\n    width: 100%;\n    padding: 120px 0 32px;\n    background:\n      radial-gradient(\n        ellipse 70% 80% at 85% 20%,\n        rgba(30, 94, 255, 0.45) 0%,\n        transparent 70%\n      ),\n      radial-gradient(\n        ellipse 60% 60% at 0% 100%,\n        rgba(0, 68, 187, 0.32) 0%,\n        transparent 70%\n      ),\n      var(--ink);\n    position: relative;\n    isolation: isolate;\n  }\n  .iftpl-widget .hero-inner {\n    max-width: 1280px;\n    margin: 0 auto;\n    padding: 56px 32px 64px;\n  }\n\n  \/* \u2500\u2500 Hero: dark-background text & UI overrides \u2500\u2500 *\/\n  .iftpl-widget .hero .crumbs {\n    color: rgba(255, 255, 255, 0.45);\n  }\n  .iftpl-widget .hero .crumbs a:hover {\n    color: white;\n  }\n  .iftpl-widget .hero .crumbs .sep {\n    color: rgba(255, 255, 255, 0.25);\n    opacity: 1;\n  }\n  .iftpl-widget .hero .crumbs .current {\n    color: rgba(255, 255, 255, 0.7);\n  }\n  .iftpl-widget .hero .hero-badge {\n    background: rgba(255, 255, 255, 0.1);\n    border-color: rgba(255, 255, 255, 0.2);\n    color: white;\n  }\n  .iftpl-widget .hero .hero-badge-dot {\n    background: var(--brand-500);\n  }\n  .iftpl-widget .hero .hero-h1 {\n    color: white;\n  }\n  .iftpl-widget .hero .hero-h1 .hi {\n    color: var(--brand);\n  }\n  .iftpl-widget .hero .hero-lead {\n    color: rgba(255, 255, 255, 0.75);\n  }\n  .iftpl-widget .hero .hero-proof {\n    border-top-color: rgba(255, 255, 255, 0.12);\n  }\n  .iftpl-widget .hero .hero-proof-text {\n    color: rgba(255, 255, 255, 0.75);\n  }\n  .iftpl-widget .hero .hero-proof-text strong {\n    color: white;\n  }\n  .iftpl-widget .hero .hero-proof-sep {\n    background: rgba(255, 255, 255, 0.2);\n  }\n  .iftpl-widget .hero .btn-outline {\n    background: transparent;\n    color: white !important;\n    border-color: rgba(255, 255, 255, 0.35);\n  }\n  .iftpl-widget .hero .btn-outline:hover {\n    background: rgba(255, 255, 255, 0.1);\n    border-color: white;\n    color: white !important;\n  }\n  .iftpl-widget .hero .hero-doc {\n    box-shadow:\n      0 24px 48px -8px rgba(0, 0, 0, 0.5),\n      0 4px 12px -2px rgba(0, 0, 0, 0.35);\n  }\n  .iftpl-widget .hero-grid {\n    display: grid;\n    grid-template-columns: 1.4fr 1fr;\n    gap: 56px;\n    align-items: center;\n  }\n  .iftpl-widget .crumbs {\n    font-family: var(--font-mono);\n    font-size: 11px;\n    color: var(--ink-faint);\n    margin-bottom: 22px;\n    display: flex;\n    gap: 8px;\n    align-items: center;\n    flex-wrap: wrap;\n    letter-spacing: 0.04em;\n    text-transform: uppercase;\n  }\n  .iftpl-widget .crumbs a:hover {\n    color: var(--brand);\n  }\n  .iftpl-widget .crumbs .sep {\n    color: var(--ink-faint);\n    opacity: 0.5;\n  }\n  .iftpl-widget .crumbs .current {\n    color: var(--ink-soft);\n    font-weight: 600;\n  }\n\n  .iftpl-widget .hero-badge {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    padding: 6px 14px;\n    background: var(--brand-50);\n    border: 1px solid var(--brand-100);\n    border-radius: var(--radius-pill);\n    font-size: 12px;\n    font-weight: 700;\n    color: var(--brand);\n    letter-spacing: 0.02em;\n    margin-bottom: 20px;\n  }\n  .iftpl-widget .hero-badge-dot {\n    width: 18px;\n    height: 18px;\n    background: var(--brand);\n    color: white;\n    border-radius: 50%;\n    display: grid;\n    place-items: center;\n    font-size: 10px;\n  }\n  .iftpl-widget .hero-h1 {\n    font-family: var(--font);\n    font-size: clamp(38px, 5.4vw, 60px);\n    line-height: 1.04;\n    letter-spacing: -0.025em;\n    font-weight: 800;\n    color: var(--ink);\n    margin-bottom: 18px;\n  }\n  .iftpl-widget .hero-h1 .hi {\n    color: var(--brand);\n    position: relative;\n    display: inline-block;\n  }\n  .iftpl-widget .hero-lead {\n    font-size: 18px;\n    line-height: 1.55;\n    color: var(--ink-soft);\n    max-width: 560px;\n    margin-bottom: 28px;\n  }\n  .iftpl-widget .hero-ctas {\n    display: flex;\n    gap: 12px;\n    flex-wrap: wrap;\n    margin-bottom: 32px;\n  }\n  .iftpl-widget .hero-proof {\n    display: flex;\n    align-items: center;\n    gap: 16px;\n    flex-wrap: wrap;\n    padding-top: 24px;\n    border-top: 1px solid var(--line-soft);\n  }\n  .iftpl-widget .hero-proof-stars {\n    display: inline-flex;\n    gap: 1px;\n    color: #ffb800;\n  }\n  .iftpl-widget .hero-proof-text {\n    font-size: 13.5px;\n    color: var(--ink-soft);\n  }\n  .iftpl-widget .hero-proof-text strong {\n    color: var(--ink);\n    font-weight: 700;\n  }\n  .iftpl-widget .hero-proof-sep {\n    width: 1px;\n    height: 16px;\n    background: var(--line);\n  }\n\n  \/* Hero visual: stack of estimates with timer *\/\n  .iftpl-widget .hero-visual {\n    position: relative;\n    aspect-ratio: 1.05 \/ 1;\n    perspective: 1200px;\n  }\n  .iftpl-widget .hero-stack {\n    position: absolute;\n    inset: 0;\n  }\n  .iftpl-widget .hero-doc {\n    position: absolute;\n    width: 70%;\n    aspect-ratio: 3\/4;\n    background: white;\n    border: 1px solid var(--line);\n    border-radius: var(--radius-lg);\n    box-shadow: var(--shadow-lg);\n    overflow: hidden;\n    transition: transform 0.5s var(--ease);\n  }\n  .iftpl-widget .hero-doc-1 {\n    top: 4%;\n    left: 0;\n    transform: rotate(-6deg);\n    z-index: 1;\n  }\n  .iftpl-widget .hero-doc-2 {\n    top: 0;\n    left: 50%;\n    transform: translateX(-50%) rotate(2deg);\n    z-index: 2;\n  }\n  .iftpl-widget .hero-doc-3 {\n    top: 8%;\n    right: 0;\n    transform: rotate(7deg);\n    z-index: 1;\n  }\n  .iftpl-widget .hero-doc-head {\n    background: var(--ink);\n    color: white;\n    padding: 10% 8% 8%;\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-start;\n  }\n  .iftpl-widget .hero-doc-head .ti {\n    font-family: var(--font);\n    font-size: 12px;\n    font-weight: 800;\n    letter-spacing: 0.05em;\n    text-transform: uppercase;\n  }\n  .iftpl-widget .hero-doc-head .num {\n    font-family: var(--font-mono);\n    font-size: 9px;\n    opacity: 0.7;\n  }\n  .iftpl-widget .hero-doc-body {\n    padding: 8%;\n    display: flex;\n    flex-direction: column;\n    gap: 6%;\n  }\n  .iftpl-widget .hero-doc-line {\n    height: 6px;\n    background: var(--bg-tint);\n    border-radius: 3px;\n  }\n  .iftpl-widget .hero-doc-line.short {\n    width: 50%;\n  }\n  .iftpl-widget .hero-doc-line.med {\n    width: 75%;\n  }\n  .iftpl-widget .hero-doc-row {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 4% 0;\n    border-bottom: 1px dashed var(--line-soft);\n  }\n  .iftpl-widget .hero-doc-row .lbl {\n    height: 5px;\n    width: 50%;\n    background: var(--bg-tint);\n    border-radius: 2px;\n  }\n  .iftpl-widget .hero-doc-row .val {\n    height: 5px;\n    width: 22%;\n    background: var(--ink);\n    border-radius: 2px;\n  }\n  .iftpl-widget .hero-doc-total {\n    background: var(--brand);\n    color: white;\n    padding: 6%;\n    border-radius: 8px;\n    margin-top: 4%;\n  }\n  .iftpl-widget .hero-doc-total .lbl {\n    font-family: var(--font-mono);\n    font-size: 8px;\n    opacity: 0.7;\n    text-transform: uppercase;\n    letter-spacing: 0.08em;\n  }\n  .iftpl-widget .hero-doc-total .amt {\n    font-size: 14px;\n    font-weight: 800;\n    margin-top: 2%;\n  }\n  .iftpl-widget .hero-doc img {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    object-position: top center;\n    display: block;\n    border-radius: inherit;\n  }\n\n  \/* ===== TRADE BAND (industry pills) ===== *\/\n  .iftpl-widget .trades {\n    max-width: 1280px;\n    margin: 0 auto;\n    padding: 62px 32px 40px;\n  }\n  .iftpl-widget .trades-label {\n    font-family: var(--font-mono);\n    font-size: 11px;\n    color: var(--ink-faint);\n    letter-spacing: 0.08em;\n    text-transform: uppercase;\n    margin-bottom: 14px;\n    text-align: center;\n  }\n  .iftpl-widget .trades-grid {\n    display: grid;\n    grid-template-columns: repeat(8, 1fr);\n    gap: 10px;\n  }\n  .iftpl-widget .trade {\n    background: white;\n    border: 1.5px solid var(--line);\n    border-radius: var(--radius);\n    padding: 16px 10px 14px;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    gap: 8px;\n    transition:\n      border-color 0.2s var(--ease),\n      background-color 0.2s var(--ease),\n      transform 0.2s var(--ease),\n      box-shadow 0.2s var(--ease),\n      color 0.2s var(--ease);\n    cursor: pointer;\n    text-align: center;\n  }\n  .iftpl-widget .trade:hover {\n    border-color: var(--brand);\n    background: var(--brand-50);\n    transform: translateY(-2px);\n    box-shadow: var(--shadow-md);\n  }\n  .iftpl-widget .trade.active {\n    border-color: var(--brand);\n    background: var(--brand);\n    color: white;\n  }\n  .iftpl-widget .trade-icon {\n    width: 28px;\n    height: 28px;\n    color: var(--brand);\n    transition: color 0.2s;\n  }\n  .iftpl-widget .trade.active .trade-icon {\n    color: white;\n  }\n  .iftpl-widget .trade-label {\n    font-size: 12px;\n    font-weight: 700;\n    letter-spacing: -0.005em;\n    color: var(--ink);\n  }\n  .iftpl-widget .trade.active .trade-label {\n    color: white;\n  }\n  .iftpl-widget .trade-count {\n    font-family: var(--font-mono);\n    font-size: 10px;\n    color: var(--ink-faint);\n    font-weight: 500;\n  }\n  .iftpl-widget .trade.active .trade-count {\n    color: rgba(255, 255, 255, 0.85);\n  }\n\n  \/* ===== TAB PILLS (document type switcher) ===== *\/\n  .iftpl-widget .tab-pills-wrap {\n    max-width: 1280px;\n    margin: 0 auto;\n    padding: 0 32px 20px;\n    transition: padding 0.25s var(--ease);\n  }\n  .iftpl-widget .tab-pills {\n    display: flex;\n    gap: 4px;\n    padding: 5px;\n    background: var(--bg-soft);\n    border: 1px solid var(--line);\n    border-radius: var(--radius-pill);\n    width: fit-content;\n    max-width: 100%;\n    overflow-x: auto;\n    -webkit-overflow-scrolling: touch;\n    scrollbar-width: none;\n  }\n  .iftpl-widget .tab-pills::-webkit-scrollbar {\n    display: none;\n  }\n  .iftpl-widget .tab-pill {\n    padding: 9px 18px;\n    border-radius: var(--radius-pill);\n    background: transparent;\n    color: var(--ink-mute);\n    font-size: 13.5px;\n    font-weight: 600;\n    transition:\n      color 0.2s var(--ease),\n      background-color 0.2s var(--ease),\n      box-shadow 0.2s var(--ease);\n    white-space: nowrap;\n    text-decoration: none;\n    display: inline-block;\n    flex-shrink: 0;\n  }\n  .iftpl-widget .tab-pill:hover {\n    color: var(--ink);\n  }\n  .iftpl-widget .tab-pill.active {\n    background: white;\n    color: var(--ink);\n    box-shadow: var(--shadow-sm);\n  }\n\n  \/* ===== TOOLBAR ===== *\/\n  .iftpl-widget .toolbar-wrap {\n    max-width: 1280px;\n    margin: 0 auto;\n    padding: 0 32px 20px;\n    position: relative;\n    transition: padding 0.25s var(--ease);\n  }\n  .iftpl-widget .toolbar {\n    background: white;\n    border: 1.5px solid var(--line);\n    border-radius: var(--radius-lg);\n    padding: 12px;\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    flex-wrap: wrap;\n    box-shadow: var(--shadow-sm);\n  }\n  .iftpl-widget .tb-search {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    background: var(--bg-soft);\n    border: 1.5px solid transparent;\n    border-radius: var(--radius-pill);\n    padding: 8px 16px;\n    flex: 1 1 240px;\n    min-width: 0;\n    transition:\n      background-color 0.2s,\n      border-color 0.2s;\n  }\n  .iftpl-widget .tb-search:focus-within {\n    background: white;\n    border-color: var(--brand);\n  }\n  .iftpl-widget .tb-search svg {\n    color: var(--ink-faint);\n    flex-shrink: 0;\n  }\n  .iftpl-widget .tb-search input {\n    background: transparent;\n    border: none;\n    outline: none;\n    color: var(--ink);\n    font-size: 14px;\n    font-weight: 500;\n    flex: 1;\n    min-width: 0;\n    padding: 0;\n  }\n  .iftpl-widget .tb-search input::placeholder {\n    color: var(--ink-faint);\n    font-weight: 500;\n  }\n\n  .iftpl-widget .tb-filter {\n    position: relative;\n  }\n  .iftpl-widget .tb-filter-btn {\n    background: white;\n    border: 1.5px solid var(--line);\n    color: var(--ink);\n    padding: 9px 14px;\n    border-radius: var(--radius-pill);\n    font-size: 13px;\n    font-weight: 600;\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    transition:\n      background-color 0.2s var(--ease),\n      border-color 0.2s var(--ease),\n      color 0.2s var(--ease);\n    min-height: 40px;\n    line-height: 1;\n    cursor: pointer;\n  }\n  .iftpl-widget .tb-filter-btn:hover {\n    border-color: var(--ink);\n  }\n  .iftpl-widget .tb-filter-btn.has-selection {\n    background: var(--brand);\n    color: white;\n    border-color: var(--brand);\n  }\n  .iftpl-widget .tb-filter-btn .count {\n    background: white;\n    color: var(--brand);\n    font-family: var(--font-mono);\n    font-size: 10px;\n    padding: 1px 6px;\n    border-radius: var(--radius-pill);\n    font-weight: 700;\n    line-height: 1.4;\n  }\n  .iftpl-widget .tb-filter-btn:not(.has-selection) .count {\n    background: var(--brand);\n    color: white;\n  }\n  .iftpl-widget .tb-filter-btn .caret {\n    transition: transform 0.2s;\n    opacity: 0.7;\n  }\n  .iftpl-widget .tb-filter.open .tb-filter-btn .caret {\n    transform: rotate(180deg);\n  }\n\n  \/* Dropdown \u2014 desktop default *\/\n  .iftpl-widget .tb-dropdown {\n    position: absolute;\n    top: calc(100% + 8px);\n    left: 0;\n    background: white;\n    color: var(--ink);\n    border-radius: var(--radius-lg);\n    box-shadow: var(--shadow-lg);\n    border: 1px solid var(--line);\n    padding: 14px;\n    min-width: 260px;\n    max-width: 320px;\n    z-index: 1000;\n    display: none;\n    pointer-events: auto;\n  }\n  .iftpl-widget .tb-filter.open .tb-dropdown {\n    display: block;\n  }\n  .iftpl-widget .tb-filter[data-filter=\"industry\"] .tb-dropdown {\n    left: auto;\n    right: 0;\n  }\n\n  .iftpl-widget .tb-mobile-backdrop {\n    display: none;\n    position: fixed;\n    inset: 0;\n    background: rgba(10, 22, 40, 0.5);\n    z-index: 9990;\n    opacity: 0;\n    transition: opacity 0.25s ease;\n    pointer-events: none;\n  }\n  .iftpl-widget .tb-mobile-backdrop.show {\n    opacity: 1;\n    pointer-events: auto;\n  }\n\n  .iftpl-widget .tb-dropdown-title {\n    font-family: var(--font-mono);\n    font-size: 10px;\n    text-transform: uppercase;\n    letter-spacing: 0.1em;\n    color: var(--ink-faint);\n    margin-bottom: 10px;\n    padding: 2px 8px;\n  }\n  .iftpl-widget .tb-mobile-head {\n    display: none;\n    align-items: center;\n    justify-content: space-between;\n    padding-bottom: 14px;\n    margin-bottom: 14px;\n    border-bottom: 1px solid var(--line);\n  }\n  .iftpl-widget .tb-mobile-head h4 {\n    font-size: 17px;\n    font-weight: 700;\n    letter-spacing: -0.01em;\n  }\n  .iftpl-widget .tb-mobile-close {\n    width: 34px;\n    height: 34px;\n    border-radius: 50%;\n    background: var(--bg-soft);\n    display: grid;\n    place-items: center;\n    color: var(--ink);\n  }\n  .iftpl-widget .tb-options {\n    display: flex;\n    flex-direction: column;\n    gap: 2px;\n    max-height: 320px;\n    overflow-y: auto;\n    -webkit-overflow-scrolling: touch;\n  }\n  .iftpl-widget .tb-option {\n    padding: 10px 10px;\n    background: transparent;\n    border-radius: 8px;\n    text-align: left;\n    font-size: 13.5px;\n    font-weight: 600;\n    color: var(--ink);\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    transition: background 0.15s;\n    width: 100%;\n    cursor: pointer;\n  }\n  .iftpl-widget .tb-option:hover {\n    background: var(--bg-soft);\n  }\n  .iftpl-widget .tb-option.on {\n    background: var(--brand-50);\n    color: var(--brand);\n  }\n  .iftpl-widget .tb-option .checkbox {\n    width: 18px;\n    height: 18px;\n    border: 1.5px solid var(--line);\n    border-radius: 5px;\n    display: grid;\n    place-items: center;\n    flex-shrink: 0;\n    transition:\n      background-color 0.15s,\n      border-color 0.15s,\n      color 0.15s;\n    color: white;\n    font-size: 11px;\n    background: white;\n  }\n  .iftpl-widget .tb-option.on .checkbox {\n    background: var(--brand);\n    border-color: var(--brand);\n  }\n  .iftpl-widget .tb-option .swatch {\n    width: 14px;\n    height: 14px;\n    border-radius: 50%;\n    flex-shrink: 0;\n    border: 1px solid var(--line);\n  }\n  .iftpl-widget .tb-dropdown-foot {\n    display: flex;\n    justify-content: space-between;\n    padding-top: 12px;\n    margin-top: 12px;\n    border-top: 1px solid var(--line);\n  }\n  .iftpl-widget .tb-clear,\n  .iftpl-widget .tb-apply {\n    background: transparent;\n    font-size: 12.5px;\n    font-weight: 700;\n    padding: 6px 12px;\n    border-radius: 6px;\n    cursor: pointer;\n  }\n  .iftpl-widget .tb-clear {\n    color: var(--ink-faint);\n  }\n  .iftpl-widget .tb-clear:hover {\n    color: var(--ink);\n    background: var(--bg-soft);\n  }\n  .iftpl-widget .tb-apply {\n    color: var(--brand);\n  }\n  .iftpl-widget .tb-apply:hover {\n    background: var(--brand-50);\n  }\n\n  \/* ===== GALLERY ===== *\/\n  .iftpl-widget .gallery {\n    max-width: 1280px;\n    margin: 0 auto;\n    padding: 0 32px 96px;\n  }\n  .iftpl-widget .gallery-head {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    margin-bottom: 22px;\n    gap: 14px;\n    flex-wrap: wrap;\n  }\n  .iftpl-widget .gallery-count {\n    font-family: var(--font-mono);\n    font-size: 12.5px;\n    color: var(--ink-faint);\n    font-weight: 500;\n  }\n  .iftpl-widget .gallery-count strong {\n    color: var(--ink);\n    font-weight: 700;\n  }\n  .iftpl-widget .active-filters {\n    display: flex;\n    gap: 6px;\n    flex-wrap: wrap;\n    align-items: center;\n  }\n  .iftpl-widget .active-filter-chip {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    padding: 5px 8px 5px 12px;\n    background: white;\n    border: 1px solid var(--line);\n    border-radius: var(--radius-pill);\n    font-size: 12px;\n    color: var(--ink-soft);\n    font-weight: 600;\n  }\n  .iftpl-widget .active-filter-chip .x {\n    width: 18px;\n    height: 18px;\n    border-radius: 50%;\n    background: var(--bg-soft);\n    display: grid;\n    place-items: center;\n    font-size: 11px;\n    color: var(--ink-faint);\n    cursor: pointer;\n    transition:\n      background-color 0.15s,\n      color 0.15s;\n    border: none;\n  }\n  .iftpl-widget .active-filter-chip .x:hover {\n    background: var(--ink);\n    color: white;\n  }\n  .iftpl-widget .clear-all-btn {\n    background: transparent;\n    border: 1px dashed var(--line);\n    border-radius: var(--radius-pill);\n    padding: 5px 12px;\n    font-size: 12px;\n    color: var(--ink-faint);\n    font-weight: 600;\n    cursor: pointer;\n    transition:\n      border-color 0.2s,\n      color 0.2s;\n  }\n  .iftpl-widget .clear-all-btn:hover {\n    border-color: var(--ink);\n    color: var(--ink);\n    border-style: solid;\n  }\n\n  .iftpl-widget .template-grid {\n    display: grid;\n    grid-template-columns: repeat(auto-fill, minmax(232px, 1fr));\n    gap: 16px;\n    \/* align-items defaults to stretch \u2014 cards in the same row share the same height *\/\n  }\n  .iftpl-widget .template-card {\n    position: relative;\n    background: white;\n    border-radius: var(--radius-lg);\n    overflow: hidden;\n    border: 1.5px solid var(--line);\n    cursor: pointer;\n    transition:\n      transform 0.3s var(--ease),\n      box-shadow 0.3s,\n      border-color 0.3s;\n    text-align: left;\n    padding: 0;\n    width: 100%;\n    font-family: inherit;\n    \/* Flex column so the thumb stays at its aspect-ratio and the info\n       section absorbs any extra height \u2014 no whitespace above the thumb *\/\n    display: flex;\n    flex-direction: column;\n  }\n  .iftpl-widget .template-card:hover {\n    transform: translateY(-3px);\n    box-shadow: var(--shadow-lg);\n    border-color: var(--brand);\n  }\n  .iftpl-widget .tc-thumb {\n    aspect-ratio: 3 \/ 4;\n    background: var(--bg-soft);\n    padding: 14px;\n    overflow: hidden;\n    position: relative;\n  }\n  .iftpl-widget .tc-img-clip {\n    width: 100%;\n    height: 100%;\n    overflow: hidden;\n    border-radius: 8px;\n    box-shadow: var(--shadow-sm);\n    position: relative;\n  }\n  .iftpl-widget .tc-thumb img {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    object-position: top center;\n    background: white;\n    display: block;\n    transition: transform 0.35s var(--ease);\n  }\n  .iftpl-widget .template-card:hover .tc-thumb img {\n    transform: scale(1.02);\n  }\n  .iftpl-widget .tc-badge {\n    position: absolute;\n    top: 22px;\n    left: 22px;\n    background: var(--brand);\n    color: white;\n    font-family: var(--font-mono);\n    font-size: 9.5px;\n    font-weight: 700;\n    padding: 4px 8px;\n    border-radius: 4px;\n    letter-spacing: 0.05em;\n    text-transform: uppercase;\n    z-index: 1;\n    box-shadow: var(--shadow-sm);\n  }\n  .iftpl-widget .tc-overlay {\n    position: absolute;\n    inset: 14px;\n    background: rgba(10, 22, 40, 0.7);\n    border-radius: 8px;\n    display: grid;\n    place-items: center;\n    opacity: 0;\n    transition: opacity 0.25s;\n    pointer-events: none;\n  }\n  .iftpl-widget .template-card:hover .tc-overlay {\n    opacity: 1;\n  }\n  .iftpl-widget .tc-overlay-btn {\n    background: white;\n    color: var(--ink);\n    padding: 10px 18px;\n    border-radius: var(--radius-pill);\n    font-size: 13px;\n    font-weight: 700;\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    transform: translateY(8px);\n    transition: transform 0.3s;\n  }\n  .iftpl-widget .template-card:hover .tc-overlay-btn {\n    transform: translateY(0);\n  }\n  .iftpl-widget .tc-info {\n    padding: 14px 16px 16px;\n    display: flex;\n    justify-content: space-between;\n    align-items: start;\n    gap: 12px;\n    flex: 1; \/* grow to fill remaining card height so all cards in a row align *\/\n  }\n  .iftpl-widget .tc-name {\n    font-weight: 700;\n    font-size: 14px;\n    line-height: 1.3;\n    letter-spacing: -0.01em;\n    color: var(--ink);\n  }\n  .iftpl-widget .tc-meta {\n    font-family: var(--font-mono);\n    font-size: 10.5px;\n    color: var(--ink-faint);\n    margin-top: 4px;\n    font-weight: 500;\n    letter-spacing: 0.02em;\n    text-transform: uppercase;\n  }\n  .iftpl-widget .tc-meta .dot {\n    display: inline-block;\n    padding: 0 4px;\n    opacity: 0.5;\n  }\n  .iftpl-widget .tc-formats {\n    display: flex;\n    gap: 3px;\n    margin-top: 8px;\n    align-items: center;\n  }\n  .iftpl-widget .tc-fmt {\n    font-family: var(--font-mono);\n    font-size: 8.5px;\n    font-weight: 700;\n    padding: 2px 5px;\n    border-radius: 3px;\n    color: var(--ink-faint);\n    background: var(--bg-soft);\n    letter-spacing: 0.04em;\n  }\n  .iftpl-widget .tc-arrow {\n    width: 30px;\n    height: 30px;\n    background: var(--bg-soft);\n    border-radius: 50%;\n    display: grid;\n    place-items: center;\n    color: var(--ink-soft);\n    flex-shrink: 0;\n    transition:\n      background-color 0.25s var(--ease),\n      color 0.25s var(--ease),\n      transform 0.25s var(--ease);\n  }\n  .iftpl-widget .template-card:hover .tc-arrow {\n    background: var(--brand);\n    color: white;\n    transform: rotate(-45deg);\n  }\n\n  .iftpl-widget .empty-state {\n    grid-column: 1 \/ -1;\n    padding: 80px 40px;\n    text-align: center;\n    background: var(--bg-soft);\n    border-radius: var(--radius-lg);\n    border: 1.5px dashed var(--line);\n  }\n  .iftpl-widget .empty-state-title {\n    font-size: 22px;\n    font-weight: 700;\n    margin-bottom: 8px;\n    color: var(--ink);\n  }\n  .iftpl-widget .empty-state-text {\n    color: var(--ink-mute);\n    margin-bottom: 24px;\n    font-size: 14.5px;\n  }\n  .iftpl-widget .empty-suggest-header {\n    grid-column: 1 \/ -1;\n    padding: 8px 0 20px;\n    text-align: center;\n  }\n  .iftpl-widget .empty-suggest-header .empty-state-title {\n    font-size: 18px;\n    font-weight: 700;\n    margin-bottom: 6px;\n    color: var(--ink);\n  }\n  .iftpl-widget .empty-suggest-header .empty-state-text {\n    margin-bottom: 0;\n    color: var(--ink-mute);\n    font-size: 14.5px;\n  }\n\n  \/* ===== MODAL ===== *\/\n  .iftpl-widget .modal-backdrop {\n    position: fixed;\n    inset: 0;\n    background: rgba(10, 22, 40, 0.7);\n    backdrop-filter: blur(6px);\n    -webkit-backdrop-filter: blur(6px);\n    z-index: 99999;\n    display: none;\n    align-items: center;\n    justify-content: center;\n    padding: 24px;\n    overflow-y: auto;\n    animation: iftpl-fadeIn 0.25s ease;\n  }\n  .iftpl-widget .modal-backdrop.open {\n    display: flex;\n  }\n  @keyframes iftpl-fadeIn {\n    from {\n      opacity: 0;\n    }\n    to {\n      opacity: 1;\n    }\n  }\n  @keyframes iftpl-slideUp {\n    from {\n      opacity: 0;\n      transform: translateY(20px);\n    }\n    to {\n      opacity: 1;\n      transform: translateY(0);\n    }\n  }\n  .iftpl-widget .modal {\n    background: white;\n    border-radius: 20px;\n    max-width: 920px;\n    width: 100%;\n    max-height: calc(100vh - 48px);\n    overflow-y: auto;\n    position: relative;\n    box-shadow: 0 40px 80px -20px rgba(10, 22, 40, 0.4);\n    animation: iftpl-slideUp 0.35s var(--ease);\n  }\n  .iftpl-widget .modal-close {\n    position: absolute;\n    top: 16px;\n    right: 16px;\n    width: 38px;\n    height: 38px;\n    border-radius: 50%;\n    background: white;\n    border: 1px solid var(--line);\n    display: grid;\n    place-items: center;\n    color: var(--ink);\n    z-index: 5;\n    transition:\n      background-color 0.2s,\n      color 0.2s,\n      border-color 0.2s;\n    box-shadow: var(--shadow-md);\n    cursor: pointer;\n  }\n  .iftpl-widget .modal-close:hover {\n    background: var(--ink);\n    color: white;\n    border-color: var(--ink);\n  }\n  .iftpl-widget .modal-grid {\n    display: grid;\n    grid-template-columns: 1fr 1.05fr;\n    gap: 0;\n  }\n  .iftpl-widget .modal-preview {\n    background: var(--bg-soft);\n    padding: 48px 40px;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 20px 0 0 20px;\n  }\n  .iftpl-widget .modal-preview img {\n    width: 100%;\n    max-width: 340px;\n    border-radius: 8px;\n    box-shadow: var(--shadow-lg);\n    background: white;\n  }\n  .iftpl-widget .modal-body {\n    padding: 44px 40px;\n    display: flex;\n    flex-direction: column;\n  }\n  .iftpl-widget .modal-tag {\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    padding: 4px 10px;\n    background: var(--brand-50);\n    border: 1px solid var(--brand-100);\n    border-radius: var(--radius-pill);\n    font-size: 10.5px;\n    font-weight: 700;\n    color: var(--brand);\n    letter-spacing: 0.04em;\n    text-transform: uppercase;\n    width: fit-content;\n    margin-bottom: 16px;\n    font-family: var(--font-mono);\n  }\n  .iftpl-widget .modal-title {\n    font-size: clamp(24px, 3vw, 32px);\n    line-height: 1.15;\n    letter-spacing: -0.02em;\n    font-weight: 800;\n    margin-bottom: 12px;\n    color: var(--ink);\n  }\n  .iftpl-widget .modal-desc {\n    font-size: 14.5px;\n    color: var(--ink-mute);\n    line-height: 1.55;\n    margin-bottom: 24px;\n  }\n  .iftpl-widget .modal-section-title {\n    font-family: var(--font-mono);\n    font-size: 11px;\n    text-transform: uppercase;\n    letter-spacing: 0.08em;\n    color: var(--ink-faint);\n    margin-bottom: 12px;\n    font-weight: 600;\n  }\n  .iftpl-widget .modal-formats {\n    display: grid;\n    grid-template-columns: repeat(2, 1fr);\n    gap: 8px;\n    margin-bottom: 24px;\n  }\n  .iftpl-widget .modal-format {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n    padding: 12px 14px;\n    background: white;\n    border: 1.5px solid var(--line);\n    border-radius: var(--radius);\n    color: var(--ink);\n    transition:\n      border-color 0.2s var(--ease),\n      background-color 0.2s var(--ease),\n      transform 0.2s var(--ease),\n      box-shadow 0.2s var(--ease);\n    text-decoration: none;\n  }\n  .iftpl-widget .modal-format:hover {\n    border-color: var(--brand);\n    background: var(--brand-50);\n    transform: translateY(-1px);\n    box-shadow: var(--shadow-md);\n  }\n  .iftpl-widget .modal-format-icon {\n    width: 28px;\n    height: 28px;\n    display: grid;\n    place-items: center;\n    flex-shrink: 0;\n  }\n  .iftpl-widget .modal-format-text {\n    flex: 1;\n    min-width: 0;\n  }\n  .iftpl-widget .modal-format-name {\n    font-weight: 700;\n    font-size: 13.5px;\n  }\n  .iftpl-widget .modal-format-hint {\n    font-size: 11px;\n    color: var(--ink-faint);\n    margin-top: 2px;\n  }\n  .iftpl-widget .modal-format-arrow {\n    color: var(--ink-faint);\n    transition:\n      color 0.2s,\n      transform 0.2s;\n  }\n  .iftpl-widget .modal-format:hover .modal-format-arrow {\n    color: var(--brand);\n    transform: translateX(3px);\n  }\n  .iftpl-widget .modal-format:last-child:nth-child(odd) {\n    grid-column: 1 \/ -1;\n    justify-content: center;\n    gap: 20px;\n  }\n  .iftpl-widget .modal-format:last-child:nth-child(odd) .modal-format-text {\n    flex: 0 0 auto;\n  }\n  .iftpl-widget .modal-cta-stack {\n    display: flex;\n    flex-direction: column;\n    gap: 10px;\n    margin-top: auto;\n    padding-top: 20px;\n    border-top: 1px solid var(--line);\n  }\n  .iftpl-widget .modal-cta-stack .btn {\n    width: 100%;\n  }\n\n  \/* ===== STATS BAND ===== *\/\n  .iftpl-widget .stats {\n    background: var(--ink);\n    color: white;\n    padding: 64px 32px;\n    position: relative;\n    overflow: hidden;\n  }\n  .iftpl-widget .stats::before {\n    content: \"\";\n    position: absolute;\n    top: 0;\n    right: 0;\n    width: 60%;\n    height: 100%;\n    background: radial-gradient(\n      circle at top right,\n      var(--brand-500) 0%,\n      transparent 60%\n    );\n    opacity: 0.4;\n    pointer-events: none;\n  }\n  .iftpl-widget .stats-inner {\n    max-width: 1280px;\n    margin: 0 auto;\n    position: relative;\n    z-index: 1;\n  }\n  .iftpl-widget .stats-head {\n    text-align: center;\n    max-width: 720px;\n    margin: 0 auto 40px;\n  }\n  .iftpl-widget .stats-tag {\n    display: inline-block;\n    font-family: var(--font-mono);\n    font-size: 11px;\n    color: var(--brand-100);\n    letter-spacing: 0.1em;\n    text-transform: uppercase;\n    margin-bottom: 12px;\n    font-weight: 600;\n  }\n  .iftpl-widget .stats-head h2 {\n    font-size: clamp(28px, 4vw, 44px) !important;\n    line-height: 1.1;\n    letter-spacing: -0.02em;\n    font-weight: 800;\n    color: white;\n  }\n  .iftpl-widget .stats-grid {\n    display: grid;\n    grid-template-columns: repeat(4, 1fr);\n    gap: 24px;\n  }\n  .iftpl-widget .stat {\n    text-align: center;\n    padding: 24px 16px;\n    border-radius: var(--radius-lg);\n    background: rgba(255, 255, 255, 0.04);\n    border: 1px solid rgba(255, 255, 255, 0.08);\n    transition:\n      background-color 0.3s var(--ease),\n      border-color 0.3s var(--ease),\n      transform 0.3s var(--ease);\n  }\n  .iftpl-widget .stat:hover {\n    background: rgba(255, 255, 255, 0.07);\n    border-color: rgba(255, 255, 255, 0.15);\n    transform: translateY(-3px);\n  }\n  .iftpl-widget .stat-num {\n    font-size: clamp(36px, 5vw, 52px);\n    font-weight: 800;\n    color: white;\n    line-height: 1;\n    letter-spacing: -0.03em;\n    margin-bottom: 8px;\n  }\n  .iftpl-widget .stat-num .plus {\n    color: var(--brand-500);\n  }\n  .iftpl-widget .stat-label {\n    font-size: 13.5px;\n    color: rgba(255, 255, 255, 0.7);\n    font-weight: 600;\n  }\n\n  \/* ===== BEST PRACTICES ===== *\/\n  .iftpl-widget .bp {\n    background: var(--bg-soft);\n    border-top: 1px solid var(--line);\n    border-bottom: 1px solid var(--line);\n  }\n  .iftpl-widget .bp-inner {\n    max-width: 1280px;\n    margin: 0 auto;\n    padding: 96px 32px;\n    display: grid;\n    grid-template-columns: 0.92fr 1.08fr;\n    gap: 56px;\n    align-items: start;\n  }\n  \/* --- Left intro panel (dark) --- *\/\n  .iftpl-widget .bp-intro {\n    position: sticky;\n    top: 28px;\n    background:\n      radial-gradient(\n        ellipse 80% 70% at 90% 0%,\n        rgba(30, 94, 255, 0.5) 0%,\n        transparent 60%\n      ),\n      radial-gradient(\n        ellipse 70% 60% at 0% 100%,\n        rgba(0, 68, 187, 0.4) 0%,\n        transparent 60%\n      ),\n      var(--ink);\n    border-radius: 24px;\n    padding: 46px 40px;\n    overflow: hidden;\n    isolation: isolate;\n  }\n  .iftpl-widget .bp-intro::after {\n    content: \"\";\n    position: absolute;\n    inset: 0;\n    background-image:\n      linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px),\n      linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px);\n    background-size: 40px 40px;\n    mask-image: radial-gradient(ellipse 70% 70% at 70% 30%, #000 0%, transparent 75%);\n    z-index: -1;\n  }\n  .iftpl-widget .bp-tag {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    font-family: var(--font-mono);\n    font-size: 11px;\n    color: #bcd0ff;\n    letter-spacing: 0.12em;\n    text-transform: uppercase;\n    font-weight: 600;\n    background: rgba(255, 255, 255, 0.08);\n    border: 1px solid rgba(255, 255, 255, 0.14);\n    padding: 7px 14px;\n    border-radius: var(--radius-pill);\n    margin-bottom: 22px;\n  }\n  .iftpl-widget .bp-intro h2 {\n    font-size: clamp(28px, 3.4vw, 40px);\n    line-height: 1.12;\n    letter-spacing: -0.02em;\n    font-weight: 800;\n    color: #fff;\n    margin: 0 0 18px;\n  }\n  .iftpl-widget .bp-intro p {\n    color: rgba(255, 255, 255, 0.74);\n    font-size: 16px;\n    line-height: 1.65;\n    margin: 0;\n  }\n  \/* --- Right editorial index --- *\/\n  .iftpl-widget .bp-list {\n    position: relative;\n    counter-reset: bp;\n  }\n  .iftpl-widget .bp-item {\n    counter-increment: bp;\n    position: relative;\n    display: grid;\n    grid-template-columns: 68px 1fr;\n    gap: 26px;\n    align-items: start;\n    padding: 26px 24px 26px 20px;\n    border-radius: 16px;\n    transition: background 0.4s var(--ease);\n  }\n  \/* hairline divider under each entry (aligned with text column) *\/\n  .iftpl-widget .bp-item:not(:last-child)::after {\n    content: \"\";\n    position: absolute;\n    left: 114px;\n    right: 24px;\n    bottom: 0;\n    height: 1px;\n    background: var(--line);\n    transition: opacity 0.3s var(--ease);\n  }\n  \/* growing accent bar on the left edge *\/\n  .iftpl-widget .bp-item::before {\n    content: \"\";\n    position: absolute;\n    left: 0;\n    top: 50%;\n    transform: translateY(-50%) scaleY(0);\n    width: 3px;\n    height: 56%;\n    border-radius: 3px;\n    background: linear-gradient(180deg, var(--brand-500), var(--brand));\n    transition: transform 0.35s var(--ease);\n  }\n  \/* oversized outlined numeral *\/\n  .iftpl-widget .bp-num {\n    font-family: var(--font-mono);\n    font-size: 46px;\n    line-height: 0.9;\n    font-weight: 600;\n    letter-spacing: -0.03em;\n    color: transparent;\n    -webkit-text-stroke: 1.5px var(--brand-100);\n    transition:\n      -webkit-text-stroke 0.35s var(--ease),\n      transform 0.35s var(--ease);\n  }\n  .iftpl-widget .bp-num::before {\n    content: counter(bp, decimal-leading-zero);\n  }\n  .iftpl-widget .bp-kicker {\n    display: inline-flex;\n    align-items: center;\n    gap: 7px;\n    font-family: var(--font-mono);\n    font-size: 10.5px;\n    font-weight: 600;\n    letter-spacing: 0.14em;\n    text-transform: uppercase;\n    color: var(--brand);\n    margin-bottom: 9px;\n  }\n  .iftpl-widget .bp-kicker::before {\n    content: \"\";\n    width: 5px;\n    height: 5px;\n    border-radius: 50%;\n    background: var(--brand);\n  }\n  .iftpl-widget .bp-item h3 {\n    font-size: 17.5px;\n    font-weight: 700;\n    letter-spacing: -0.01em;\n    color: var(--ink);\n    margin: 0 0 8px;\n    transition: color 0.25s var(--ease);\n  }\n  .iftpl-widget .bp-item p {\n    font-size: 14.5px;\n    line-height: 1.6;\n    color: var(--ink-mute);\n    margin: 0;\n  }\n  \/* --- hover state --- *\/\n  .iftpl-widget .bp-item:hover {\n    background: var(--bg);\n    box-shadow: var(--shadow-md);\n  }\n  .iftpl-widget .bp-item:hover::before {\n    transform: translateY(-50%) scaleY(1);\n  }\n  .iftpl-widget .bp-item:hover::after {\n    opacity: 0;\n  }\n  .iftpl-widget .bp-item:hover .bp-num {\n    -webkit-text-stroke: 0 transparent;\n    background: linear-gradient(135deg, var(--brand-500) 0%, var(--brand) 100%);\n    -webkit-background-clip: text;\n    background-clip: text;\n    -webkit-text-fill-color: transparent;\n    transform: translateY(-1px);\n  }\n  .iftpl-widget .bp-item:hover h3 {\n    color: var(--brand);\n  }\n\n  \/* ===== HOW IT WORKS \u2014 3 steps ===== *\/\n  .iftpl-widget .how {\n    max-width: 1280px;\n    margin: 0 auto;\n    padding: 96px 32px;\n  }\n  .iftpl-widget .how-head {\n    text-align: center;\n    max-width: 720px;\n    margin: 0 auto 56px;\n  }\n  .iftpl-widget .how-tag {\n    display: inline-block;\n    font-family: var(--font-mono);\n    font-size: 11px;\n    color: var(--brand);\n    letter-spacing: 0.1em;\n    text-transform: uppercase;\n    margin-bottom: 14px;\n    font-weight: 600;\n  }\n  .iftpl-widget .how-head h2 {\n    font-size: clamp(28px, 4vw, 44px);\n    line-height: 1.1;\n    letter-spacing: -0.02em;\n    font-weight: 800;\n    color: var(--ink);\n    margin-bottom: 14px;\n  }\n  .iftpl-widget .how-head p {\n    color: var(--ink-mute);\n    font-size: 16.5px;\n    line-height: 1.55;\n  }\n  .iftpl-widget .how-grid {\n    display: grid;\n    grid-template-columns: repeat(3, 1fr);\n    gap: 60px;\n    position: relative;\n  }\n  \/* connector rail threading the steps, vertically centered (desktop) *\/\n  .iftpl-widget .how-grid::before {\n    content: \"\";\n    position: absolute;\n    top: 50%;\n    left: 7%;\n    right: 7%;\n    height: 2px;\n    background: repeating-linear-gradient(\n      90deg,\n      var(--brand-100) 0,\n      var(--brand-100) 7px,\n      transparent 7px,\n      transparent 14px\n    );\n    transform: translateY(-50%) scaleX(1);\n    transform-origin: left center;\n    z-index: 0;\n  }\n  .iftpl-widget .how-step {\n    background: linear-gradient(180deg, #ffffff 0%, #fafbfe 100%);\n    border: 1.5px solid var(--line);\n    border-radius: var(--radius-lg);\n    padding: 30px 30px 26px;\n    position: relative;\n    z-index: 1;\n    box-shadow: var(--shadow-sm);\n    transition:\n      border-color 0.3s var(--ease),\n      box-shadow 0.3s var(--ease),\n      transform 0.3s var(--ease);\n  }\n  \/* top accent that wipes in on hover *\/\n  .iftpl-widget .how-step::before {\n    content: \"\";\n    position: absolute;\n    top: -1.5px;\n    left: 26px;\n    right: 26px;\n    height: 3px;\n    border-radius: 0 0 3px 3px;\n    background: linear-gradient(90deg, var(--brand-500), var(--brand));\n    transform: scaleX(0);\n    transform-origin: left;\n    transition: transform 0.35s var(--ease);\n  }\n  \/* circular connector node pointing to the next step (desktop) *\/\n  .iftpl-widget .how-step:not(:last-child)::after {\n    content: \"\\203A\";\n    position: absolute;\n    top: 50%;\n    right: -46px;\n    transform: translateY(-50%);\n    width: 30px;\n    height: 30px;\n    border-radius: 50%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding-bottom: 2px;\n    background: linear-gradient(140deg, var(--brand-500), var(--brand));\n    color: #fff;\n    font-size: 18px;\n    font-weight: 800;\n    line-height: 1;\n    box-shadow:\n      0 6px 14px -4px rgba(0, 68, 187, 0.55),\n      inset 0 1px 0 rgba(255, 255, 255, 0.3);\n    z-index: 3;\n  }\n  .iftpl-widget .how-step:hover {\n    border-color: var(--brand);\n    box-shadow: var(--shadow-lg);\n    transform: translateY(-5px);\n  }\n  .iftpl-widget .how-step:hover::before {\n    transform: scaleX(1);\n  }\n  .iftpl-widget .how-step-top {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 14px;\n    margin-bottom: 22px;\n  }\n  .iftpl-widget .how-step-num {\n    font-family: var(--font-mono);\n    font-size: 12px;\n    font-weight: 700;\n    color: var(--brand);\n    background: var(--brand-50);\n    border: 1px solid var(--brand-100);\n    padding: 4px 11px;\n    border-radius: var(--radius-pill);\n    letter-spacing: 0.04em;\n  }\n  .iftpl-widget .how-step-icon {\n    width: 56px;\n    height: 56px;\n    background: linear-gradient(140deg, var(--brand-500) 0%, var(--brand) 100%);\n    color: white;\n    border-radius: var(--radius);\n    display: grid;\n    place-items: center;\n    box-shadow:\n      0 8px 18px -6px rgba(0, 68, 187, 0.5),\n      inset 0 1px 0 rgba(255, 255, 255, 0.25);\n    transition:\n      transform 0.3s var(--ease),\n      box-shadow 0.3s var(--ease);\n  }\n  .iftpl-widget .how-step:hover .how-step-icon {\n    transform: scale(1.07) rotate(-4deg);\n    box-shadow:\n      0 14px 28px -6px rgba(0, 68, 187, 0.7),\n      0 0 26px -2px rgba(30, 94, 255, 0.55),\n      inset 0 1px 0 rgba(255, 255, 255, 0.4);\n  }\n  .iftpl-widget .how-step-title {\n    font-size: 22px;\n    font-weight: 700;\n    letter-spacing: -0.01em;\n    margin-bottom: 10px;\n    color: var(--ink);\n  }\n  .iftpl-widget .how-step-text {\n    font-size: 14.5px;\n    line-height: 1.55;\n    color: var(--ink-mute);\n    min-height: 100px;\n  }\n  .iftpl-widget .how-step-time {\n    margin-top: 16px;\n    padding-top: 16px;\n    border-top: 1px solid var(--line-soft);\n    font-family: var(--font-mono);\n    font-size: 11px;\n    color: var(--ink-faint);\n    text-transform: uppercase;\n    letter-spacing: 0.04em;\n    font-weight: 600;\n    display: flex;\n    align-items: center;\n    gap: 6px;\n  }\n  .iftpl-widget .how-step-time::before {\n    content: \"\";\n    width: 8px;\n    height: 8px;\n    background: var(--green);\n    border-radius: 50%;\n  }\n  \/* rail draws itself in as the section scrolls into view *\/\n  @supports (animation-timeline: view()) {\n    @media (prefers-reduced-motion: no-preference) {\n      .iftpl-widget .how-grid::before {\n        animation: iftpl-how-draw linear both;\n        animation-timeline: view();\n        animation-range: entry 10% cover 38%;\n      }\n    }\n  }\n  @keyframes iftpl-how-draw {\n    from {\n      transform: translateY(-50%) scaleX(0);\n    }\n    to {\n      transform: translateY(-50%) scaleX(1);\n    }\n  }\n  \/* connector nodes emit a soft radar pulse *\/\n  @media (prefers-reduced-motion: no-preference) {\n    .iftpl-widget .how-step:not(:last-child)::after {\n      animation: iftpl-how-node 2.6s ease-out infinite;\n    }\n    .iftpl-widget .how-step:nth-child(2)::after {\n      animation-delay: 1.3s;\n    }\n  }\n  @keyframes iftpl-how-node {\n    0% {\n      box-shadow:\n        0 6px 14px -4px rgba(0, 68, 187, 0.55),\n        0 0 0 0 rgba(30, 94, 255, 0.5),\n        inset 0 1px 0 rgba(255, 255, 255, 0.3);\n    }\n    70% {\n      box-shadow:\n        0 6px 14px -4px rgba(0, 68, 187, 0.55),\n        0 0 0 13px rgba(30, 94, 255, 0),\n        inset 0 1px 0 rgba(255, 255, 255, 0.3);\n    }\n    100% {\n      box-shadow:\n        0 6px 14px -4px rgba(0, 68, 187, 0.55),\n        0 0 0 0 rgba(30, 94, 255, 0),\n        inset 0 1px 0 rgba(255, 255, 255, 0.3);\n    }\n  }\n\n  \/* ===== KEY SECTIONS ===== *\/\n  .iftpl-widget .key-sections {\n    padding: 0 24px 96px;\n    background: var(--bg);\n  }\n  .iftpl-widget .key-sections-inner {\n    max-width: 1100px;\n    margin: 0 auto;\n  }\n  .iftpl-widget .key-sections-head {\n    text-align: center;\n    margin-bottom: 56px;\n  }\n  .iftpl-widget .key-sections-head h2 {\n    font-size: clamp(32px, 5vw, 52px);\n    line-height: 1.1;\n    letter-spacing: -0.02em;\n    font-weight: 800;\n    color: var(--ink);\n    margin-bottom: 20px;\n  }\n  .iftpl-widget .key-sections-head h2 .hi { color: var(--brand); }\n  .iftpl-widget .key-sections-head p {\n    font-size: 17px;\n    line-height: 1.65;\n    color: var(--ink-mute);\n    max-width: 680px;\n    margin: 0 auto;\n  }\n  .iftpl-widget .key-sections-layout {\n    background: var(--bg-soft);\n    border-radius: 20px;\n    padding: 48px 32px;\n    display: grid;\n    grid-template-columns: 1fr 420px 1fr;\n    gap: 40px;\n    align-items: center;\n  }\n  .iftpl-widget .ks-items {\n    display: flex;\n    flex-direction: column;\n    gap: 28px;\n  }\n  .iftpl-widget .ks-item {\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    text-align: center;\n    gap: 8px;\n  }\n  .iftpl-widget .ks-num {\n    width: 36px;\n    height: 36px;\n    border-radius: 50%;\n    background: var(--brand);\n    color: white;\n    font-size: 14px;\n    font-weight: 700;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n  }\n  .iftpl-widget .ks-item strong {\n    display: block;\n    font-size: 14px;\n    font-weight: 700;\n    color: var(--ink);\n    line-height: 1.3;\n  }\n  .iftpl-widget .ks-item span {\n    font-size: 13px;\n    line-height: 1.55;\n    color: var(--ink-mute);\n  }\n  .iftpl-widget .ks-doc {\n    background: white;\n    border-radius: 12px;\n    box-shadow: var(--shadow-lg);\n    overflow: hidden;\n  }\n  .iftpl-widget .ks-doc img {\n    width: 100%;\n    height: auto;\n    display: block;\n  }\n\n  \/* ===== APP FEATURES ===== *\/\n  .iftpl-widget .features {\n    background: var(--bg-soft);\n    padding: 96px 32px;\n  }\n  .iftpl-widget .features-inner {\n    max-width: 1280px;\n    margin: 0 auto;\n    display: grid;\n    grid-template-columns: 1fr 1.1fr;\n    gap: 80px;\n    align-items: center;\n  }\n  .iftpl-widget .features-content {\n    max-width: 540px;\n  }\n  .iftpl-widget .features-content > .btn {\n    display: block;\n    width: fit-content;\n    margin: 0 auto;\n  }\n  .iftpl-widget .features-tag {\n    display: inline-block;\n    font-family: var(--font-mono);\n    font-size: 11px;\n    color: var(--brand);\n    letter-spacing: 0.1em;\n    text-transform: uppercase;\n    margin-bottom: 14px;\n    font-weight: 600;\n  }\n  .iftpl-widget .features-h2 {\n    font-size: clamp(28px, 4vw, 44px);\n    line-height: 1.1;\n    letter-spacing: -0.02em;\n    font-weight: 800;\n    color: var(--ink);\n    margin-bottom: 16px;\n  }\n  .iftpl-widget .features-lead {\n    font-size: 16.5px;\n    color: var(--ink-mute);\n    line-height: 1.55;\n    margin-bottom: 28px;\n  }\n  .iftpl-widget .features-list {\n    margin-bottom: 28px;\n  }\n  .iftpl-widget .feature-item {\n    display: flex;\n    gap: 14px;\n    padding: 14px 0;\n    border-bottom: 1px solid var(--line);\n  }\n  .iftpl-widget .feature-item:last-child {\n    border-bottom: none;\n  }\n  .iftpl-widget .feature-icon {\n    width: 32px;\n    height: 32px;\n    background: var(--brand);\n    color: white;\n    border-radius: 8px;\n    display: grid;\n    place-items: center;\n    flex-shrink: 0;\n  }\n  .iftpl-widget .feature-text {\n    padding-top: 4px;\n  }\n  .iftpl-widget .feature-text strong {\n    display: block;\n    font-size: 15px;\n    font-weight: 700;\n    color: var(--ink);\n    margin-bottom: 3px;\n  }\n  .iftpl-widget .feature-text span {\n    font-size: 13.5px;\n    color: var(--ink-mute);\n    line-height: 1.5;\n  }\n\n  \/* App visual: device frame *\/\n  .iftpl-widget .features-visual {\n    position: relative;\n    height: 540px;\n  }\n  .iftpl-widget .phone {\n    position: absolute;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%) rotate(0deg);\n    width: 420px;\n    transition: transform 0.5s var(--ease);\n    line-height: 0;\n  }\n  .iftpl-widget .phone img {\n    width: 100%;\n    height: auto;\n    display: block;\n  }\n  .iftpl-widget .phone:hover {\n    transform: translate(-50%, -50%) rotate(-2deg);\n  }\n  .iftpl-widget .phone-screen {\n    width: 100%;\n    height: 100%;\n    background: white;\n    border-radius: 28px;\n    padding: 22px 18px;\n    overflow: hidden;\n    display: flex;\n    flex-direction: column;\n    gap: 12px;\n  }\n  .iftpl-widget .phone-bar {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding-bottom: 12px;\n    border-bottom: 1px solid var(--line-soft);\n  }\n  .iftpl-widget .phone-bar-title {\n    font-size: 13px;\n    font-weight: 800;\n  }\n  .iftpl-widget .phone-bar-dot {\n    width: 22px;\n    height: 22px;\n    background: var(--brand);\n    border-radius: 6px;\n  }\n  .iftpl-widget .phone-card {\n    padding: 12px;\n    background: var(--bg-soft);\n    border-radius: 10px;\n    display: flex;\n    flex-direction: column;\n    gap: 6px;\n  }\n  .iftpl-widget .phone-line {\n    height: 6px;\n    background: var(--bg-tint);\n    border-radius: 3px;\n  }\n  .iftpl-widget .phone-line.w60 {\n    width: 60%;\n  }\n  .iftpl-widget .phone-line.w80 {\n    width: 80%;\n  }\n  .iftpl-widget .phone-row {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 7px 0;\n    font-size: 10px;\n    color: var(--ink-mute);\n  }\n  .iftpl-widget .phone-row strong {\n    font-weight: 700;\n    color: var(--ink);\n  }\n  .iftpl-widget .phone-total {\n    background: var(--brand);\n    color: white;\n    padding: 14px;\n    border-radius: 10px;\n    margin-top: auto;\n  }\n  .iftpl-widget .phone-total-lbl {\n    font-family: var(--font-mono);\n    font-size: 9px;\n    opacity: 0.7;\n    text-transform: uppercase;\n    letter-spacing: 0.06em;\n  }\n  .iftpl-widget .phone-total-amt {\n    font-size: 22px;\n    font-weight: 800;\n    margin-top: 2px;\n  }\n  .iftpl-widget .phone-cta {\n    text-align: center;\n    background: var(--ink);\n    color: white;\n    border-radius: 8px;\n    padding: 10px;\n    font-size: 11px;\n    font-weight: 700;\n  }\n  \/* Floating badges over the phone *\/\n  .iftpl-widget .phone-badge {\n    position: absolute;\n    background: white;\n    border-radius: var(--radius-pill);\n    padding: 10px 14px;\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    box-shadow: var(--shadow-lg);\n    font-size: 12.5px;\n    font-weight: 700;\n    z-index: 2;\n    border: 1px solid var(--line);\n  }\n  .iftpl-widget .phone-badge .ic {\n    width: 22px;\n    height: 22px;\n    border-radius: 50%;\n    display: grid;\n    place-items: center;\n    color: white;\n    flex-shrink: 0;\n  }\n  .iftpl-widget .phone-badge-1 {\n    top: 14%;\n    left: 8%;\n    animation: iftpl-float 4s ease-in-out infinite;\n  }\n  .iftpl-widget .phone-badge-1 .ic {\n    background: var(--green);\n  }\n  .iftpl-widget .phone-badge-2 {\n    bottom: 18%;\n    right: 4%;\n    animation: iftpl-float 4s ease-in-out infinite reverse;\n    animation-delay: -1s;\n  }\n  .iftpl-widget .phone-badge-2 .ic {\n    background: var(--brand);\n  }\n  @keyframes iftpl-float {\n    0%,\n    100% {\n      transform: translateY(0);\n    }\n    50% {\n      transform: translateY(-8px);\n    }\n  }\n\n  \/* ===== TEMPLATE VS SOFTWARE ===== *\/\n  .iftpl-widget .vs {\n    max-width: 1280px;\n    margin: 0 auto;\n    padding: 96px 32px;\n  }\n  .iftpl-widget .vs-head {\n    max-width: 760px;\n    margin: 0 auto 56px;\n    text-align: center;\n  }\n  .iftpl-widget .vs-tag {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    font-family: var(--font-mono);\n    font-size: 11px;\n    color: var(--brand);\n    letter-spacing: 0.12em;\n    text-transform: uppercase;\n    font-weight: 600;\n    background: var(--brand-50);\n    border: 1px solid var(--brand-100);\n    padding: 7px 14px;\n    border-radius: var(--radius-pill);\n    margin-bottom: 20px;\n  }\n  .iftpl-widget .vs-head h2 {\n    font-size: clamp(28px, 4vw, 44px);\n    line-height: 1.12;\n    letter-spacing: -0.02em;\n    font-weight: 800;\n    color: var(--ink);\n    margin: 0 0 18px;\n  }\n  .iftpl-widget .vs-head p {\n    color: var(--ink-mute);\n    font-size: 16.5px;\n    line-height: 1.65;\n    margin: 0 0 12px;\n  }\n  .iftpl-widget .vs-head p:last-child {\n    margin-bottom: 0;\n  }\n  .iftpl-widget .vs-head strong {\n    color: var(--ink);\n    font-weight: 700;\n  }\n  \/* dark \"software showcase\" panel holding glass cards *\/\n  .iftpl-widget .vs-grid {\n    position: relative;\n    display: grid;\n    grid-template-columns: repeat(2, 1fr);\n    gap: 18px;\n    counter-reset: vs;\n    padding: 26px;\n    border-radius: 28px;\n    overflow: hidden;\n    isolation: isolate;\n    background:\n      radial-gradient(\n        ellipse 60% 60% at 88% 0%,\n        rgba(30, 94, 255, 0.45) 0%,\n        transparent 60%\n      ),\n      radial-gradient(\n        ellipse 55% 55% at 5% 100%,\n        rgba(0, 68, 187, 0.4) 0%,\n        transparent 60%\n      ),\n      var(--ink);\n    box-shadow: var(--shadow-lg);\n  }\n  \/* faint grid texture, masked toward the top-right glow *\/\n  .iftpl-widget .vs-grid::before {\n    content: \"\";\n    position: absolute;\n    inset: 0;\n    background-image:\n      linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),\n      linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);\n    background-size: 46px 46px;\n    mask-image: radial-gradient(\n      ellipse 80% 80% at 75% 15%,\n      #000 0%,\n      transparent 70%\n    );\n    -webkit-mask-image: radial-gradient(\n      ellipse 80% 80% at 75% 15%,\n      #000 0%,\n      transparent 70%\n    );\n    z-index: -1;\n    pointer-events: none;\n  }\n  .iftpl-widget .vs-card {\n    counter-increment: vs;\n    position: relative;\n    overflow: hidden;\n    background: rgba(255, 255, 255, 0.045);\n    border: 1px solid rgba(255, 255, 255, 0.1);\n    border-radius: 18px;\n    padding: 32px 30px;\n    -webkit-backdrop-filter: blur(10px);\n    backdrop-filter: blur(10px);\n    transition:\n      transform 0.35s var(--ease),\n      background 0.35s var(--ease),\n      border-color 0.35s var(--ease),\n      box-shadow 0.35s var(--ease);\n  }\n  \/* large monospace index watermark *\/\n  .iftpl-widget .vs-card::before {\n    content: counter(vs, decimal-leading-zero);\n    position: absolute;\n    top: 20px;\n    right: 24px;\n    font-family: var(--font-mono);\n    font-size: 34px;\n    font-weight: 600;\n    line-height: 1;\n    letter-spacing: -0.02em;\n    color: rgba(255, 255, 255, 0.07);\n    transition: color 0.35s var(--ease);\n  }\n  \/* top sheen line + focused spotlight that bloom on hover *\/\n  .iftpl-widget .vs-card::after {\n    content: \"\";\n    position: absolute;\n    inset: 0;\n    border-radius: inherit;\n    pointer-events: none;\n    background:\n      linear-gradient(\n          90deg,\n          transparent 0%,\n          rgba(140, 175, 255, 0.95) 50%,\n          transparent 100%\n        )\n        top \/ 100% 2px no-repeat,\n      radial-gradient(\n        130% 90% at 50% -25%,\n        rgba(120, 160, 255, 0.2) 0%,\n        transparent 58%\n      );\n    opacity: 0;\n    transition: opacity 0.4s var(--ease);\n  }\n  .iftpl-widget .vs-card:hover {\n    transform: translateY(-6px);\n    background: rgba(255, 255, 255, 0.08);\n    border-color: rgba(120, 160, 255, 0.45);\n    box-shadow: 0 24px 48px -16px rgba(0, 0, 0, 0.6);\n  }\n  .iftpl-widget .vs-card:hover::before {\n    color: rgba(140, 175, 255, 0.22);\n  }\n  .iftpl-widget .vs-card:hover::after {\n    opacity: 1;\n  }\n  .iftpl-widget .vs-icon {\n    position: relative;\n    width: 54px;\n    height: 54px;\n    display: grid;\n    place-items: center;\n    border-radius: 15px;\n    background: linear-gradient(140deg, var(--brand-500) 0%, var(--brand) 100%);\n    color: #fff;\n    box-shadow:\n      0 10px 24px -6px rgba(0, 68, 187, 0.7),\n      inset 0 1px 0 rgba(255, 255, 255, 0.3);\n    margin-bottom: 22px;\n    transition:\n      transform 0.35s var(--ease),\n      box-shadow 0.35s var(--ease);\n  }\n  .iftpl-widget .vs-card:hover .vs-icon {\n    transform: scale(1.08) rotate(-5deg);\n    box-shadow:\n      0 14px 30px -6px rgba(0, 68, 187, 0.85),\n      0 0 28px -2px rgba(30, 94, 255, 0.65),\n      inset 0 1px 0 rgba(255, 255, 255, 0.4);\n  }\n  .iftpl-widget .vs-card h3 {\n    font-size: 18.5px;\n    font-weight: 700;\n    letter-spacing: -0.01em;\n    color: #fff;\n    margin: 0 0 10px;\n    padding-right: 40px;\n  }\n  .iftpl-widget .vs-card p {\n    font-size: 14.5px;\n    line-height: 1.65;\n    color: rgba(255, 255, 255, 0.72);\n    margin: 0;\n  }\n  \/* app-window chrome bar across the top of the panel *\/\n  .iftpl-widget .vs-bar {\n    grid-column: 1 \/ -1;\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding: 2px 6px 18px;\n    margin-bottom: 6px;\n    border-bottom: 1px solid rgba(255, 255, 255, 0.08);\n  }\n  .iftpl-widget .vs-dots {\n    display: inline-flex;\n    gap: 7px;\n  }\n  .iftpl-widget .vs-dots i {\n    width: 11px;\n    height: 11px;\n    border-radius: 50%;\n    background: rgba(255, 255, 255, 0.16);\n  }\n  .iftpl-widget .vs-dots i:first-child {\n    background: rgba(140, 175, 255, 0.55);\n  }\n  .iftpl-widget .vs-bar-title {\n    font-family: var(--font-mono);\n    font-size: 12px;\n    letter-spacing: 0.02em;\n    color: rgba(255, 255, 255, 0.45);\n  }\n  .iftpl-widget .vs-live {\n    margin-left: auto;\n    display: inline-flex;\n    align-items: center;\n    gap: 7px;\n    font-family: var(--font-mono);\n    font-size: 10px;\n    font-weight: 600;\n    letter-spacing: 0.16em;\n    text-transform: uppercase;\n    color: #6ee7a8;\n  }\n  .iftpl-widget .vs-live::before {\n    content: \"\";\n    width: 7px;\n    height: 7px;\n    border-radius: 50%;\n    background: #34d27e;\n    box-shadow: 0 0 0 0 rgba(52, 210, 126, 0.6);\n    animation: iftpl-vs-pulse 2s ease-out infinite;\n  }\n  @keyframes iftpl-vs-pulse {\n    0% {\n      box-shadow: 0 0 0 0 rgba(52, 210, 126, 0.55);\n    }\n    70% {\n      box-shadow: 0 0 0 7px rgba(52, 210, 126, 0);\n    }\n    100% {\n      box-shadow: 0 0 0 0 rgba(52, 210, 126, 0);\n    }\n  }\n  \/* scroll-driven staggered reveal (progressive enhancement, CSS-only) *\/\n  .iftpl-widget .vs-cell {\n    display: flex;\n  }\n  .iftpl-widget .vs-cell > .vs-card {\n    flex: 1;\n  }\n  @supports (animation-timeline: view()) {\n    @media (prefers-reduced-motion: no-preference) {\n      .iftpl-widget .vs-cell {\n        animation: iftpl-vs-rise linear both;\n        animation-timeline: view();\n        animation-range: entry 0% cover 26%;\n      }\n    }\n  }\n  @keyframes iftpl-vs-rise {\n    from {\n      opacity: 0;\n      transform: translateY(28px);\n    }\n    to {\n      opacity: 1;\n      transform: translateY(0);\n    }\n  }\n\n  \/* ===== AI ESTIMATE GENERATOR ===== *\/\n  .iftpl-widget .aigen {\n    position: relative;\n    overflow: hidden;\n    background:\n      radial-gradient(\n        ellipse 50% 60% at 88% 12%,\n        rgba(30, 94, 255, 0.1) 0%,\n        transparent 60%\n      ),\n      var(--bg-soft);\n    border-top: 1px solid var(--line);\n    border-bottom: 1px solid var(--line);\n  }\n  .iftpl-widget .aigen-inner {\n    max-width: 1280px;\n    margin: 0 auto;\n    padding: 96px 32px;\n    display: grid;\n    grid-template-columns: 1.04fr 0.96fr;\n    gap: 64px;\n    align-items: center;\n  }\n  .iftpl-widget .aigen-tag {\n    display: inline-flex;\n    align-items: center;\n    gap: 8px;\n    font-family: var(--font-mono);\n    font-size: 11px;\n    color: var(--brand);\n    letter-spacing: 0.12em;\n    text-transform: uppercase;\n    font-weight: 600;\n    background: var(--brand-50);\n    border: 1px solid var(--brand-100);\n    padding: 7px 14px;\n    border-radius: var(--radius-pill);\n    margin-bottom: 22px;\n  }\n  .iftpl-widget .aigen-tag svg {\n    width: 13px;\n    height: 13px;\n  }\n  .iftpl-widget .aigen-text h2 {\n    font-size: clamp(28px, 4vw, 44px);\n    line-height: 1.12;\n    letter-spacing: -0.02em;\n    font-weight: 800;\n    color: var(--ink);\n    margin: 0 0 18px;\n  }\n  .iftpl-widget .aigen-text > p {\n    color: var(--ink-mute);\n    font-size: 16px;\n    line-height: 1.65;\n    margin: 0 0 14px;\n    max-width: 520px;\n  }\n  .iftpl-widget .aigen-list {\n    list-style: none;\n    margin: 26px 0 32px;\n    padding: 0;\n    display: grid;\n    grid-template-columns: repeat(2, 1fr);\n    gap: 14px 22px;\n  }\n  .iftpl-widget .aigen-list li {\n    display: flex;\n    align-items: center;\n    gap: 11px;\n    font-size: 14.5px;\n    font-weight: 600;\n    color: var(--ink-soft);\n  }\n  .iftpl-widget .aigen-list li span {\n    flex-shrink: 0;\n    width: 24px;\n    height: 24px;\n    display: grid;\n    place-items: center;\n    border-radius: 7px;\n    background: var(--brand-50);\n    color: var(--brand);\n  }\n  .iftpl-widget .aigen-list li span svg {\n    width: 13px;\n    height: 13px;\n  }\n  \/* --- the \"AI autofilling\" estimate mock --- *\/\n  .iftpl-widget .aigen-visual {\n    position: relative;\n    display: flex;\n    justify-content: center;\n  }\n  .iftpl-widget .aigen-visual::before {\n    content: \"\";\n    position: absolute;\n    width: 380px;\n    height: 380px;\n    top: 50%;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    background: radial-gradient(\n      circle,\n      rgba(30, 94, 255, 0.22) 0%,\n      transparent 65%\n    );\n    filter: blur(10px);\n    z-index: 0;\n    pointer-events: none;\n  }\n  .iftpl-widget .aigen-mock {\n    position: relative;\n    z-index: 1;\n    width: 100%;\n    max-width: 400px;\n    background: var(--bg);\n    border: 1px solid var(--line);\n    border-radius: 22px;\n    box-shadow: var(--shadow-lg);\n    padding: 26px 26px 28px;\n  }\n  .iftpl-widget .aigen-mock-head {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding-bottom: 18px;\n    border-bottom: 1px solid var(--line-soft);\n    margin-bottom: 20px;\n  }\n  .iftpl-widget .aigen-logo {\n    width: 34px;\n    height: 34px;\n    border-radius: 9px;\n    background: linear-gradient(140deg, var(--brand-500), var(--brand));\n    box-shadow: 0 6px 14px -4px rgba(0, 68, 187, 0.5);\n  }\n  .iftpl-widget .aigen-docid {\n    font-family: var(--font-mono);\n    font-size: 12px;\n    color: var(--ink-faint);\n    letter-spacing: 0.02em;\n  }\n  .iftpl-widget .aigen-docid b {\n    display: block;\n    font-size: 14px;\n    font-weight: 700;\n    color: var(--ink);\n    letter-spacing: -0.01em;\n  }\n  .iftpl-widget .aigen-status {\n    margin-left: auto;\n    display: inline-flex;\n    align-items: center;\n    gap: 6px;\n    font-family: var(--font-mono);\n    font-size: 9.5px;\n    font-weight: 600;\n    letter-spacing: 0.12em;\n    text-transform: uppercase;\n    color: var(--brand);\n    background: var(--brand-50);\n    border: 1px solid var(--brand-100);\n    border-radius: var(--radius-pill);\n    padding: 5px 9px;\n  }\n  .iftpl-widget .aigen-status svg {\n    width: 11px;\n    height: 11px;\n  }\n  .iftpl-widget .aigen-field {\n    margin-bottom: 16px;\n  }\n  .iftpl-widget .aigen-field-label {\n    font-family: var(--font-mono);\n    font-size: 9.5px;\n    font-weight: 600;\n    letter-spacing: 0.1em;\n    text-transform: uppercase;\n    color: var(--ink-faint);\n    margin-bottom: 8px;\n  }\n  .iftpl-widget .aigen-bar {\n    height: 11px;\n    border-radius: 6px;\n    background: var(--bg-tint);\n  }\n  .iftpl-widget .aigen-bar + .aigen-bar {\n    margin-top: 8px;\n    width: 72%;\n  }\n  \/* shimmering bars = AI writing the values *\/\n  .iftpl-widget .aigen-bar.is-ai {\n    background: linear-gradient(\n      90deg,\n      var(--brand-100) 0%,\n      var(--brand-500) 35%,\n      var(--brand-100) 70%\n    );\n    background-size: 220% 100%;\n    animation: iftpl-aigen-shimmer 2.2s linear infinite;\n  }\n  @keyframes iftpl-aigen-shimmer {\n    from {\n      background-position: 140% 0;\n    }\n    to {\n      background-position: -80% 0;\n    }\n  }\n  .iftpl-widget .aigen-total {\n    display: flex;\n    align-items: baseline;\n    justify-content: space-between;\n    margin-top: 22px;\n    padding-top: 18px;\n    border-top: 1px dashed var(--line);\n  }\n  .iftpl-widget .aigen-total span {\n    font-family: var(--font-mono);\n    font-size: 10.5px;\n    font-weight: 600;\n    letter-spacing: 0.1em;\n    text-transform: uppercase;\n    color: var(--ink-faint);\n  }\n  .iftpl-widget .aigen-total b {\n    font-size: 26px;\n    font-weight: 800;\n    letter-spacing: -0.02em;\n    color: var(--ink);\n  }\n  \/* floating AI chip overlapping the card corner *\/\n  .iftpl-widget .aigen-chip {\n    position: absolute;\n    top: -16px;\n    right: -10px;\n    z-index: 2;\n    display: inline-flex;\n    align-items: center;\n    gap: 7px;\n    font-size: 12px;\n    font-weight: 700;\n    color: #fff;\n    background: linear-gradient(135deg, var(--brand-500), var(--brand));\n    border-radius: var(--radius-pill);\n    padding: 9px 14px;\n    box-shadow: 0 12px 26px -6px rgba(0, 68, 187, 0.6);\n    animation: iftpl-aigen-float 3.4s ease-in-out infinite;\n  }\n  .iftpl-widget .aigen-chip svg {\n    width: 14px;\n    height: 14px;\n  }\n  @keyframes iftpl-aigen-float {\n    0%,\n    100% {\n      transform: translateY(0);\n    }\n    50% {\n      transform: translateY(-7px);\n    }\n  }\n  @media (prefers-reduced-motion: reduce) {\n    .iftpl-widget .aigen-bar.is-ai {\n      animation: none;\n    }\n    .iftpl-widget .aigen-chip {\n      animation: none;\n    }\n  }\n\n  \/* ===== TESTIMONIALS ===== *\/\n  .iftpl-widget .quotes {\n    max-width: 1280px;\n    margin: 0 auto;\n    padding: 96px 32px;\n  }\n  .iftpl-widget .quotes-head {\n    text-align: center;\n    max-width: 720px;\n    margin: 0 auto 56px;\n  }\n  .iftpl-widget .quotes-head h2 {\n    font-size: clamp(28px, 4vw, 44px);\n    line-height: 1.1;\n    letter-spacing: -0.02em;\n    font-weight: 800;\n    color: var(--ink);\n    margin-bottom: 16px;\n  }\n  .iftpl-widget .quotes-grid {\n    display: grid;\n    grid-template-columns: repeat(3, 1fr);\n    gap: 20px;\n  }\n  .iftpl-widget .quote {\n    background: white;\n    border: 1.5px solid var(--line);\n    border-radius: var(--radius-lg);\n    padding: 28px;\n    display: flex;\n    flex-direction: column;\n    transition:\n      border-color 0.3s var(--ease),\n      box-shadow 0.3s var(--ease),\n      transform 0.3s var(--ease);\n  }\n  .iftpl-widget .quote:hover {\n    border-color: var(--brand);\n    box-shadow: var(--shadow-lg);\n    transform: translateY(-4px);\n  }\n  .iftpl-widget .quote-stars {\n    color: #ffb800;\n    display: flex;\n    gap: 1px;\n    margin-bottom: 16px;\n  }\n  .iftpl-widget .quote-text {\n    font-size: 15.5px;\n    line-height: 1.55;\n    color: var(--ink);\n    margin-bottom: 20px;\n    font-weight: 500;\n    flex: 1;\n  }\n  .iftpl-widget .quote-author {\n    display: flex;\n    align-items: center;\n    gap: 12px;\n    padding-top: 18px;\n    border-top: 1px solid var(--line);\n  }\n  .iftpl-widget .quote-avatar {\n    width: 44px;\n    height: 44px;\n    border-radius: 50%;\n    background: var(--brand);\n    color: white;\n    display: grid;\n    place-items: center;\n    font-weight: 800;\n    font-size: 16px;\n    flex-shrink: 0;\n  }\n  .iftpl-widget .quote-name {\n    font-weight: 700;\n    font-size: 14px;\n    color: var(--ink);\n  }\n  .iftpl-widget .quote-role {\n    font-size: 12.5px;\n    color: var(--ink-faint);\n    margin-top: 2px;\n  }\n\n  \/* ===== FAQ ===== *\/\n  .iftpl-widget .faq {\n    background: var(--bg-soft);\n    padding: 96px 32px;\n  }\n  .iftpl-widget .faq-inner {\n    max-width: 920px;\n    margin: 0 auto;\n  }\n  .iftpl-widget .faq-head {\n    text-align: center;\n    margin-bottom: 48px;\n  }\n  .iftpl-widget .faq-head h2 {\n    font-size: clamp(28px, 4vw, 44px);\n    line-height: 1.1;\n    letter-spacing: -0.02em;\n    font-weight: 800;\n    color: var(--ink);\n    margin-bottom: 12px;\n  }\n  .iftpl-widget .faq-head p {\n    color: var(--ink-mute);\n    font-size: 16px;\n  }\n  .iftpl-widget .faq-list {\n    background: white;\n    border-radius: var(--radius-lg);\n    border: 1.5px solid var(--line);\n    overflow: hidden;\n  }\n  .iftpl-widget .faq-item {\n    border-bottom: 1px solid var(--line);\n  }\n  .iftpl-widget .faq-item:last-child {\n    border-bottom: none;\n  }\n  .iftpl-widget .faq-q {\n    padding: 22px 28px;\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    cursor: pointer;\n    font-size: 16px;\n    font-weight: 700;\n    letter-spacing: -0.005em;\n    transition: color 0.2s;\n    user-select: none;\n    color: var(--ink);\n    gap: 24px;\n  }\n  .iftpl-widget .faq-q:hover {\n    color: var(--brand);\n  }\n  .iftpl-widget .faq-icon {\n    width: 28px;\n    height: 28px;\n    border: 1.5px solid var(--line);\n    border-radius: 50%;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    transition:\n      background-color 0.3s,\n      border-color 0.3s,\n      color 0.3s,\n      transform 0.3s;\n    color: var(--ink-mute);\n  }\n  .iftpl-widget .faq-item.open .faq-icon {\n    background: var(--brand);\n    color: white;\n    border-color: var(--brand);\n    transform: rotate(45deg);\n  }\n  .iftpl-widget .faq-a {\n    max-height: 0;\n    overflow: hidden;\n    transition:\n      max-height 0.4s ease,\n      padding 0.4s ease;\n    color: var(--ink-mute);\n    font-size: 14.5px;\n    line-height: 1.65;\n    padding: 0 28px;\n  }\n  .iftpl-widget .faq-item.open .faq-a {\n    max-height: 600px;\n    padding: 0 28px 24px;\n  }\n  .iftpl-widget .faq-a strong {\n    color: var(--ink);\n    font-weight: 700;\n  }\n\n  \/* ===== FINAL CTA ===== *\/\n  .iftpl-widget .final-cta {\n    max-width: 1280px;\n    margin: 0 auto;\n    padding: 96px 32px;\n  }\n  .iftpl-widget .final-cta-wrap {\n    background: var(--brand);\n    color: white;\n    border-radius: 24px;\n    padding: 72px 56px;\n    position: relative;\n    overflow: hidden;\n    text-align: center;\n  }\n  .iftpl-widget .final-cta-wrap::before {\n    content: \"\";\n    position: absolute;\n    top: -50%;\n    right: -10%;\n    width: 70%;\n    height: 200%;\n    background: radial-gradient(circle, var(--brand-500) 0%, transparent 60%);\n    opacity: 0.5;\n    pointer-events: none;\n  }\n  .iftpl-widget .final-cta-wrap::after {\n    content: \"\";\n    position: absolute;\n    bottom: -60px;\n    left: -60px;\n    width: 320px;\n    height: 320px;\n    background: radial-gradient(circle, var(--safety) 0%, transparent 70%);\n    opacity: 0.2;\n    pointer-events: none;\n  }\n  .iftpl-widget .final-cta-content {\n    position: relative;\n    z-index: 1;\n    max-width: 760px;\n    margin: 0 auto;\n  }\n  .iftpl-widget .final-cta-content h2 {\n    font-size: clamp(32px, 4.8vw, 56px) !important;\n    color: white;\n    line-height: 1.05;\n    letter-spacing: -0.02em;\n    font-weight: 800;\n    margin-bottom: 20px;\n  }\n  .iftpl-widget .final-cta-content p {\n    font-size: 17px;\n    line-height: 1.5;\n    color: rgba(255, 255, 255, 0.9);\n    margin-bottom: 32px;\n  }\n  .iftpl-widget .final-cta-ctas {\n    display: flex;\n    gap: 12px;\n    flex-wrap: wrap;\n    justify-content: center;\n  }\n  .iftpl-widget .final-cta .btn-primary {\n    background: white;\n    color: var(--brand) !important;\n    border-color: white;\n    box-shadow: 0 16px 40px -8px rgba(0, 0, 0, 0.3);\n  }\n  .iftpl-widget .final-cta .btn-primary:hover {\n    background: var(--ink);\n    color: white !important;\n    border-color: var(--ink);\n  }\n  .iftpl-widget .final-cta .btn-outline {\n    background: transparent;\n    color: white;\n    border-color: rgba(255, 255, 255, 0.3);\n  }\n  .iftpl-widget .final-cta .btn-outline:hover {\n    background: rgba(255, 255, 255, 0.1);\n    border-color: white;\n  }\n\n  \/* ===== STICKY BAR ===== *\/\n  \/* The global menu sets `html,body { overflow-x: hidden }` which breaks sticky\n     positioning because body becomes a scroll container. We use clip on both\n     html and body \u2014 it prevents horizontal overflow without creating a scroll\n     context that would break position:sticky. *\/\n  html {\n    overflow-x: clip;\n  }\n  body {\n    overflow-x: clip;\n    overflow-y: visible;\n  }\n\n  .iftpl-widget .sticky-bar {\n    position: sticky;\n    top: var(--iftpl-sticky-offset, 0px);\n    z-index: 90;\n    background: transparent;\n    transition:\n      background 0.25s var(--ease),\n      box-shadow 0.25s var(--ease);\n  }\n  .iftpl-widget .sticky-bar-inner {\n    transition: padding 0.25s var(--ease);\n  }\n  .iftpl-widget .sticky-bar.is-stuck {\n    background: rgba(255, 255, 255, 0.92);\n    backdrop-filter: saturate(180%) blur(14px);\n    -webkit-backdrop-filter: saturate(180%) blur(14px);\n    box-shadow:\n      0 1px 0 var(--line),\n      0 6px 20px -8px rgba(10, 22, 40, 0.08);\n  }\n  .iftpl-widget .sticky-bar.is-stuck .tab-pills-wrap {\n    padding-top: 10px;\n    padding-bottom: 8px;\n  }\n  .iftpl-widget .sticky-bar.is-stuck .tab-pills {\n    padding: 3px;\n  }\n  .iftpl-widget .sticky-bar.is-stuck .tab-pill {\n    padding: 6px 14px;\n    font-size: 12.5px;\n  }\n  .iftpl-widget .sticky-bar.is-stuck .toolbar-wrap {\n    padding-bottom: 10px;\n  }\n  .iftpl-widget .sticky-bar.is-stuck .toolbar {\n    padding: 8px;\n    border-color: transparent;\n    box-shadow: none;\n    background: rgba(255, 255, 255, 0.6);\n  }\n  .iftpl-widget .sticky-bar.is-stuck .tb-search {\n    padding: 7px 14px;\n  }\n  .iftpl-widget .sticky-bar.is-stuck .tb-search input {\n    font-size: 13.5px;\n  }\n  .iftpl-widget .sticky-bar.is-stuck .tb-filter-btn {\n    padding: 7px 12px;\n    font-size: 12.5px;\n    min-height: 36px;\n  }\n  .iftpl-widget .sticky-chips-wrap.has-chips {\n    padding-bottom: 14px;\n  }\n  .iftpl-widget .sticky-bar.is-stuck .sticky-chips-wrap.has-chips {\n    padding-bottom: 10px;\n  }\n\n  \/* Active filter chips inside sticky bar *\/\n  .iftpl-widget .sticky-chips-wrap {\n    max-width: 1280px;\n    margin: 0 auto;\n    padding: 0 32px;\n    max-height: 0;\n    overflow: hidden;\n    transition:\n      max-height 0.3s var(--ease),\n      padding-bottom 0.3s var(--ease);\n  }\n  .iftpl-widget .sticky-chips-wrap.has-chips {\n    max-height: 80px;\n    padding-bottom: 14px;\n  }\n\n  \/* Auto-hide global if-header on scroll-down *\/\n  .if-header {\n    transition: transform 0.3s var(--ease);\n    z-index: 200 !important;\n  }\n  .if-header.iftpl-hidden {\n    transform: translateY(-100%);\n    will-change: transform;\n  }\n  \/* When the if-header is hidden, the announcement banner above also slides up *\/\n  .if-announce {\n    transition: transform 0.3s var(--ease);\n  }\n  .if-header.iftpl-hidden ~ * .if-announce,\n  body.iftpl-header-hidden .if-announce {\n    transform: translateY(-100%);\n  }\n\n  \/* ===== RESPONSIVE \u2014 TABLET (\u22641024px) ===== *\/\n  @media (max-width: 1024px) {\n    .iftpl-widget .hero-inner {\n      padding: 40px 24px 48px;\n    }\n    .iftpl-widget .hero-grid {\n      grid-template-columns: 1fr;\n      gap: 32px;\n    }\n    .iftpl-widget .hero-visual {\n      max-width: 440px;\n      margin: 0 auto;\n    }\n    .iftpl-widget .trades {\n      padding: 0 24px 32px;\n    }\n    .iftpl-widget .trades-grid {\n      grid-template-columns: repeat(4, 1fr);\n    }\n    .iftpl-widget .tab-pills-wrap {\n      padding: 0 24px 16px;\n    }\n    .iftpl-widget .sticky-chips-wrap {\n      padding: 0 24px;\n    }\n    .iftpl-widget .sticky-bar.is-stuck .tab-pills-wrap {\n      padding-top: 8px;\n      padding-bottom: 6px;\n    }\n    .iftpl-widget .sticky-bar.is-stuck .toolbar-wrap {\n      padding-bottom: 8px;\n    }\n    .iftpl-widget .toolbar-wrap {\n      padding: 0 24px 16px;\n    }\n    .iftpl-widget .gallery {\n      padding: 0 24px 64px;\n    }\n    .iftpl-widget .stats {\n      padding: 56px 24px;\n    }\n    .iftpl-widget .stats-grid {\n      grid-template-columns: repeat(2, 1fr);\n      gap: 16px;\n    }\n    .iftpl-widget .how {\n      padding: 64px 24px;\n    }\n    .iftpl-widget .how-grid {\n      grid-template-columns: 1fr;\n      gap: 14px;\n    }\n    \/* hide horizontal flow connectors once the steps stack *\/\n    .iftpl-widget .how-grid::before,\n    .iftpl-widget .how-step:not(:last-child)::after {\n      display: none;\n    }\n    .iftpl-widget .how-step {\n      padding: 28px;\n    }\n    .iftpl-widget .bp-inner {\n      grid-template-columns: 1fr;\n      gap: 36px;\n      padding: 64px 24px;\n    }\n    .iftpl-widget .bp-intro {\n      position: static;\n      padding: 38px 32px;\n    }\n    .iftpl-widget .features {\n      padding: 64px 24px;\n    }\n    .iftpl-widget .features-inner {\n      grid-template-columns: 1fr;\n      gap: 48px;\n    }\n    .iftpl-widget .features-content {\n      max-width: 100%;\n    }\n    .iftpl-widget .features-visual {\n      height: 480px;\n    }\n    .iftpl-widget .vs {\n      padding: 64px 24px;\n    }\n    .iftpl-widget .aigen-inner {\n      grid-template-columns: 1fr;\n      gap: 48px;\n      padding: 64px 24px;\n    }\n    .iftpl-widget .aigen-visual {\n      order: -1;\n    }\n    .iftpl-widget .quotes {\n      padding: 64px 24px;\n    }\n    .iftpl-widget .quotes-grid {\n      grid-template-columns: 1fr;\n      gap: 14px;\n    }\n    .iftpl-widget .faq {\n      padding: 64px 24px;\n    }\n    .iftpl-widget .final-cta {\n      padding: 64px 24px;\n    }\n    .iftpl-widget .final-cta-wrap {\n      padding: 56px 36px;\n    }\n    .iftpl-widget .modal-grid {\n      grid-template-columns: 1fr;\n    }\n    .iftpl-widget .modal-preview {\n      border-radius: 20px 20px 0 0;\n      padding: 36px 28px;\n    }\n    .iftpl-widget .modal-preview img {\n      max-width: 240px;\n    }\n    .iftpl-widget .modal-body {\n      padding: 32px 28px;\n    }\n    .iftpl-widget .key-sections-layout {\n      grid-template-columns: 1fr 320px 1fr;\n      gap: 24px;\n      padding: 36px 24px;\n    }\n  }\n\n  \/* ===== RESPONSIVE \u2014 MOBILE (\u2264768px) ===== *\/\n  @media (max-width: 768px) {\n    .iftpl-widget .hero {\n      padding: 75px 16px 32px;\n    }\n    .iftpl-widget .hero-inner {\n      padding: 28px 16px 40px;\n    }\n    .iftpl-widget .hero-h1 {\n      font-size: clamp(30px, 8.5vw, 40px);\n    }\n    .iftpl-widget .hero-lead {\n      font-size: 16px;\n    }\n    .iftpl-widget .hero-ctas {\n      gap: 8px;\n    }\n    .iftpl-widget .hero-ctas .btn {\n      flex: 1 1 100%;\n    }\n    .iftpl-widget .hero-proof {\n      justify-content: center;\n      text-align: center;\n      gap: 5px;\n    }\n    .iftpl-widget .hero-proof-sep {\n      display: none;\n    }\n    .iftpl-widget .hero-visual {\n      display: none;\n    }\n    .iftpl-widget .trades {\n      padding: 28px 16px 32px;\n    }\n    .iftpl-widget .trades-grid {\n      grid-template-columns: repeat(3, 1fr);\n      gap: 8px;\n    }\n    .iftpl-widget .trade {\n      padding: 14px 8px 12px;\n    }\n    .iftpl-widget .trade-icon {\n      width: 24px;\n      height: 24px;\n    }\n    .iftpl-widget .trade-label {\n      font-size: 11.5px;\n    }\n    .iftpl-widget .trade-count {\n      font-size: 9.5px;\n    }\n    \/* Sticky bar: normal flow on mobile *\/\n    .iftpl-widget .sticky-bar {\n      position: relative !important;\n      top: auto !important;\n    }\n    .iftpl-widget .sticky-bar.is-stuck {\n      background: transparent !important;\n      backdrop-filter: none !important;\n      -webkit-backdrop-filter: none !important;\n      box-shadow: none !important;\n    }\n    .iftpl-widget .tab-pills-wrap {\n      padding: 0 16px 12px;\n    }\n    .iftpl-widget .sticky-chips-wrap {\n      padding: 0 16px;\n    }\n    .iftpl-widget .sticky-bar.is-stuck .tab-pills-wrap {\n      padding-top: 6px;\n      padding-bottom: 6px;\n    }\n    .iftpl-widget .sticky-bar.is-stuck .tab-pill {\n      padding: 6px 12px;\n      font-size: 12px;\n    }\n    .iftpl-widget .sticky-bar.is-stuck .toolbar {\n      padding: 6px;\n    }\n    .iftpl-widget .sticky-bar.is-stuck .toolbar-wrap {\n      padding-bottom: 8px;\n    }\n    .iftpl-widget .sticky-bar.is-stuck .tb-filter-btn {\n      padding: 7px 10px;\n      font-size: 12px;\n      min-height: 36px;\n    }\n    .iftpl-widget .tab-pills {\n      padding: 4px;\n    }\n    .iftpl-widget .tab-pill {\n      padding: 8px 14px;\n      font-size: 12.5px;\n    }\n    .iftpl-widget .toolbar-wrap {\n      padding: 0 16px 10px;\n    }\n    .iftpl-widget .toolbar {\n      padding: 6px 8px;\n      gap: 6px;\n    }\n    .iftpl-widget .tb-search {\n      flex: 1 1 100%;\n      order: -1;\n      padding: 5px 10px;\n      gap: 6px;\n    }\n    .iftpl-widget .tb-search svg {\n      width: 13px;\n      height: 13px;\n      flex-shrink: 0;\n    }\n    .iftpl-widget .tb-search input {\n      font-size: 13px;\n    }\n    .iftpl-widget .tb-filter {\n      flex: 0 0 auto;\n    }\n    .iftpl-widget .tb-filter-btn {\n      padding: 6px 10px;\n      font-size: 12px;\n      min-height: 32px;\n    }\n\n    .iftpl-widget .tb-dropdown {\n      position: fixed !important;\n      top: auto !important;\n      left: 0 !important;\n      right: 0 !important;\n      bottom: 0 !important;\n      width: 100%;\n      max-width: 100%;\n      max-height: 75vh;\n      border-radius: 24px 24px 0 0;\n      padding: 20px;\n      z-index: 99998;\n      box-shadow: 0 -10px 50px rgba(10, 22, 40, 0.25);\n      animation: iftpl-sheetUp 0.3s var(--ease);\n      overflow-y: auto;\n    }\n    .iftpl-widget .tb-mobile-backdrop {\n      display: block;\n    }\n    .iftpl-widget .tb-mobile-head {\n      display: flex;\n    }\n    .iftpl-widget .tb-dropdown-title {\n      display: none;\n    }\n    .iftpl-widget .tb-options {\n      max-height: calc(75vh - 160px);\n    }\n    .iftpl-widget .tb-option {\n      padding: 14px 12px;\n      font-size: 14.5px;\n      min-height: 44px;\n    }\n    @keyframes iftpl-sheetUp {\n      from {\n        transform: translateY(100%);\n      }\n      to {\n        transform: translateY(0);\n      }\n    }\n\n    .iftpl-widget .gallery {\n      padding: 0 16px 56px;\n    }\n    .iftpl-widget .gallery-head {\n      gap: 10px;\n    }\n    .iftpl-widget .template-grid {\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n      gap: 12px;\n    }\n    .iftpl-widget .tc-info {\n      padding: 12px 12px 14px;\n      gap: 8px;\n    }\n    .iftpl-widget .tc-name {\n      font-size: 13px;\n    }\n    .iftpl-widget .tc-meta {\n      font-size: 9.5px;\n    }\n    .iftpl-widget .tc-arrow {\n      width: 26px;\n      height: 26px;\n    }\n    .iftpl-widget .tc-overlay {\n      display: none;\n    }\n    .iftpl-widget .tc-badge {\n      top: 18px;\n      left: 18px;\n      font-size: 9px;\n      padding: 3px 6px;\n    }\n    .iftpl-widget .tc-formats {\n      gap: 2px;\n      margin-top: 6px;\n    }\n    .iftpl-widget .tc-fmt {\n      font-size: 8px;\n      padding: 2px 4px;\n    }\n\n    .iftpl-widget .stats {\n      padding: 48px 16px;\n    }\n    .iftpl-widget .stats-head {\n      margin-bottom: 28px;\n    }\n    .iftpl-widget .stats-grid {\n      gap: 10px;\n    }\n    .iftpl-widget .stat {\n      padding: 20px 12px;\n    }\n    .iftpl-widget .stat-num {\n      font-size: 34px;\n    }\n    .iftpl-widget .stat-label {\n      font-size: 12px;\n    }\n\n    .iftpl-widget .how {\n      padding: 56px 16px;\n    }\n    .iftpl-widget .how-head {\n      margin-bottom: 36px;\n    }\n    .iftpl-widget .how-step {\n      padding: 24px;\n    }\n    .iftpl-widget .bp-inner {\n      padding: 56px 16px;\n    }\n    .iftpl-widget .bp-intro {\n      padding: 32px 24px;\n    }\n    .iftpl-widget .bp-item {\n      grid-template-columns: 52px 1fr;\n      gap: 18px;\n      padding: 22px 16px 22px 16px;\n    }\n    .iftpl-widget .bp-num {\n      font-size: 38px;\n    }\n    .iftpl-widget .bp-item:not(:last-child)::after {\n      left: 86px;\n      right: 16px;\n    }\n\n    .iftpl-widget .features {\n      padding: 56px 16px;\n    }\n    .iftpl-widget .features-inner {\n      gap: 36px;\n    }\n    .iftpl-widget .features-visual {\n      height: 440px;\n    }\n    .iftpl-widget .vs {\n      padding: 56px 16px;\n    }\n    .iftpl-widget .vs-grid {\n      grid-template-columns: 1fr;\n      gap: 14px;\n      padding: 16px;\n      border-radius: 22px;\n    }\n    .iftpl-widget .vs-card {\n      padding: 26px 22px;\n    }\n    .iftpl-widget .aigen-inner {\n      padding: 56px 16px;\n    }\n    .iftpl-widget .aigen-list {\n      grid-template-columns: 1fr;\n      gap: 12px;\n    }\n    .iftpl-widget .aigen-text > .btn {\n      display: flex;\n      width: fit-content;\n      margin-left: auto;\n      margin-right: auto;\n    }\n    .iftpl-widget .phone {\n      width: 240px;\n    }\n    .iftpl-widget .phone-badge {\n      font-size: 11.5px;\n      padding: 8px 12px;\n    }\n\n    .iftpl-widget .quotes {\n      padding: 56px 16px;\n    }\n    .iftpl-widget .quote {\n      padding: 24px;\n    }\n\n    .iftpl-widget .faq {\n      padding: 56px 16px;\n    }\n    .iftpl-widget .faq-q {\n      padding: 20px 22px;\n      font-size: 15px;\n      gap: 16px;\n    }\n    .iftpl-widget .faq-item.open .faq-a {\n      padding: 0 22px 22px;\n    }\n\n    .iftpl-widget .final-cta {\n      padding: 56px 16px;\n    }\n    .iftpl-widget .final-cta-wrap {\n      padding: 48px 24px;\n    }\n    .iftpl-widget .final-cta-ctas .btn {\n      flex: 1 1 100%;\n    }\n\n    .iftpl-widget .modal-backdrop {\n      padding: 0;\n      align-items: flex-end;\n    }\n    .iftpl-widget .modal {\n      border-radius: 24px 24px 0 0;\n      max-height: 92vh;\n      animation: iftpl-sheetUp 0.35s var(--ease);\n    }\n    .iftpl-widget .modal-close {\n      top: 12px;\n      right: 12px;\n      width: 34px;\n      height: 34px;\n    }\n    .iftpl-widget .modal-preview {\n      padding: 28px 20px 12px;\n      border-radius: 24px 24px 0 0;\n    }\n    .iftpl-widget .modal-preview img {\n      max-width: 190px;\n    }\n    .iftpl-widget .modal-body {\n      padding: 22px 20px 28px;\n    }\n    .iftpl-widget .modal-formats {\n      grid-template-columns: 1fr;\n      gap: 6px;\n    }\n    .iftpl-widget .key-sections { padding: 0 16px 64px; }\n    .iftpl-widget .key-sections-layout {\n      grid-template-columns: 1fr;\n      padding: 28px 20px;\n    }\n    .iftpl-widget .ks-doc { order: -1; max-width: 280px; margin: 0 auto; }\n    .iftpl-widget .ks-items { gap: 20px; }\n  }\n\n  @media (max-width: 480px) {\n    .iftpl-widget .trades-grid {\n      grid-template-columns: repeat(2, 1fr);\n    }\n    .iftpl-widget .stats-grid {\n      grid-template-columns: 1fr;\n    }\n  }\n  @media (max-width: 360px) {\n    .iftpl-widget .template-grid {\n      grid-template-columns: 1fr;\n    }\n  }\n<\/style>\n\n<div class=\"iftpl-widget\" id=\"iftpl-root\">\n  <section class=\"hero\">\n    <div class=\"hero-inner\">\n      <div class=\"hero-grid\">\n        <div>\n          <div class=\"crumbs\">\n            <a href=\"https:\/\/invoicefly.com\/\">Home<\/a>\n            <span class=\"sep\">\/<\/span>\n            <a href=\"https:\/\/invoicefly.com\/free-resources\/\">Free Resources<\/a>\n            <span class=\"sep\">\/<\/span>\n            <a href=\"https:\/\/invoicefly.com\/free-resources\/free-templates\/\"\n              >Templates<\/a\n            >\n            <span class=\"sep\">\/<\/span>\n            <span class=\"current\">Estimate Templates<\/span>\n          <\/div>\n          <div class=\"hero-badge\">\n            Built for contractors \u00b7 Free \u00b7 No sign-up\n          <\/div>\n          <h1 class=\"hero-h1\">\n            Professional Estimate Templates for\n            <span class=\"hi\">Every Trade<\/span>\n          <\/h1>\n          <p class=\"hero-lead\">\n            Download free estimate templates in PDF, Word, Excel, Google Docs,\n            and Google Sheets, or create and send estimates online with Invoice\n            Fly. Designed for contractors, electricians, plumbers, roofers,\n            landscapers, and small businesses.\n          <\/p>\n          <div class=\"hero-ctas\">\n            <a\n              href=\"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\"\n              class=\"btn btn-primary btn-lg\"\n              target=\"_blank\"\n              rel=\"noopener\"\n            >\n              Estimate with Invoice Fly App\n              <svg\n                width=\"14\"\n                height=\"14\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"2.5\"\n              >\n                <path d=\"M5 12h14M13 5l7 7-7 7\" \/>\n              <\/svg>\n            <\/a>\n            <a href=\"#templates\" class=\"btn btn-outline btn-lg\"\n              >Browse Templates Online<\/a\n            >\n          <\/div>\n          <div class=\"hero-proof\">\n            <div class=\"hero-proof-stars\">\n              <svg\n                width=\"16\"\n                height=\"16\"\n                viewBox=\"0 0 24 24\"\n                fill=\"currentColor\"\n              >\n                <path\n                  d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\n                \/>\n              <\/svg>\n              <svg\n                width=\"16\"\n                height=\"16\"\n                viewBox=\"0 0 24 24\"\n                fill=\"currentColor\"\n              >\n                <path\n                  d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\n                \/>\n              <\/svg>\n              <svg\n                width=\"16\"\n                height=\"16\"\n                viewBox=\"0 0 24 24\"\n                fill=\"currentColor\"\n              >\n                <path\n                  d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\n                \/>\n              <\/svg>\n              <svg\n                width=\"16\"\n                height=\"16\"\n                viewBox=\"0 0 24 24\"\n                fill=\"currentColor\"\n              >\n                <path\n                  d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\n                \/>\n              <\/svg>\n              <svg\n                width=\"16\"\n                height=\"16\"\n                viewBox=\"0 0 24 24\"\n                fill=\"currentColor\"\n              >\n                <path\n                  d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\n                \/>\n              <\/svg>\n            <\/div>\n            <div class=\"hero-proof-text\">\n              <strong>4.8<\/strong> from <strong>2,400+<\/strong> contractors\n            <\/div>\n            <div class=\"hero-proof-sep\"><\/div>\n            <div class=\"hero-proof-text\">\n              <strong>12,000+<\/strong> contractors trust Invoice Fly\n            <\/div>\n          <\/div>\n        <\/div>\n\n        <div class=\"hero-visual\">\n          <div class=\"hero-stack\">\n            <div class=\"hero-doc hero-doc-1\">\n              <img\n                src=\"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Beige-Estimate-Template.jpg\"\n                alt=\"Minimal Beige Estimate Template\"\n                loading=\"lazy\"\n                decoding=\"async\"\n              \/>\n            <\/div>\n            <div class=\"hero-doc hero-doc-2\">\n              <img\n                src=\"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Blue-Geometric-Estimate-Template.jpg\"\n                alt=\"Minimal Blue Geometric Estimate Template\"\n                fetchpriority=\"high\"\n                decoding=\"async\"\n              \/>\n            <\/div>\n            <div class=\"hero-doc hero-doc-3\">\n              <img\n                src=\"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Forest-Green-Estimate-Template.jpg\"\n                alt=\"Classic Forest Green Estimate Template\"\n                loading=\"lazy\"\n                decoding=\"async\"\n              \/>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <section class=\"trades\" id=\"trades\">\n    <div class=\"trades-label\">Built for your trade<\/div>\n    <div class=\"trades-grid\" id=\"iftpl-trades\"><\/div>\n  <\/section>\n\n  <div class=\"gallery-section\">\n    <div class=\"sticky-bar\" id=\"iftpl-sticky-bar\">\n      <div class=\"sticky-bar-inner\">\n        <div class=\"tab-pills-wrap\" id=\"templates\">\n          <div class=\"tab-pills\">\n            <a href=\"https:\/\/invoicefly.com\/invoice\/templates\/\" class=\"tab-pill\"\n              >Invoice Templates<\/a\n            >\n            <a\n              href=\"https:\/\/invoicefly.com\/free-resources\/free-templates\/estimate-templates\/\"\n              class=\"tab-pill active\"\n              >Estimate Templates<\/a\n            >\n            <a\n              href=\"https:\/\/invoicefly.com\/free-resources\/free-templates\/quote-templates\/\"\n              class=\"tab-pill\"\n              >Quote Templates<\/a\n            >\n            <a\n              href=\"https:\/\/invoicefly.com\/free-resources\/free-templates\/receipt-templates\/\"\n              class=\"tab-pill\"\n              >Receipt Templates<\/a\n            >\n            <a\n              href=\"https:\/\/invoicefly.com\/free-resources\/free-templates\/bill-templates\/\"\n              class=\"tab-pill\"\n              >Bill Templates<\/a\n            >\n          <\/div>\n        <\/div>\n\n        <div class=\"toolbar-wrap\">\n          <div class=\"toolbar\">\n            <div class=\"tb-search\">\n              <svg\n                width=\"16\"\n                height=\"16\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"2\"\n              >\n                <circle cx=\"11\" cy=\"11\" r=\"8\" \/>\n                <line x1=\"21\" y1=\"21\" x2=\"16.65\" y2=\"16.65\" \/>\n              <\/svg>\n              <input\n                type=\"text\"\n                id=\"iftpl-search\"\n                placeholder=\"Search 33 free estimate templates...\"\n              \/>\n            <\/div>\n            <div class=\"tb-filter\" data-filter=\"style\">\n              <button type=\"button\" class=\"tb-filter-btn\">\n                <span>Style<\/span>\n                <span class=\"count\" style=\"display: none\">0<\/span>\n                <svg\n                  class=\"caret\"\n                  width=\"10\"\n                  height=\"10\"\n                  viewBox=\"0 0 24 24\"\n                  fill=\"none\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"2.5\"\n                >\n                  <polyline points=\"6 9 12 15 18 9\" \/>\n                <\/svg>\n              <\/button>\n              <div class=\"tb-dropdown\">\n                <div class=\"tb-mobile-head\">\n                  <h4>Style<\/h4>\n                  <button\n                    type=\"button\"\n                    class=\"tb-mobile-close\"\n                    aria-label=\"Close\"\n                  >\n                    \u2715\n                  <\/button>\n                <\/div>\n                <div class=\"tb-dropdown-title\">Style<\/div>\n                <div class=\"tb-options\" data-options=\"style\"><\/div>\n                <div class=\"tb-dropdown-foot\">\n                  <button type=\"button\" class=\"tb-clear\">Clear<\/button>\n                  <button type=\"button\" class=\"tb-apply\">Done<\/button>\n                <\/div>\n              <\/div>\n            <\/div>\n            <div class=\"tb-filter\" data-filter=\"color\">\n              <button type=\"button\" class=\"tb-filter-btn\">\n                <span>Color<\/span>\n                <span class=\"count\" style=\"display: none\">0<\/span>\n                <svg\n                  class=\"caret\"\n                  width=\"10\"\n                  height=\"10\"\n                  viewBox=\"0 0 24 24\"\n                  fill=\"none\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"2.5\"\n                >\n                  <polyline points=\"6 9 12 15 18 9\" \/>\n                <\/svg>\n              <\/button>\n              <div class=\"tb-dropdown\">\n                <div class=\"tb-mobile-head\">\n                  <h4>Color<\/h4>\n                  <button\n                    type=\"button\"\n                    class=\"tb-mobile-close\"\n                    aria-label=\"Close\"\n                  >\n                    \u2715\n                  <\/button>\n                <\/div>\n                <div class=\"tb-dropdown-title\">Color<\/div>\n                <div class=\"tb-options\" data-options=\"color\"><\/div>\n                <div class=\"tb-dropdown-foot\">\n                  <button type=\"button\" class=\"tb-clear\">Clear<\/button>\n                  <button type=\"button\" class=\"tb-apply\">Done<\/button>\n                <\/div>\n              <\/div>\n            <\/div>\n            <div class=\"tb-filter\" data-filter=\"format\">\n              <button type=\"button\" class=\"tb-filter-btn\">\n                <span>Format<\/span>\n                <span class=\"count\" style=\"display: none\">0<\/span>\n                <svg\n                  class=\"caret\"\n                  width=\"10\"\n                  height=\"10\"\n                  viewBox=\"0 0 24 24\"\n                  fill=\"none\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"2.5\"\n                >\n                  <polyline points=\"6 9 12 15 18 9\" \/>\n                <\/svg>\n              <\/button>\n              <div class=\"tb-dropdown\">\n                <div class=\"tb-mobile-head\">\n                  <h4>Format<\/h4>\n                  <button\n                    type=\"button\"\n                    class=\"tb-mobile-close\"\n                    aria-label=\"Close\"\n                  >\n                    \u2715\n                  <\/button>\n                <\/div>\n                <div class=\"tb-dropdown-title\">Format<\/div>\n                <div class=\"tb-options\" data-options=\"format\"><\/div>\n                <div class=\"tb-dropdown-foot\">\n                  <button type=\"button\" class=\"tb-clear\">Clear<\/button>\n                  <button type=\"button\" class=\"tb-apply\">Done<\/button>\n                <\/div>\n              <\/div>\n            <\/div>\n            <div class=\"tb-filter\" data-filter=\"industry\">\n              <button type=\"button\" class=\"tb-filter-btn\">\n                <span>Trade<\/span>\n                <span class=\"count\" style=\"display: none\">0<\/span>\n                <svg\n                  class=\"caret\"\n                  width=\"10\"\n                  height=\"10\"\n                  viewBox=\"0 0 24 24\"\n                  fill=\"none\"\n                  stroke=\"currentColor\"\n                  stroke-width=\"2.5\"\n                >\n                  <polyline points=\"6 9 12 15 18 9\" \/>\n                <\/svg>\n              <\/button>\n              <div class=\"tb-dropdown\">\n                <div class=\"tb-mobile-head\">\n                  <h4>Trade<\/h4>\n                  <button\n                    type=\"button\"\n                    class=\"tb-mobile-close\"\n                    aria-label=\"Close\"\n                  >\n                    \u2715\n                  <\/button>\n                <\/div>\n                <div class=\"tb-dropdown-title\">Trade<\/div>\n                <div class=\"tb-options\" data-options=\"industry\"><\/div>\n                <div class=\"tb-dropdown-foot\">\n                  <button type=\"button\" class=\"tb-clear\">Clear<\/button>\n                  <button type=\"button\" class=\"tb-apply\">Done<\/button>\n                <\/div>\n              <\/div>\n            <\/div>\n          <\/div>\n        <\/div>\n\n        <div class=\"sticky-chips-wrap\" id=\"iftpl-sticky-chips-wrap\">\n          <div class=\"active-filters\" id=\"iftpl-active-filters\"><\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n\n    <div class=\"tb-mobile-backdrop\" id=\"iftpl-tb-backdrop\"><\/div>\n\n    <section class=\"gallery\">\n      <div class=\"gallery-head\">\n        <div class=\"gallery-count\">\n          Showing <strong id=\"iftpl-shown\">33<\/strong> of\n          <strong id=\"iftpl-total\">33<\/strong> templates\n        <\/div>\n      <\/div>\n      <div class=\"template-grid\" id=\"iftpl-grid\"><\/div>\n    <\/section>\n  <\/div>\n\n  <section class=\"stats\">\n    <div class=\"stats-inner\">\n      <div class=\"stats-head\">\n        <div class=\"stats-tag\">\u2014 Trusted by the trades<\/div>\n        <h2>Trusted by Thousands of Contractors Across 22+ Trades<\/h2>\n      <\/div>\n      <div class=\"stats-grid\">\n        <div class=\"stat\">\n          <div class=\"stat-num\">12,000<span class=\"plus\">+<\/span><\/div>\n          <div class=\"stat-label\">Active contractors<\/div>\n        <\/div>\n        <div class=\"stat\">\n          <div class=\"stat-num\">$2.4<span class=\"plus\">B+<\/span><\/div>\n          <div class=\"stat-label\">Estimated last year<\/div>\n        <\/div>\n        <div class=\"stat\">\n          <div class=\"stat-num\">4.8<span class=\"plus\">\u2605<\/span><\/div>\n          <div class=\"stat-label\">App Store rating<\/div>\n        <\/div>\n        <div class=\"stat\">\n          <div class=\"stat-num\">22<span class=\"plus\">+<\/span><\/div>\n          <div class=\"stat-label\">Trades covered<\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <section class=\"how\">\n    <div class=\"how-head\">\n      <div class=\"how-tag\">\u2014 How it works<\/div>\n      <h2>From estimate to approval in three steps.<\/h2>\n      <p>\n        Create a polished estimate before you leave the job site. Choose a\n        template, add your pricing, and send it for approval.\n      <\/p>\n    <\/div>\n    <div class=\"how-grid\">\n      <div class=\"how-step\">\n        <div class=\"how-step-top\">\n          <div class=\"how-step-icon\">\n            <svg\n              width=\"28\"\n              height=\"28\"\n              viewBox=\"0 0 24 24\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"2\"\n            >\n              <path\n                d=\"M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z\"\n              \/>\n              <polyline points=\"14 2 14 8 20 8\" \/>\n              <line x1=\"9\" y1=\"13\" x2=\"15\" y2=\"13\" \/>\n              <line x1=\"9\" y1=\"17\" x2=\"15\" y2=\"17\" \/>\n            <\/svg>\n          <\/div>\n          <div class=\"how-step-num\">Step 01<\/div>\n        <\/div>\n        <h3 class=\"how-step-title\">Pick a template<\/h3>\n        <p class=\"how-step-text\">\n          Choose from 33 free templates. Filter by your trade, style, or color\n          until you find one that fits your brand.\n        <\/p>\n        <div class=\"how-step-time\">Takes 15 seconds<\/div>\n      <\/div>\n      <div class=\"how-step\">\n        <div class=\"how-step-top\">\n          <div class=\"how-step-icon\">\n            <svg\n              width=\"28\"\n              height=\"28\"\n              viewBox=\"0 0 24 24\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"2\"\n            >\n              <path\n                d=\"M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7\"\n              \/>\n              <path d=\"M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z\" \/>\n            <\/svg>\n          <\/div>\n          <div class=\"how-step-num\">Step 02<\/div>\n        <\/div>\n        <h3 class=\"how-step-title\">Fill in the job<\/h3>\n        <p class=\"how-step-text\">\n          Materials, labor hours, tax, markup. Add line items, attach photos\n          from the site, drop in your business logo.\n        <\/p>\n        <div class=\"how-step-time\">Takes 30 seconds<\/div>\n      <\/div>\n      <div class=\"how-step\">\n        <div class=\"how-step-top\">\n          <div class=\"how-step-icon\">\n            <svg\n              width=\"28\"\n              height=\"28\"\n              viewBox=\"0 0 24 24\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"2\"\n            >\n              <line x1=\"22\" y1=\"2\" x2=\"11\" y2=\"13\" \/>\n              <polygon points=\"22 2 15 22 11 13 2 9 22 2\" \/>\n            <\/svg>\n          <\/div>\n          <div class=\"how-step-num\">Step 03<\/div>\n        <\/div>\n        <h3 class=\"how-step-title\">Send & get signed<\/h3>\n        <p class=\"how-step-text\">\n          Email it. Text it. Print it. The client signs digitally and you're\n          notified the second they approve. Convert to invoice in one tap.\n        <\/p>\n        <div class=\"how-step-time\">Takes 15 seconds<\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <section class=\"key-sections\">\n    <div class=\"key-sections-inner\">\n      <div class=\"key-sections-head\">\n        <h2>Key Sections to have on an Estimate<\/h2>\n        <p>A great estimate isn't just a price, it's a clear breakdown of the work, costs, and expectations. Include these key sections to create professional estimates your customers can review and approve with confidence.<\/p>\n      <\/div>\n      <div class=\"key-sections-layout\">\n        <div class=\"ks-items\">\n          <div class=\"ks-item\">\n            <div class=\"ks-num\">1<\/div>\n            <strong>Estimate Header<\/strong>\n            <span>Start with a clear estimate title at the top of your document. This instantly tells the client it is an estimate, not an invoice or receipt.<\/span>\n          <\/div>\n          <div class=\"ks-item\">\n            <div class=\"ks-num\">2<\/div>\n            <strong>Estimate number and dates<\/strong>\n            <span>Include a unique estimate number, issue date, and validity or due date so both you and your client can track the estimate easily.<\/span>\n          <\/div>\n          <div class=\"ks-item\">\n            <div class=\"ks-num\">3<\/div>\n            <strong>Client and project details<\/strong>\n            <span>Add the bill-to and ship-to details, plus the client's name, address, and contact information so the estimate is properly assigned.<\/span>\n          <\/div>\n          <div class=\"ks-item\">\n            <div class=\"ks-num\">4<\/div>\n            <strong>Description of services or products<\/strong>\n            <span>List the items, services, or scope of work with clear descriptions so the client understands exactly what is being estimated.<\/span>\n          <\/div>\n        <\/div>\n        <div class=\"ks-doc\">\n          <img src=\"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/06\/Estimate-template-points-e1780490309916.webp\" alt=\"Estimate template example\" loading=\"lazy\" decoding=\"async\">\n        <\/div>\n        <div class=\"ks-items\">\n          <div class=\"ks-item\">\n            <div class=\"ks-num\">5<\/div>\n            <strong>Quantities, unit prices, and amounts<\/strong>\n            <span>Show quantities, unit prices, and line totals for each item so pricing is transparent and easy to review.<\/span>\n          <\/div>\n          <div class=\"ks-item\">\n            <div class=\"ks-num\">6<\/div>\n            <strong>Subtotal, taxes, discounts, and shipping<\/strong>\n            <span>Include the cost breakdown clearly. The estimate should show subtotal, tax, discount, shipping, and the total estimate amount.<\/span>\n          <\/div>\n          <div class=\"ks-item\">\n            <div class=\"ks-num\">7<\/div>\n            <strong>Terms and conditions<\/strong>\n            <span>Use this section for notes, scope limitations, estimate validity, and any important assumptions before the client approves the work.<\/span>\n          <\/div>\n          <div class=\"ks-item\">\n            <div class=\"ks-num\">8<\/div>\n            <strong>Payment terms and total estimate<\/strong>\n            <span>Add payment terms such as deposit requirements, milestones, or completion terms, and clearly highlight the final total estimate.<\/span>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <section class=\"features\">\n    <div class=\"features-inner\">\n      <div class=\"features-content\">\n        <div class=\"features-tag\">\u2014 Made for the field<\/div>\n        <h2 class=\"features-h2\">Quote jobs from the field<\/h2>\n        <p class=\"features-lead\">\n          Build and send estimates from the truck, driveway, or job site.\n        <\/p>\n        <div class=\"features-list\">\n          <div class=\"feature-item\">\n            <div class=\"feature-icon\">\n              <svg\n                width=\"18\"\n                height=\"18\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"2.5\"\n              >\n                <polyline points=\"20 6 9 17 4 12\" \/>\n              <\/svg>\n            <\/div>\n            <div class=\"feature-text\">\n              <strong>Win jobs faster<\/strong>\n              <span\n                >Send estimates on-site and customers sign before you\n                leave.<\/span\n              >\n            <\/div>\n          <\/div>\n          <div class=\"feature-item\">\n            <div class=\"feature-icon\">\n              <svg\n                width=\"18\"\n                height=\"18\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"2.5\"\n              >\n                <polyline points=\"20 6 9 17 4 12\" \/>\n              <\/svg>\n            <\/div>\n            <div class=\"feature-text\">\n              <strong>Get paid 3x faster without the paperwork<\/strong>\n              <span\n                >Turn approved estimates into invoices and accept payments\n                faster.<\/span\n              >\n            <\/div>\n          <\/div>\n          <div class=\"feature-item\">\n            <div class=\"feature-icon\">\n              <svg\n                width=\"18\"\n                height=\"18\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"2.5\"\n              >\n                <polyline points=\"20 6 9 17 4 12\" \/>\n              <\/svg>\n            <\/div>\n            <div class=\"feature-text\">\n              <strong>Eliminate costly tax mistakes<\/strong>\n              <span\n                >Auto-calculates tax by state, county, and zip. No more math\n                errors costing you money.<\/span\n              >\n            <\/div>\n          <\/div>\n          <div class=\"feature-item\">\n            <div class=\"feature-icon\">\n              <svg\n                width=\"18\"\n                height=\"18\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"2.5\"\n              >\n                <polyline points=\"20 6 9 17 4 12\" \/>\n              <\/svg>\n            <\/div>\n            <div class=\"feature-text\">\n              <strong>QuickBooks-ready<\/strong>\n              <span\n                >Export to QuickBooks Online or download CSV for your\n                bookkeeper.<\/span\n              >\n            <\/div>\n          <\/div>\n        <\/div>\n        <a\n          href=\"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\"\n          class=\"btn btn-primary btn-lg\"\n          target=\"_blank\"\n          rel=\"noopener\"\n        >\n          Download free\n          <svg\n            width=\"14\"\n            height=\"14\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"2.5\"\n          >\n            <path d=\"M5 12h14M13 5l7 7-7 7\" \/>\n          <\/svg>\n        <\/a>\n      <\/div>\n      <div class=\"features-visual\">\n        <div class=\"phone-badge phone-badge-1\">\n          <span class=\"ic\"\n            ><svg\n              width=\"12\"\n              height=\"12\"\n              viewBox=\"0 0 24 24\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"3\"\n            >\n              <polyline points=\"20 6 9 17 4 12\" \/><\/svg\n          ><\/span>\n          <span>Signed<\/span>\n        <\/div>\n        <div class=\"phone-badge phone-badge-2\">\n          <span class=\"ic\"\n            ><svg\n              width=\"12\"\n              height=\"12\"\n              viewBox=\"0 0 24 24\"\n              fill=\"currentColor\"\n            >\n              <path\n                d=\"M21 4H3a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h18a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2zm0 4l-9 5-9-5V6l9 5 9-5v2z\"\n              \/><\/svg\n          ><\/span>\n          <span>Paid<\/span>\n        <\/div>\n        <div class=\"phone\">\n          <img\n            src=\"https:\/\/invoicefly.com\/wp-content\/uploads\/2025\/08\/invoice-management-mobile-image.png\"\n            alt=\"InvoiceFly app mockup\"\n            loading=\"lazy\"\n            decoding=\"async\"\n          \/>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <section class=\"quotes\">\n    <div class=\"quotes-head\">\n      <h2>Real stories from the field.<\/h2>\n      <p>\n        Thousands of contractors use Invoice Fly every day to create\n        professional estimates and manage their work from anywhere.\n      <\/p>\n    <\/div>\n    <div class=\"quotes-grid\">\n      <div class=\"quote\">\n        <div class=\"quote-stars\">\n          <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n            <path\n              d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\n            \/>\n          <\/svg>\n          <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n            <path\n              d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\n            \/>\n          <\/svg>\n          <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n            <path\n              d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\n            \/>\n          <\/svg>\n          <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n            <path\n              d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\n            \/>\n          <\/svg>\n          <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n            <path\n              d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\n            \/>\n          <\/svg>\n        <\/div>\n        <p class=\"quote-text\">\n          \"Was using a beat-up Excel template my dad gave me. Switched to\n          Invoice Fly and won three more bids in the first week because my\n          estimates actually looked professional.\"\n        <\/p>\n        <div class=\"quote-author\">\n          <div class=\"quote-avatar\">MR<\/div>\n          <div>\n            <div class=\"quote-name\">Mike R.<\/div>\n            <div class=\"quote-role\">Roofing contractor \u00b7 Dallas, TX<\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n      <div class=\"quote\">\n        <div class=\"quote-stars\">\n          <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n            <path\n              d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\n            \/>\n          <\/svg>\n          <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n            <path\n              d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\n            \/>\n          <\/svg>\n          <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n            <path\n              d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\n            \/>\n          <\/svg>\n          <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n            <path\n              d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\n            \/>\n          <\/svg>\n          <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n            <path\n              d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\n            \/>\n          <\/svg>\n        <\/div>\n        <p class=\"quote-text\">\n          \"Cuts my paperwork time by an hour every day. I write the estimate\n          from the basement, customer signs from their kitchen, I'm on to the\n          next job before lunch.\"\n        <\/p>\n        <div class=\"quote-author\">\n          <div class=\"quote-avatar\">DK<\/div>\n          <div>\n            <div class=\"quote-name\">Dave K.<\/div>\n            <div class=\"quote-role\">Master plumber \u00b7 Cleveland, OH<\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n      <div class=\"quote\">\n        <div class=\"quote-stars\">\n          <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n            <path\n              d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\n            \/>\n          <\/svg>\n          <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n            <path\n              d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\n            \/>\n          <\/svg>\n          <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n            <path\n              d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\n            \/>\n          <\/svg>\n          <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n            <path\n              d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\n            \/>\n          <\/svg>\n          <svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"currentColor\">\n            <path\n              d=\"M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z\"\n            \/>\n          <\/svg>\n        <\/div>\n        <p class=\"quote-text\">\n          \"Sales tax was always a nightmare across counties. Now it just figures\n          it out. My QuickBooks lady actually thanked me for switching.\"\n        <\/p>\n        <div class=\"quote-author\">\n          <div class=\"quote-avatar\">JT<\/div>\n          <div>\n            <div class=\"quote-name\">Jenna T.<\/div>\n            <div class=\"quote-role\">HVAC company owner \u00b7 Phoenix, AZ<\/div>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- ==================== TEMPLATE VS SOFTWARE ==================== -->\n  <section class=\"vs\">\n    <div class=\"vs-head\">\n      <span class=\"vs-tag\">Template vs Software<\/span>\n      <h2>Estimate Template vs. Invoice Fly Estimate Software<\/h2>\n      <p>\n        Downloadable estimate templates are a great starting point for creating\n        professional estimates. However, as your business grows, managing\n        estimates manually can become time-consuming. Updating client details,\n        calculating totals, tracking approvals, and creating invoices often\n        requires multiple tools and repetitive work.\n      <\/p>\n      <p>\n        <strong>Invoice Fly Estimate Software<\/strong> helps streamline the\n        entire process, from creating estimates to getting paid.\n      <\/p>\n    <\/div>\n\n    <div class=\"vs-grid\">\n      <div class=\"vs-cell\">\n        <div class=\"vs-card\">\n          <div class=\"vs-icon\">\n            <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n              <polygon points=\"13 2 3 14 12 14 11 22 21 10 12 10 13 2\" \/>\n            <\/svg>\n          <\/div>\n          <h3>Create custom estimates faster<\/h3>\n          <p>\n            Templates require you to manually enter customer information,\n            services, pricing, and taxes every time you create a new estimate.\n            With Invoice Fly, you can save customer details, service\n            descriptions, rates, and tax settings to generate professional\n            estimates in minutes.\n          <\/p>\n        <\/div>\n      <\/div>\n\n      <div class=\"vs-cell\">\n        <div class=\"vs-card\">\n          <div class=\"vs-icon\">\n            <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n              <line x1=\"22\" y1=\"2\" x2=\"11\" y2=\"13\" \/>\n              <polygon points=\"22 2 15 22 11 13 2 9 22 2\" \/>\n            <\/svg>\n          <\/div>\n          <h3>Send and track estimates in one place<\/h3>\n          <p>\n            Instead of downloading PDFs and manually following up with\n            customers, Invoice Fly allows you to send estimates directly to\n            clients and track their status. See when estimates are sent, viewed,\n            accepted, or declined so you always know where each opportunity\n            stands.\n          <\/p>\n        <\/div>\n      <\/div>\n\n      <div class=\"vs-cell\">\n        <div class=\"vs-card\">\n          <div class=\"vs-icon\">\n            <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n              <polyline points=\"23 4 23 10 17 10\" \/>\n              <polyline points=\"1 20 1 14 7 14\" \/>\n              <path d=\"M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15\" \/>\n            <\/svg>\n          <\/div>\n          <h3>Convert estimates into invoices instantly<\/h3>\n          <p>\n            Once a client approves an estimate, there's no need to recreate the\n            information from scratch. Invoice Fly lets you convert approved\n            estimates into invoices with a single click, saving time and\n            reducing data entry errors.\n          <\/p>\n        <\/div>\n      <\/div>\n\n      <div class=\"vs-cell\">\n        <div class=\"vs-card\">\n          <div class=\"vs-icon\">\n            <svg width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n              <rect x=\"3\" y=\"3\" width=\"7\" height=\"7\" \/>\n              <rect x=\"14\" y=\"3\" width=\"7\" height=\"7\" \/>\n              <rect x=\"14\" y=\"14\" width=\"7\" height=\"7\" \/>\n              <rect x=\"3\" y=\"14\" width=\"7\" height=\"7\" \/>\n            <\/svg>\n          <\/div>\n          <h3>Manage your entire workflow from one platform<\/h3>\n          <p>\n            Keep estimates, invoices, customers, payments, and business records\n            organized in one place. By centralizing your workflow, Invoice Fly\n            helps you stay productive, improve visibility across projects, and\n            spend less time on administrative tasks.\n          <\/p>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- ==================== AI ESTIMATE GENERATOR ==================== -->\n  <section class=\"aigen\">\n    <div class=\"aigen-inner\">\n      <div class=\"aigen-text\">\n        <span class=\"aigen-tag\">\n          <svg viewBox=\"0 0 24 24\" fill=\"currentColor\">\n            <path d=\"M12 2l1.6 5.2L19 9l-5.4 1.8L12 16l-1.6-5.2L5 9l5.4-1.8L12 2z\" \/>\n          <\/svg>\n          AI-Powered\n        <\/span>\n        <h2>Try Our Free AI-Powered Estimate Generator<\/h2>\n        <p>\n          Need to create an estimate quickly? Use the Invoice Fly Estimate\n          Generator to generate professional estimates online in minutes.\n        <\/p>\n        <p>\n          Simply enter your customer details, services, pricing, and tax\n          information. Our AI-powered generator helps autofill estimate details,\n          calculate totals automatically, and create polished estimates ready to\n          download or send.\n        <\/p>\n        <ul class=\"aigen-list\">\n          <li>\n            <span><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\" \/><\/svg><\/span>\n            Create estimates online instantly\n          <\/li>\n          <li>\n            <span><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\" \/><\/svg><\/span>\n            Autofill estimate details with AI\n          <\/li>\n          <li>\n            <span><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\" \/><\/svg><\/span>\n            Add your logo and branding\n          <\/li>\n          <li>\n            <span><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\" \/><\/svg><\/span>\n            Automatically calculate taxes and totals\n          <\/li>\n          <li>\n            <span><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\" \/><\/svg><\/span>\n            Download professional PDF estimates\n          <\/li>\n          <li>\n            <span><svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"20 6 9 17 4 12\" \/><\/svg><\/span>\n            Send estimates directly to customers\n          <\/li>\n        <\/ul>\n        <a\n          href=\"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/\"\n          class=\"btn btn-primary btn-lg\"\n        >\n          Try the Estimate Generator \u2192\n        <\/a>\n      <\/div>\n\n      <div class=\"aigen-visual\">\n        <div class=\"aigen-mock\">\n          <div class=\"aigen-mock-head\">\n            <div class=\"aigen-logo\"><\/div>\n            <div class=\"aigen-docid\">\n              Estimate\n              <b>#EST-0042<\/b>\n            <\/div>\n          <\/div>\n\n          <div class=\"aigen-field\">\n            <div class=\"aigen-field-label\">Bill to<\/div>\n            <div class=\"aigen-bar\" style=\"width: 64%\"><\/div>\n          <\/div>\n          <div class=\"aigen-field\">\n            <div class=\"aigen-field-label\">Services<\/div>\n            <div class=\"aigen-bar is-ai\"><\/div>\n            <div class=\"aigen-bar is-ai\"><\/div>\n          <\/div>\n          <div class=\"aigen-field\">\n            <div class=\"aigen-field-label\">Tax &amp; totals<\/div>\n            <div class=\"aigen-bar\" style=\"width: 46%\"><\/div>\n          <\/div>\n\n          <div class=\"aigen-total\">\n            <span>Total<\/span>\n            <b>$4,280.00<\/b>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <!-- ==================== BEST PRACTICES ==================== -->\n  <section class=\"bp\">\n    <div class=\"bp-inner\">\n      <div class=\"bp-intro\">\n        <span class=\"bp-tag\">\n          <svg width=\"13\" height=\"13\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n            <polygon points=\"12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2\" \/>\n          <\/svg>\n          Best practices\n        <\/span>\n        <h2>Estimate Template Best Practices<\/h2>\n        <p>\n          A professional estimate can help you win more business, reduce\n          misunderstandings, and create a smoother experience for your clients.\n          Whether you're creating estimates for services, projects, or products,\n          following a few best practices can make a significant difference.\n        <\/p>\n      <\/div>\n\n      <div class=\"bp-list\">\n        <div class=\"bp-item\">\n          <span class=\"bp-num\"><\/span>\n          <div class=\"bp-body\">\n            <span class=\"bp-kicker\">Clarity<\/span>\n            <h3>Use Clear and Detailed Descriptions<\/h3>\n            <p>\n              Avoid vague line items such as \"Project Work\" or \"Consulting\n              Services.\" Instead, describe exactly what is included so clients\n              understand the value they're receiving.\n            <\/p>\n          <\/div>\n        <\/div>\n\n        <div class=\"bp-item\">\n          <span class=\"bp-num\"><\/span>\n          <div class=\"bp-body\">\n            <span class=\"bp-kicker\">Pricing<\/span>\n            <h3>Present Pricing Transparently<\/h3>\n            <p>\n              Break down costs into logical sections whenever possible. Clear\n              pricing helps build trust and reduces questions during the\n              approval process.\n            <\/p>\n          <\/div>\n        <\/div>\n\n        <div class=\"bp-item\">\n          <span class=\"bp-num\"><\/span>\n          <div class=\"bp-body\">\n            <span class=\"bp-kicker\">Branding<\/span>\n            <h3>Add Your Branding<\/h3>\n            <p>\n              Including your logo, company name, and brand colors creates a more\n              professional appearance and helps reinforce your business\n              identity.\n            <\/p>\n          <\/div>\n        <\/div>\n\n        <div class=\"bp-item\">\n          <span class=\"bp-num\"><\/span>\n          <div class=\"bp-body\">\n            <span class=\"bp-kicker\">Timing<\/span>\n            <h3>Set an Expiration Date<\/h3>\n            <p>\n              Material costs, availability, and project schedules can change. An\n              estimate expiration date helps protect your pricing while\n              encouraging clients to make timely decisions.\n            <\/p>\n          <\/div>\n        <\/div>\n\n        <div class=\"bp-item\">\n          <span class=\"bp-num\"><\/span>\n          <div class=\"bp-body\">\n            <span class=\"bp-kicker\">Terms<\/span>\n            <h3>Define Your Terms<\/h3>\n            <p>\n              Clearly outline payment terms, project assumptions, and any\n              important conditions. This helps avoid misunderstandings later in\n              the project.\n            <\/p>\n          <\/div>\n        <\/div>\n\n        <div class=\"bp-item\">\n          <span class=\"bp-num\"><\/span>\n          <div class=\"bp-body\">\n            <span class=\"bp-kicker\">Approval<\/span>\n            <h3>Make Approval Simple<\/h3>\n            <p>\n              The easier it is for a client to accept an estimate, the faster\n              projects move forward. Include clear next steps and approval\n              instructions.\n            <\/p>\n          <\/div>\n        <\/div>\n\n        <div class=\"bp-item\">\n          <span class=\"bp-num\"><\/span>\n          <div class=\"bp-body\">\n            <span class=\"bp-kicker\">Follow-up<\/span>\n            <h3>Follow Up Promptly<\/h3>\n            <p>\n              Many estimates are approved after a follow-up. Reaching out a few\n              days after sending an estimate can significantly improve\n              conversion rates.\n            <\/p>\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <section class=\"faq\">\n    <div class=\"faq-inner\">\n      <div class=\"faq-head\">\n        <h2>Common Questions About Our Estimate Templates<\/h2>\n        <p>Answers to what contractors actually ask before they download.<\/p>\n      <\/div>\n      <div class=\"faq-list\">\n        <div class=\"faq-item open\">\n          <div class=\"faq-q\">\n            Are these estimate templates really free?<span class=\"faq-icon\"\n              ><svg\n                width=\"12\"\n                height=\"12\"\n                viewBox=\"0 0 12 12\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.8\"\n                stroke-linecap=\"round\"\n              >\n                <line x1=\"6\" y1=\"1\" x2=\"6\" y2=\"11\" \/>\n                <line x1=\"1\" y1=\"6\" x2=\"11\" y2=\"6\" \/><\/svg\n            ><\/span>\n          <\/div>\n          <div class=\"faq-a\">\n            Yes. Every estimate template on this page is completely free to\n            download and use. No sign-up, credit card, or trial required.\n            Customize, save, and send as many estimates as you need. If you're\n            looking for digital signatures, online approvals, payment\n            collection, and estimate tracking, those features are available in\n            the Invoice Fly app.\n          <\/div>\n        <\/div>\n        <div class=\"faq-item\">\n          <div class=\"faq-q\">\n            Can I add my own markup and tax?<span class=\"faq-icon\"\n              ><svg\n                width=\"12\"\n                height=\"12\"\n                viewBox=\"0 0 12 12\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.8\"\n                stroke-linecap=\"round\"\n              >\n                <line x1=\"6\" y1=\"1\" x2=\"6\" y2=\"11\" \/>\n                <line x1=\"1\" y1=\"6\" x2=\"11\" y2=\"6\" \/><\/svg\n            ><\/span>\n          <\/div>\n          <div class=\"faq-a\">\n            Yes. You can customize labor rates, material costs, markup\n            percentages, discounts, and sales tax. Excel and Google Sheets\n            templates automatically calculate totals for you, while Word and PDF\n            templates can be edited manually. The Invoice Fly app can\n            automatically calculate sales tax based on your location and job\n            details.\n          <\/div>\n        <\/div>\n        <div class=\"faq-item\">\n          <div class=\"faq-q\">\n            How do I include a deposit or down payment?<span class=\"faq-icon\"\n              ><svg\n                width=\"12\"\n                height=\"12\"\n                viewBox=\"0 0 12 12\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.8\"\n                stroke-linecap=\"round\"\n              >\n                <line x1=\"6\" y1=\"1\" x2=\"6\" y2=\"11\" \/>\n                <line x1=\"1\" y1=\"6\" x2=\"11\" y2=\"6\" \/><\/svg\n            ><\/span>\n          <\/div>\n          <div class=\"faq-a\">\n            Most contractors include a deposit requirement directly within the\n            estimate. You can add either a percentage or fixed amount, along\n            with any payment terms. In the Invoice Fly app, you can save deposit\n            policies as defaults and collect deposits online when a customer\n            approves the estimate.\n          <\/div>\n        <\/div>\n        <div class=\"faq-item\">\n          <div class=\"faq-q\">\n            How do I handle estimate revisions and change orders?<span\n              class=\"faq-icon\"\n              ><svg\n                width=\"12\"\n                height=\"12\"\n                viewBox=\"0 0 12 12\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.8\"\n                stroke-linecap=\"round\"\n              >\n                <line x1=\"6\" y1=\"1\" x2=\"6\" y2=\"11\" \/>\n                <line x1=\"1\" y1=\"6\" x2=\"11\" y2=\"6\" \/><\/svg\n            ><\/span>\n          <\/div>\n          <div class=\"faq-a\">\n            Simply duplicate the original estimate and update the scope of work,\n            pricing, labor, or materials. This helps maintain a clear record of\n            project changes. In the Invoice Fly app, change orders can be\n            tracked separately from the original estimate and approved digitally\n            by the customer.\n          <\/div>\n        <\/div>\n        <div class=\"faq-item\">\n          <div class=\"faq-q\">\n            Can I use these templates for residential and commercial\n            projects?<span class=\"faq-icon\"\n              ><svg\n                width=\"12\"\n                height=\"12\"\n                viewBox=\"0 0 12 12\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.8\"\n                stroke-linecap=\"round\"\n              >\n                <line x1=\"6\" y1=\"1\" x2=\"6\" y2=\"11\" \/>\n                <line x1=\"1\" y1=\"6\" x2=\"11\" y2=\"6\" \/><\/svg\n            ><\/span>\n          <\/div>\n          <div class=\"faq-a\">\n            Yes. These estimate templates can be used for both residential and\n            commercial projects across a wide range of industries and trades.\n            Whether you're preparing estimates for repairs, renovations,\n            maintenance work, installations, or large-scale projects, the\n            templates can be customized to match your business and project\n            requirements.\n          <\/div>\n        <\/div>\n        <div class=\"faq-item\">\n          <div class=\"faq-q\">\n            Can I include photos from the job site?<span class=\"faq-icon\"\n              ><svg\n                width=\"12\"\n                height=\"12\"\n                viewBox=\"0 0 12 12\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.8\"\n                stroke-linecap=\"round\"\n              >\n                <line x1=\"6\" y1=\"1\" x2=\"6\" y2=\"11\" \/>\n                <line x1=\"1\" y1=\"6\" x2=\"11\" y2=\"6\" \/><\/svg\n            ><\/span>\n          <\/div>\n          <div class=\"faq-a\">\n            Yes. You can add photos, project images, and supporting\n            documentation to your estimate. In Word and Google Docs templates,\n            simply insert images directly into the document. With the Invoice\n            Fly app, photos taken on-site automatically attach to the estimate,\n            making it easy to document project conditions, completed work, or\n            before-and-after progress.\n          <\/div>\n        <\/div>\n        <div class=\"faq-item\">\n          <div class=\"faq-q\">\n            Can clients sign estimates electronically?<span class=\"faq-icon\"\n              ><svg\n                width=\"12\"\n                height=\"12\"\n                viewBox=\"0 0 12 12\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.8\"\n                stroke-linecap=\"round\"\n              >\n                <line x1=\"6\" y1=\"1\" x2=\"6\" y2=\"11\" \/>\n                <line x1=\"1\" y1=\"6\" x2=\"11\" y2=\"6\" \/><\/svg\n            ><\/span>\n          <\/div>\n          <div class=\"faq-a\">\n            Templates can be printed, signed, and returned by the customer. If\n            you'd like digital signatures, online approvals, automatic\n            notifications, and signed PDF records, the Invoice Fly app provides\n            electronic signing directly from a customer's phone, tablet, or\n            computer.\n          <\/div>\n        <\/div>\n        <div class=\"faq-item\">\n          <div class=\"faq-q\">\n            Which format should I download?<span class=\"faq-icon\"\n              ><svg\n                width=\"12\"\n                height=\"12\"\n                viewBox=\"0 0 12 12\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.8\"\n                stroke-linecap=\"round\"\n              >\n                <line x1=\"6\" y1=\"1\" x2=\"6\" y2=\"11\" \/>\n                <line x1=\"1\" y1=\"6\" x2=\"11\" y2=\"6\" \/><\/svg\n            ><\/span>\n          <\/div>\n          <div class=\"faq-a\">\n            PDF is best for sending a professional, locked estimate. Word and\n            Google Docs are ideal for editing text and branding. Excel and\n            Google Sheets are best if you want formulas that automatically\n            calculate totals, markup, and taxes. Every template is available in\n            all formats. If you'd rather create, send, and track estimates\n            online, you can do everything from the Invoice Fly app.\n          <\/div>\n        <\/div>\n        <div class=\"faq-item\">\n          <div class=\"faq-q\">\n            Can I add my logo and company branding?<span class=\"faq-icon\"\n              ><svg\n                width=\"12\"\n                height=\"12\"\n                viewBox=\"0 0 12 12\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.8\"\n                stroke-linecap=\"round\"\n              >\n                <line x1=\"6\" y1=\"1\" x2=\"6\" y2=\"11\" \/>\n                <line x1=\"1\" y1=\"6\" x2=\"11\" y2=\"6\" \/><\/svg\n            ><\/span>\n          <\/div>\n          <div class=\"faq-a\">\n            Absolutely. Every estimate template can be customized with your\n            logo, company details, business information, payment terms, and\n            branding. Invoice Fly users can save their branding once and\n            automatically apply it to every estimate and invoice.\n          <\/div>\n        <\/div>\n        <div class=\"faq-item\">\n          <div class=\"faq-q\">\n            What's the difference between an estimate and a quote?<span\n              class=\"faq-icon\"\n              ><svg\n                width=\"12\"\n                height=\"12\"\n                viewBox=\"0 0 12 12\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.8\"\n                stroke-linecap=\"round\"\n              >\n                <line x1=\"6\" y1=\"1\" x2=\"6\" y2=\"11\" \/>\n                <line x1=\"1\" y1=\"6\" x2=\"11\" y2=\"6\" \/><\/svg\n            ><\/span>\n          <\/div>\n          <div class=\"faq-a\">\n            An estimate provides an approximate project cost that may change if\n            labor, materials, or project scope changes. A quote is typically a\n            fixed price offered to a customer. The Invoice Fly app supports both\n            estimate and invoice workflows, making it easy to manage projects\n            from proposal to payment.\n          <\/div>\n        <\/div>\n        <div class=\"faq-item\">\n          <div class=\"faq-q\">\n            Can I convert an estimate into an invoice?<span class=\"faq-icon\"\n              ><svg\n                width=\"12\"\n                height=\"12\"\n                viewBox=\"0 0 12 12\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"1.8\"\n                stroke-linecap=\"round\"\n              >\n                <line x1=\"6\" y1=\"1\" x2=\"6\" y2=\"11\" \/>\n                <line x1=\"1\" y1=\"6\" x2=\"11\" y2=\"6\" \/><\/svg\n            ><\/span>\n          <\/div>\n          <div class=\"faq-a\">\n            Yes. You can manually use the estimate details to create an invoice\n            once the work is approved. In the Invoice Fly app, approved\n            estimates can be converted into invoices instantly, helping you save\n            time and get paid faster.\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <section class=\"final-cta\">\n    <div class=\"final-cta-wrap\">\n      <div class=\"final-cta-content\">\n        <h2>Stop losing jobs to better-looking estimates.<\/h2>\n        <p>\n          Download Invoice Fly \u2014 free for the first 5 estimates a month, no card\n          required. 12,000+ contractors use it daily.\n        <\/p>\n        <div class=\"final-cta-ctas\">\n          <a\n            href=\"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\"\n            class=\"btn btn-primary btn-lg\"\n            target=\"_blank\"\n            rel=\"noopener\"\n          >\n            Get the free app\n            <svg\n              width=\"14\"\n              height=\"14\"\n              viewBox=\"0 0 24 24\"\n              fill=\"none\"\n              stroke=\"currentColor\"\n              stroke-width=\"2.5\"\n            >\n              <path d=\"M5 12h14M13 5l7 7-7 7\" \/>\n            <\/svg>\n          <\/a>\n          <a\n            href=\"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/\"\n            class=\"btn btn-outline btn-lg\"\n            >Try the free generator<\/a\n          >\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/section>\n\n  <div\n    class=\"modal-backdrop\"\n    id=\"iftpl-modal\"\n    role=\"dialog\"\n    aria-modal=\"true\"\n    aria-hidden=\"true\"\n  >\n    <div class=\"modal\">\n      <button\n        type=\"button\"\n        class=\"modal-close\"\n        id=\"iftpl-modal-close\"\n        aria-label=\"Close\"\n      >\n        <svg\n          width=\"18\"\n          height=\"18\"\n          viewBox=\"0 0 24 24\"\n          fill=\"none\"\n          stroke=\"currentColor\"\n          stroke-width=\"2.5\"\n        >\n          <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" \/>\n          <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" \/>\n        <\/svg>\n      <\/button>\n      <div class=\"modal-grid\">\n        <div class=\"modal-preview\">\n          <img decoding=\"async\" id=\"iftpl-modal-img\" src=\"\" alt=\"\" loading=\"lazy\" \/>\n        <\/div>\n        <div class=\"modal-body\">\n          <div class=\"modal-tag\">Free download<\/div>\n          <h3 class=\"modal-title\" id=\"iftpl-modal-title\"><\/h3>\n          <p class=\"modal-desc\" id=\"iftpl-modal-desc\"><\/p>\n          <div class=\"modal-section-title\">Pick your format<\/div>\n          <div class=\"modal-formats\" id=\"iftpl-modal-formats\"><\/div>\n          <div class=\"modal-cta-stack\">\n            <a\n              href=\"\"\n              class=\"btn btn-primary\"\n              id=\"iftpl-modal-app\"\n              target=\"_blank\"\n              rel=\"noopener\"\n            >\n              Get the free app\n              <svg\n                width=\"14\"\n                height=\"14\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                stroke=\"currentColor\"\n                stroke-width=\"2.5\"\n              >\n                <path d=\"M5 12h14M13 5l7 7-7 7\" \/>\n              <\/svg>\n            <\/a>\n            <a\n              href=\"\"\n              class=\"btn btn-outline\"\n              id=\"iftpl-modal-generator\"\n              target=\"_blank\"\n              rel=\"noopener\"\n              >Edit online for free \u2192<\/a\n            >\n          <\/div>\n        <\/div>\n      <\/div>\n    <\/div>\n  <\/div>\n<\/div>\n\n<script>\n  (function () {\n    \"use strict\";\n\n    \/\/ ============================================\n    \/\/ INVOICE FLY \u2014 ESTIMATE TEMPLATES WIDGET v3\n    \/\/ Contractor-focused redesign.\n    \/\/ ============================================\n\n    const TEMPLATES = [\n      {\n        name: \"Modern Black Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"black\",\n        style: \"modern\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Modern-Azure-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Modern-Azure-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Modern-Black-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Modern-Black-Estimate-Template-.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1-stVY3fNufgsUi5POPeyEJShWvrmHDIXr-uazBa1Guw\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1bUfzMTNFOP2Jw50uD-CXxAoiZ9J6iZy-2cSpLd7fjeE\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator:\n          \"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/?theme=modernFrameBlack\",\n        industries:\n          \"autorepair business carpentry cleaning concrete construction consulting contractor electrical freelance handyman hvac landscaping\",\n      },\n      {\n        name: \"Minimal Blue Geometric Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"blue\",\n        style: \"minimalist\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Blue-Geometric-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Blue-Geometric-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Blue-Geometric-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Blue-Geometric-Estimate-Template-.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1FP8-m4nfVAkgkVJReAj7adVvE0HQO5OEuLzzZPzv84s\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1HWUVyLYiPp7clig5DaG02DNo2tgdSBMxsqViqGkPGps\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator:\n          \"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/?theme=geometricBlue\",\n        industries:\n          \"business catering cleaning concrete consulting contractor freelance lawncare mechanic painting photography\",\n      },\n      {\n        name: \"Classic Black Estimate Template\",\n        desc: \"This classic Estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"black\",\n        style: \"classic\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Black-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Black-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Black-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Black-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1FFCZIdmXzBIPoLPS9tqyxXcNLL-xcNjP4SD_xvI09rE\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1gqEe7yIj-11dBUJVslj0AAHOH8mP-m6-oDBVszrdRTE\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator:\n          \"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/?theme=classicV2Black\",\n        industries:\n          \"autorepair carpentry concrete construction electrical handyman hvac landscaping lawncare mechanic plumbing roofing trucking\",\n      },\n      {\n        name: \"Classic Forest Green Estimate Template\",\n        desc: \"This classic Estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"green\",\n        style: \"classic\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Forest-Green-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Forest-Green-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Forest-Green-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Forest-Green-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1JSM-HirGOMdCMKNcLplFHlGHYwz0ZuKdAarIVGla_zs\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1t59JESUNT11796DJbETYM5AB6msIij3dvSXOHU1M2Vo\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator:\n          \"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/?theme=classicGreen\",\n        industries:\n          \"catering cleaning concrete consulting contractor freelance painting photography plumbing therapy treeremoval\",\n      },\n      {\n        name: \"Classic Olive Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"green\",\n        style: \"classic\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Olive-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Olive-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Olive-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Olive-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/d\/1I2REncHkRPNC9NW27vrWMAK5cO62QYpLEpmVe2uS62M\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/12ZnjxIwGnG-2mOtDDz6iEFNVdhzQLiWf_L18mOACcCk\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator:\n          \"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/?theme=classicV3Olive\",\n        industries:\n          \"autorepair business carpentry concrete construction electrical freelance handyman hvac mechanic roofing selfemployedcleaner trucking\",\n      },\n      {\n        name: \"Classic Purple Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"purple\",\n        style: \"classic\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Purple-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Purple-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Purple-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Purple-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1jzwdhCnEyMH9Gx4_EB3Z4yfLL1U3JUvr7DxyW1q1yoQ\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1P4pfF3PiS8V6y_inmJodzWeOWvI_E0CSqvmWWdFT8RU\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator:\n          \"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/?theme=classicPurple\",\n        industries:\n          \"business catering consulting lawncare painting photography plumbing propertymanagement therapy treeremoval\",\n      },\n      {\n        name: \"Minimal Beige Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"brown\",\n        style: \"minimalist\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Beige-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Beige-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Beige-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Beige-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/12LSqIu_-6qTCLYrizHLVcr5CPWhl75YYMBd6MwOdVQE\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1fY4dQ_X2ejYVN9cEVNAMvzNKwRvmAKdg8NJdLVxaVWE\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator:\n          \"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/?theme=beigeMinimal\",\n        industries:\n          \"autorepair carpentry cleaning concrete construction contractor electrical hvac landscaping mechanic roofing selfemployedcleaner trucking\",\n      },\n      {\n        name: \"Modern Blue Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"blue\",\n        style: \"modern\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Modern-Blue-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Modern-Blue-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Modern-Blue-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Modern-Blue-Estimate-Template-.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1MCKAIwAVf0k0GC-hncCP8YVTXk4y8RZQ-Nty867OPRE\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1Z8vGT9wg_ii704fz_7jawvCilrq_p4S7SadTr47n_MM\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator:\n          \"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/?theme=blueOutline\",\n        industries:\n          \"business carpentry catering freelance handyman hvac lawncare painting photography propertymanagement therapy treeremoval\",\n      },\n      {\n        name: \"Modern Soft Peach Estimate template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"orange\",\n        style: \"modern\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Modern-Soft-Peach-Estimate-template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Modern-Soft-Peach-Estimate-template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Modern-Soft-Peach-Estimate-template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Modern-Soft-Peach-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/13aDqlWkPpEbSDrN8XfFYQMGbdXtde4UQzIY8VXxyE70\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1l8BxUr_wp58PLq7BjbOlE-F3g25JH2mVwzaV-eWLEgA\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator:\n          \"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/?theme=modernFrameBeige\",\n        industries:\n          \"autorepair carpentry concrete construction consulting electrical hvac landscaping mechanic plumbing roofing selfemployedcleaner trucking\",\n      },\n      {\n        name: \"Classic Blue Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"blue\",\n        style: \"classic\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Blue-Estimate-Template-.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Blue-Estimate-Template-.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Blue-Estimate-Template-.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Blue-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/d\/1Qaj0nUaykpNe_Ha5BHKKeTg7doXsl-3qmneRB3j4giE\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1ryNXmnpD7MyfjgjA4P54MHmLjlBfyZ7UB9nQEz_YL0Y\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator:\n          \"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/?theme=classicV2Blue\",\n        industries:\n          \"business carpentry catering cleaning concrete contractor freelance handyman hvac painting photography propertymanagement therapy\",\n      },\n      {\n        name: \"Classic Red Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"red\",\n        style: \"classic\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Red-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Red-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Red-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Red-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1zriyhzAJwJFgY0-yunvMx8gydaXd6I0CUaZwo6o9AqI\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1IWGn1sochgeoRWkqePX5TNa1BD4-CaSdcNPcwKt3TUU\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator:\n          \"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/?theme=classicV3Red\",\n        industries:\n          \"autorepair carpentry concrete construction consulting electrical freelance hvac lawncare mechanic roofing treeremoval trucking\",\n      },\n      {\n        name: \"Minimal Azure Geometric Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"blue\",\n        style: \"minimalist\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Azure-Geometric-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Azure-Geometric-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Azure-Geometric-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Azure-Geometric-Estimate-Template-.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1mHIxkMaYguDfDVcMpXvTejH4WGUsiQmCudJ8aLAcrEc\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/19JZ3-K1HxhQNvhs0EWPiR2oM4RhFTAUuaumJCzzmwBk\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator:\n          \"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/?theme=geometricAzure\",\n        industries:\n          \"business carpentry catering cleaning handyman hvac landscaping painting photography plumbing propertymanagement selfemployedcleaner\",\n      },\n      {\n        name: \"Classic Green & Beige Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"green\",\n        style: \"classic\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Green-Beige-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Green-Beige-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Green-Beige-Estimate-Template.docx\",\n        excel: \"\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1rOQzr18OGcH7uGVfYEmsDIRNh3iZWy8-VIA5P5WAdjo\/copy\",\n        sheet: \"\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator:\n          \"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/?theme=classicV2Green\",\n        industries:\n          \"autorepair concrete consulting contractor electrical freelance hvac mechanic roofing therapy treeremoval trucking\",\n      },\n      {\n        name: \"Minimal Sky Blue Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"blue\",\n        style: \"minimalist\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Light-Sky-blue-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Light-Sky-blue-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Light-Sky-blue-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Light-Sky-Blue-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1p5KnW0uFn1zk1YVo91mA-IpmgPzyJciElSN080dwbF8\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1LxAGbr4g2LA9a9Mg_KgNMlfMUBd_UIFvoMeJOuQCVgo\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator:\n          \"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/?theme=lightblueMinimal\",\n        industries:\n          \"business carpentry catering cleaning concrete construction handyman hvac landscaping lawncare photography plumbing selfemployedcleaner\",\n      },\n      {\n        name: \"Classic Beige Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"brown\",\n        style: \"classic\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Beige-Brown-Estimate-Template-.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Beige-Brown-Estimate-Template-.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Beige-Brown-Estimate-Template-.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Beige-brown-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1FeP_9J5OBGmcRRMYKZ6Rmou8_BeYf2oIRzM-Bk7fNCo\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/17WMNJj6Z5J0Az2hcRdmk2mNKyVH0ObpdMxkna6hBAk4\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator:\n          \"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/?theme=classicBeige\",\n        industries:\n          \"autorepair concrete consulting contractor electrical freelance hvac painting propertymanagement roofing therapy trucking\",\n      },\n      {\n        name: \"Modern Black Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"black\",\n        style: \"modern\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Modern-Black-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Modern-Black-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Modern-Black-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Modern-Black-Estimate-Template-II-.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1Dyotwb30NM8v2YiO4jxqNa8hPTraFjSaxoIL1t4Mg44\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1HTazxJN9j3bsLvFekpGqsOGECjzDqOUB_fxFKDMlHOI\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator:\n          \"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/?theme=blackOutline\",\n        industries:\n          \"business carpentry catering cleaning concrete construction landscaping lawncare mechanic photography selfemployedcleaner treeremoval\",\n      },\n      {\n        name: \"Modern Teal Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"blue\",\n        style: \"modern\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Modern-Teal-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Modern-Teal-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Modern-Teal-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Modern-Teal-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1n1a599pzLuxxL_dBiBImoDfFaKE9daEsdg-S7UlJQsU\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1-KCMPoEbKVdhTXPzZKeeQYpfWJhmbet32z3uSle7wOE\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator:\n          \"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/?theme=modernFrameBlue\",\n        industries:\n          \"autorepair carpentry concrete consulting contractor electrical handyman hvac painting plumbing roofing therapy trucking\",\n      },\n      {\n        name: \"Classic Purplish Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"purple\",\n        style: \"classic\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Purplish-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Purplish-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Purplish-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Purplish-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1Q7aaBee_4GCPPp8S67m-bfXgAl5bsOBKYfV73s5q6F8\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1htYzrKfx0QfpgVBdJzUq093NecUCGuK8xX5FDLaZ28g\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator:\n          \"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/?theme=classicV3Purple\",\n        industries:\n          \"business catering cleaning freelance landscaping lawncare mechanic propertymanagement selfemployedcleaner treeremoval\",\n      },\n      {\n        name: \"Minimal Lime Green Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"green\",\n        style: \"minimalist\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Lime-Green-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Lime-Green-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Lime-Green-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Lime-Green-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1j8tOJe0nqDhyBTZNdDxdfRTUcIFBI-oBF-7abQUti0I\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1OXWGrq_rnOnr721fapPuXOr6FPhtsKyXjHLfYVQHVxU\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator:\n          \"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/?theme=limeMinimal\",\n        industries:\n          \"autorepair carpentry concrete construction consulting contractor electrical handyman hvac photography roofing therapy trucking\",\n      },\n      {\n        name: \"Minimal Brown Geometric Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"brown\",\n        style: \"minimalist\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Brown-Geometric-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Brown-Geometric-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Brown-Geometric-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Minimal-Brown-Geometric-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/16a2ayJ2rVDXGt15iQb4u_J8MmHOfG-hK-quma57aMiM\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1GgvIOODw30TxIM3t-S8G_AS38wDlq4O_uiVy5YntJbg\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator:\n          \"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/?theme=geometricBrown\",\n        industries:\n          \"business catering cleaning freelance landscaping painting plumbing propertymanagement selfemployedcleaner treeremoval\",\n      },\n      {\n        name: \"Sky Blue Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"blue\",\n        style: \"modern\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Sky-Blue-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Sky-Blue-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Sky-Blue-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Sky-Blue-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1L4wUqJDM4ur8FMsAqP6PzEsh9dRHawU7LAYWeoiakAU\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1r3dOU9lX8ssKbHXXU-Bw1cTyR3TncineXOBcK9vDyfI\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator: \"\",\n        industries:\n          \"autorepair carpentry concrete construction contractor electrical handyman hvac lawncare mechanic painting roofing trucking\",\n      },\n      {\n        name: \"Classic Modern Light Lemon Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"yellow\",\n        style: \"classic\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Light-Lemon-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Light-Lemon-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Light-Lemon-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Light-Lemon-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1q8SLTxJjcHNpUDXG1ik8r2nRCBa2bnTOyxTNJr68DbA\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1LusF9YDM5myHvqMUeWQN7O6Mf4ODIMFY14h3uWLVGCA\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator: \"\",\n        industries:\n          \"business catering cleaning consulting freelance photography plumbing propertymanagement therapy treeremoval\",\n      },\n      {\n        name: \"Clean Gradient Blue Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"blue\",\n        style: \"modern\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Clean-Gradient-Blue-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Clean-Gradient-Blue-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Clean-Gradient-Blue-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Clean-Gradient-Blue-Estimate-Template-.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1v_uT5X--J0-AIdQXymPHpz6fsxWs-sNJWzBQeMUK5ww\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1Fk9r3lhVNpACfUtpxhUypx26T-1qn9ElZ2NvAg-qpfs\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator: \"\",\n        industries:\n          \"autorepair carpentry concrete construction electrical handyman hvac landscaping lawncare painting roofing selfemployedcleaner trucking\",\n      },\n      {\n        name: \"Blue and Yellow Estimate Template\",\n        desc: \"This classic invoice template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"blue\",\n        style: \"minimalist\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Blue-and-Yellow-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Blue-and-Yellow-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Blue-and-Yellow-Estimate-Template.docx\",\n        excel: \"\",\n        gdoc: \"\",\n        sheet: \"\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator: \"\",\n        industries:\n          \"business catering cleaning concrete consulting contractor mechanic photography plumbing propertymanagement therapy\",\n      },\n      {\n        name: \"Azure Dark Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"blue\",\n        style: \"modern\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Azure-Dark-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Azure-Dark-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Azure-Dark-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Azure-Dark-Invoice-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1161bcWLnJlLPSPiNdWx_bWrRYlE14rpRV02dQ08aKaQ\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1wZZbpJTpd9lvHYxbnK73dgjCVkDF-3hIcEo_mn66MsY\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator: \"\",\n        industries:\n          \"autorepair carpentry concrete construction electrical freelance handyman hvac landscaping painting roofing treeremoval trucking\",\n      },\n      {\n        name: \"Clean Teal & Yellow Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"blue\",\n        style: \"modern\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Clean-Teal-Yellow-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Clean-Teal-Yellow-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Clean-Teal-Yellow-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Clean-Teal-Yellow-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1JkpH06cWTXmXMSXzt-HZdJz3Gfrt3zKqAY9k4GHbpfo\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/10MYM54lvN6Vp-UuQf7vygFI0G2X4jbJcpGIaHwUL-qA\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator: \"\",\n        industries:\n          \"business catering cleaning concrete consulting contractor lawncare mechanic photography propertymanagement selfemployedcleaner\",\n      },\n      {\n        name: \"Floral Purple Estimate Template\",\n        desc: \"This classic invoice template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"purple\",\n        style: \"simple\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Floral-Purple-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Floral-Purple-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Floral-Purple-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Floral-Purple-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1oSFhd9fwAcsIRD3g_Ni43L2u6c8EcA1Oiies6Aad_yw\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1A4qZTdNht1EPs-Icl8h84ia7i1Ohao6mhZOHauB-lUo\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator: \"\",\n        industries:\n          \"autorepair carpentry concrete construction electrical freelance hvac landscaping lawncare painting plumbing therapy trucking\",\n      },\n      {\n        name: \"Artistic Purple Invoice Template\",\n        desc: \"This classic invoice template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"purple\",\n        style: \"modern\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Artistic-Purple-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Artistic-Purple-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Artistic-Purple-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Artistic-Purple-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1Pj6XNZO9u7gdT63yj4_uze47b5YKshMTg8tFFWs-thw\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1XvlaRkJYZWLrMcQ3oLY-4AT-zGaDW0jCjTWGZoICH4Y\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator: \"\",\n        industries:\n          \"business carpentry catering cleaning concrete consulting contractor handyman hvac mechanic roofing selfemployedcleaner treeremoval\",\n      },\n      {\n        name: \"Clean Red & Pink Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"red\",\n        style: \"modern\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Clean-Red-Pink-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Clean-Red-Pink-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Clean-Red-Pink-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Clean-Red-Pink-Estimate-Template-.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1ww9TDeu0Z3apJOjvRqMggYjXEbRg86864pyLxXA7NCc\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1fhwXoZ-9_o7ocwyvy1dpb-gS9omSKKMKzVUwmmEX27A\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator: \"\",\n        industries:\n          \"autorepair carpentry concrete construction electrical freelance hvac landscaping painting photography plumbing therapy trucking\",\n      },\n      {\n        name: \"Classic Modern Black Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"black\",\n        style: \"classic\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Modern-Black-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Modern-Black-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Modern-Black-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Classic-Modern-Black-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1pxffmsXV_ig5LfFyc__7X2P0gUVR-PFhkPZ7UF3V3KE\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1Ss33pyjhFClco4dQEiDbjsF_wrJ6HCjncpmc1erL5Yw\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator: \"\",\n        industries:\n          \"business carpentry catering cleaning concrete consulting contractor handyman hvac lawncare mechanic selfemployedcleaner treeremoval\",\n      },\n      {\n        name: \"Floral Green Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"green\",\n        style: \"simple\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Floral-Green-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Floral-Green-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Floral-Green-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Floral-Green-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1rN1gzmgESDaCfcTOpXqmY_rsnd4Y1KTrIYcokE901P4\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1PknCsWAIvtSeKxQ7rWTsdneOP6wrFXJpVDZ7Ybdpvoo\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator: \"\",\n        industries:\n          \"autorepair carpentry concrete construction electrical freelance handyman hvac lawncare photography plumbing roofing trucking\",\n      },\n      {\n        name: \"Blue and Red Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"blue\",\n        style: \"minimalist\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Blue-and-Red-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Blue-and-Red-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Blue-and-Red-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Blue-and-Red-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1J-iCVthiMVULmoet_qOgDXwZDZ0r6YUazYgbLtilMrs\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1w81lRrDbD9ZYEA0l6q-DvZAhFV-1wXvl15GNzGT8x5g\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator: \"\",\n        industries:\n          \"business catering cleaning concrete consulting contractor landscaping mechanic painting selfemployedcleaner treeremoval\",\n      },\n      {\n        name: \"Clean Gradient Purple Estimate Template\",\n        desc: \"This classic estimate template allows you to calculate the total price for each item based on its quantity. You can customize the logo and information to your brand.\",\n        color: \"purple\",\n        style: \"modern\",\n        image:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Clean-Gradient-Purple-Estimate-Template.jpg\",\n        pdf: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Clean-Gradient-Purple-Estimate-Template.pdf\",\n        word: \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Clean-Gradient-Purple-Estimate-Template.docx\",\n        excel:\n          \"https:\/\/invoicefly.com\/wp-content\/uploads\/2026\/04\/Clean-Gradient-Purple-Estimate-Template.xlsx\",\n        gdoc: \"https:\/\/docs.google.com\/document\/u\/1\/d\/1rEj_Cdu1x-bS7zY1lw-eUQq-qvcgg2CIcKgw9SJOlJM\/copy\",\n        sheet:\n          \"https:\/\/docs.google.com\/spreadsheets\/u\/1\/d\/1XPAV7X1K5eGelXKKRszHVVBWN49ENUz_as9RZ_wdv-k\/copy\",\n        app: \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\",\n        generator: \"\",\n        industries:\n          \"autorepair carpentry concrete construction electrical freelance handyman hvac landscaping lawncare plumbing therapy treeremoval\",\n      },\n    ];\n\n    \/\/ Featured trades highlighted in the band at top\n    const FEATURED_TRADES = [\n      { value: \"roofing\", label: \"Roofing\", icon: \"roof\" },\n      { value: \"hvac\", label: \"HVAC\", icon: \"hvac\" },\n      { value: \"electrical\", label: \"Electrical\", icon: \"electrical\" },\n      { value: \"plumbing\", label: \"Plumbing\", icon: \"plumbing\" },\n      { value: \"concrete\", label: \"Concrete\", icon: \"concrete\" },\n      { value: \"carpentry\", label: \"Carpentry\", icon: \"carpentry\" },\n      { value: \"construction\", label: \"Construction\", icon: \"construction\" },\n      { value: \"contractor\", label: \"Contractor\", icon: \"contractor\" },\n    ];\n\n    \/\/ Icons by name \u2014 sourced from Lucide (lucide.dev), stroke-width adjusted to 1.8\n    const TRADE_ICONS = {\n      \/\/ Lucide \"house\" \u2014 peaked roof + door cutout, unmistakably roofing\n      roof: '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8\"\/><path d=\"M3 10a2 2 0 0 1 .709-1.528l7-6a2 2 0 0 1 2.582 0l7 6A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z\"\/><\/svg>',\n      \/\/ Lucide \"wind\" \u2014 three flowing air curves, universal HVAC \/ climate symbol\n      hvac: '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12.8 19.6A2 2 0 1 0 14 16H2\"\/><path d=\"M17.5 8a2.5 2.5 0 1 1 2 4H2\"\/><path d=\"M9.8 4.4A2 2 0 1 1 11 8H2\"\/><\/svg>',\n      \/\/ Lucide \"zap\" \u2014 sharp lightning bolt, the #1 electrical symbol worldwide\n      electrical:\n        '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M4 14a1 1 0 0 1-.78-1.63l9.9-10.2a.5.5 0 0 1 .86.46l-1.92 6.02A1 1 0 0 0 13 10h7a1 1 0 0 1 .78 1.63l-9.9 10.2a.5.5 0 0 1-.86-.46l1.92-6.02A1 1 0 0 0 11 14z\"\/><\/svg>',\n      \/\/ Lucide \"droplet\" \u2014 water drop, instantly readable as plumbing \/ water work\n      plumbing:\n        '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M12 22a7 7 0 0 0 7-7c0-2-1-3.9-3-5.5s-3.5-4-4-6.5c-.5 2.5-2 4.9-4 6.5C6 11.1 5 13 5 15a7 7 0 0 0 7 7z\"\/><\/svg>',\n      \/\/ Lucide \"brick-wall\" \u2014 staggered masonry grid, concrete \/ block work\n      concrete:\n        '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><rect x=\"3\" y=\"3\" width=\"18\" height=\"18\" rx=\"2\"\/><path d=\"M12 9v6M16 15v6M16 3v6M3 15h18M3 9h18M8 15v6M8 3v6\"\/><\/svg>',\n      \/\/ Lucide \"hammer\" \u2014 carpenter's claw hammer, clean and unmistakable\n      carpentry:\n        '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"m15 12-8.373 8.373a1 1 0 1 1-3-3L12 9\"\/><path d=\"m18 15 4-4\"\/><path d=\"m21.5 11.5-1.914-1.914A2 2 0 0 1 19 8.172v-.344a2 2 0 0 0-.586-1.414l-1.657-1.657A6 6 0 0 0 12.516 3H9l1.243 1.243A6 6 0 0 1 12 8.485V10l2 2h1.172a2 2 0 0 1 1.414.586L18.5 14.5\"\/><\/svg>',\n      \/\/ Lucide \"hard-hat\" \u2014 safety helmet, the universal construction symbol\n      construction:\n        '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M10 10V5a1 1 0 0 1 1-1h2a1 1 0 0 1 1 1v5\"\/><path d=\"M14 6a6 6 0 0 1 6 6v3\"\/><path d=\"M4 15v-3a6 6 0 0 1 6-6\"\/><path d=\"M2 15h20a1 1 0 0 1 1 1v2a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1v-2a1 1 0 0 1 1-1\"\/><\/svg>',\n      \/\/ Lucide \"toolbox\" \u2014 tool case with handle, perfect for a general contractor\n      contractor:\n        '<svg viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.8\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M16 6a2 2 0 0 1 1.414.586l4 4A2 2 0 0 1 22 12v7a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2v-7a2 2 0 0 1 .586-1.414l4-4A2 2 0 0 1 8 6z\"\/><path d=\"M16 6V4a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v2\"\/><path d=\"M2 14h20\"\/><path d=\"M16 12v4M8 12v4\"\/><\/svg>',\n    };\n\n    const STYLES = [\n      { value: \"classic\", label: \"Classic\" },\n      { value: \"minimalist\", label: \"Minimalist\" },\n      { value: \"modern\", label: \"Modern\" },\n      { value: \"simple\", label: \"Simple\" },\n    ];\n    const COLORS = [\n      { value: \"black\", label: \"Black\", hex: \"#0a1628\" },\n      { value: \"blue\", label: \"Blue\", hex: \"#0044bb\" },\n      { value: \"brown\", label: \"Brown\", hex: \"#8b6f47\" },\n      { value: \"green\", label: \"Green\", hex: \"#16a34a\" },\n      { value: \"orange\", label: \"Orange\", hex: \"#ff8c00\" },\n      { value: \"purple\", label: \"Purple\", hex: \"#6b46c1\" },\n      { value: \"red\", label: \"Red\", hex: \"#c40000\" },\n      { value: \"yellow\", label: \"Yellow\", hex: \"#eab308\" },\n    ];\n    const FORMATS = [\n      { value: \"pdf\", label: \"PDF\" },\n      { value: \"word\", label: \"Word\" },\n      { value: \"excel\", label: \"Excel\" },\n      { value: \"gdoc\", label: \"Google Docs\" },\n      { value: \"sheet\", label: \"Google Sheets\" },\n    ];\n    const INDUSTRIES = [\n      { value: \"autorepair\", label: \"Auto Repair\" },\n      { value: \"business\", label: \"Business\" },\n      { value: \"carpentry\", label: \"Carpentry\" },\n      { value: \"catering\", label: \"Catering\" },\n      { value: \"cleaning\", label: \"Cleaning\" },\n      { value: \"concrete\", label: \"Concrete\" },\n      { value: \"construction\", label: \"Construction\" },\n      { value: \"consulting\", label: \"Consulting\" },\n      { value: \"contractor\", label: \"Contractor\" },\n      { value: \"electrical\", label: \"Electrical\" },\n      { value: \"freelance\", label: \"Freelance\" },\n      { value: \"handyman\", label: \"Handyman\" },\n      { value: \"hvac\", label: \"HVAC\" },\n      { value: \"landscaping\", label: \"Landscaping\" },\n      { value: \"lawncare\", label: \"Lawn Care\" },\n      { value: \"mechanic\", label: \"Mechanic\" },\n      { value: \"painting\", label: \"Painting\" },\n      { value: \"photography\", label: \"Photography\" },\n      { value: \"plumbing\", label: \"Plumbing\" },\n      { value: \"propertymanagement\", label: \"Property Management\" },\n      { value: \"roofing\", label: \"Roofing\" },\n      { value: \"selfemployedcleaner\", label: \"Self-Employed Cleaner\" },\n      { value: \"therapy\", label: \"Therapy\" },\n      { value: \"treeremoval\", label: \"Tree Removal\" },\n      { value: \"trucking\", label: \"Trucking\" },\n    ];\n\n    const FILTER_MAP = {\n      style: STYLES,\n      color: COLORS,\n      format: FORMATS,\n      industry: INDUSTRIES,\n    };\n\n    const state = {\n      search: \"\",\n      style: new Set(),\n      color: new Set(),\n      format: new Set(),\n      industry: new Set(),\n    };\n\n    let root = null;\n    let initialized = false;\n\n    function $(sel) {\n      return root ? root.querySelector(sel) : null;\n    }\n    function $$(sel) {\n      return root ? Array.from(root.querySelectorAll(sel)) : [];\n    }\n\n    function esc(s) {\n      return String(s == null ? \"\" : s).replace(\/[&<>\"']\/g, function (c) {\n        return {\n          \"&\": \"&amp;\",\n          \"<\": \"&lt;\",\n          \">\": \"&gt;\",\n          '\"': \"&quot;\",\n          \"'\": \"&#39;\",\n        }[c];\n      });\n    }\n\n    function styleLabel(v) {\n      const f = STYLES.find(function (s) {\n        return s.value === v;\n      });\n      return f ? f.label : v;\n    }\n    function colorLabel(v) {\n      const f = COLORS.find(function (c) {\n        return c.value === v;\n      });\n      return f ? f.label : v;\n    }\n    function formatLabel(v) {\n      const f = FORMATS.find(function (c) {\n        return c.value === v;\n      });\n      return f ? f.label : v;\n    }\n    function industryLabel(v) {\n      const f = INDUSTRIES.find(function (c) {\n        return c.value === v;\n      });\n      return f ? f.label : v;\n    }\n\n    \/\/ ============================================\n    \/\/ BUILD TRADE BAND\n    \/\/ ============================================\n    function buildTrades() {\n      const container = $(\"#iftpl-trades\");\n      if (!container || container.dataset.built === \"true\") return;\n\n      \/\/ Count templates per featured trade\n      const counts = {};\n      FEATURED_TRADES.forEach(function (t) {\n        counts[t.value] = 0;\n      });\n      TEMPLATES.forEach(function (t) {\n        const inds = (t.industries || \"\").split(\/\\s+\/);\n        FEATURED_TRADES.forEach(function (ft) {\n          if (inds.indexOf(ft.value) !== -1) counts[ft.value]++;\n        });\n      });\n\n      container.innerHTML = FEATURED_TRADES.map(function (t) {\n        const icon = TRADE_ICONS[t.icon] || \"\";\n        return (\n          '<button type=\"button\" class=\"trade\" data-trade=\"' +\n          esc(t.value) +\n          '\">' +\n          '<span class=\"trade-icon\">' +\n          icon +\n          \"<\/span>\" +\n          '<span class=\"trade-label\">' +\n          esc(t.label) +\n          \"<\/span>\" +\n          '<span class=\"trade-count\">' +\n          counts[t.value] +\n          \" templates<\/span>\" +\n          \"<\/button>\"\n        );\n      }).join(\"\");\n      container.dataset.built = \"true\";\n\n      \/\/ Wire up clicks: toggle industry filter\n      container.querySelectorAll(\".trade\").forEach(function (btn) {\n        btn.addEventListener(\"click\", function () {\n          const v = btn.dataset.trade;\n          if (state.industry.has(v)) {\n            state.industry.delete(v);\n            btn.classList.remove(\"active\");\n          } else {\n            \/\/ Clear other trades, set this one\n            container.querySelectorAll(\".trade.active\").forEach(function (b) {\n              b.classList.remove(\"active\");\n              state.industry.delete(b.dataset.trade);\n            });\n            state.industry.add(v);\n            btn.classList.add(\"active\");\n          }\n          syncOptionStates();\n          renderGrid();\n          renderActiveFilters();\n          updateFilterButtons();\n          \/\/ Scroll to gallery\n          const gal = $(\".gallery\");\n          if (gal) gal.scrollIntoView({ behavior: \"smooth\", block: \"start\" });\n        });\n      });\n    }\n\n    function syncTradeBand() {\n      const container = $(\"#iftpl-trades\");\n      if (!container) return;\n      container.querySelectorAll(\".trade\").forEach(function (b) {\n        b.classList.toggle(\"active\", state.industry.has(b.dataset.trade));\n      });\n    }\n\n    \/\/ ============================================\n    \/\/ BUILD FILTER OPTIONS ONCE\n    \/\/ ============================================\n    function buildFilterOptions() {\n      Object.keys(FILTER_MAP).forEach(function (key) {\n        const container = root.querySelector(\n          '.tb-options[data-options=\"' + key + '\"]',\n        );\n        if (!container || container.dataset.built === \"true\") return;\n        const opts = FILTER_MAP[key];\n        const html = opts\n          .map(function (opt) {\n            const swatch =\n              key === \"color\"\n                ? '<span class=\"swatch\" style=\"background:' +\n                  opt.hex +\n                  '\"><\/span>'\n                : \"\";\n            return (\n              '<button type=\"button\" class=\"tb-option\" data-value=\"' +\n              esc(opt.value) +\n              '\">' +\n              '<span class=\"checkbox\"><svg width=\"10\" height=\"10\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"3\"><polyline points=\"20 6 9 17 4 12\"\/><\/svg><\/span>' +\n              swatch +\n              \"<span>\" +\n              esc(opt.label) +\n              \"<\/span>\" +\n              \"<\/button>\"\n            );\n          })\n          .join(\"\");\n        container.innerHTML = html;\n        container.dataset.built = \"true\";\n\n        const options = container.querySelectorAll(\".tb-option\");\n        options.forEach(function (opt) {\n          opt.addEventListener(\"click\", function (e) {\n            e.preventDefault();\n            e.stopPropagation();\n            const value = opt.dataset.value;\n            if (state[key].has(value)) {\n              state[key].delete(value);\n              opt.classList.remove(\"on\");\n            } else {\n              state[key].add(value);\n              opt.classList.add(\"on\");\n            }\n            if (key === \"industry\") syncTradeBand();\n            renderGrid();\n            renderActiveFilters();\n            updateFilterButtons();\n          });\n        });\n      });\n    }\n\n    function syncOptionStates() {\n      Object.keys(FILTER_MAP).forEach(function (key) {\n        const container = root.querySelector(\n          '.tb-options[data-options=\"' + key + '\"]',\n        );\n        if (!container) return;\n        container.querySelectorAll(\".tb-option\").forEach(function (opt) {\n          opt.classList.toggle(\"on\", state[key].has(opt.dataset.value));\n        });\n      });\n    }\n\n    \/\/ ============================================\n    \/\/ FILTER LOGIC\n    \/\/ ============================================\n    function templateMatches(t) {\n      if (state.search) {\n        const q = state.search.toLowerCase();\n        if (t.name.toLowerCase().indexOf(q) === -1) return false;\n      }\n      if (state.style.size && !state.style.has(t.style)) return false;\n      if (state.color.size && !state.color.has(t.color)) return false;\n      if (state.format.size) {\n        let any = false;\n        state.format.forEach(function (fmt) {\n          if (t[fmt]) any = true;\n        });\n        if (!any) return false;\n      }\n      if (state.industry.size) {\n        const tInd = (t.industries || \"\").split(\/\\s+\/);\n        let allMatch = true;\n        state.industry.forEach(function (ind) {\n          if (tInd.indexOf(ind) === -1) allMatch = false;\n        });\n        if (!allMatch) return false;\n      }\n      return true;\n    }\n\n    \/\/ ============================================\n    \/\/ RENDER GRID\n    \/\/ ============================================\n    function renderGrid() {\n      const grid = $(\"#iftpl-grid\");\n      if (!grid) return;\n      \/\/ one delegated click listener (instead of re-binding every card on each render)\n      if (!grid.dataset.delegated) {\n        grid.dataset.delegated = \"1\";\n        grid.addEventListener(\"click\", function (e) {\n          const card = e.target.closest(\".template-card\");\n          if (!card || !grid.contains(card)) return;\n          const idx = parseInt(card.dataset.idx, 10);\n          if (!isNaN(idx)) openModal(idx);\n        });\n      }\n      const filtered = TEMPLATES.filter(templateMatches);\n      const shown = $(\"#iftpl-shown\"),\n        total = $(\"#iftpl-total\");\n      if (shown) shown.textContent = filtered.length;\n      if (total) total.textContent = TEMPLATES.length;\n\n      if (filtered.length === 0) {\n        const shuffled = TEMPLATES.slice().sort(function () {\n          return Math.random() - 0.5;\n        });\n        const random10 = shuffled.slice(0, 10);\n        grid.innerHTML =\n          '<div class=\"empty-suggest-header\">' +\n          '<div class=\"empty-state-title\">No templates found for that search.<\/div>' +\n          '<div class=\"empty-state-text\">Here are some templates you might like:<\/div>' +\n          \"<\/div>\" +\n          random10\n            .map(function (t) {\n              const realIdx = TEMPLATES.indexOf(t);\n              const fmts = [\"pdf\", \"word\", \"excel\", \"gdoc\", \"sheet\"]\n                .filter(function (f) {\n                  return t[f];\n                })\n                .map(function (f) {\n                  const label = {\n                    pdf: \"PDF\",\n                    word: \"DOC\",\n                    excel: \"XLS\",\n                    gdoc: \"GDC\",\n                    sheet: \"GSH\",\n                  }[f];\n                  return '<span class=\"tc-fmt\">' + label + \"<\/span>\";\n                })\n                .join(\"\");\n              return (\n                '<button type=\"button\" class=\"template-card\" data-idx=\"' +\n                realIdx +\n                '\" aria-label=\"Open ' +\n                esc(t.name) +\n                '\">' +\n                '<div class=\"tc-thumb\">' +\n                '<span class=\"tc-badge\">Free<\/span>' +\n                '<div class=\"tc-img-clip\">' +\n                '<img src=\"' +\n                esc(t.image) +\n                '\" alt=\"' +\n                esc(t.name) +\n                '\" loading=\"lazy\" decoding=\"async\">' +\n                \"<\/div>\" +\n                '<div class=\"tc-overlay\"><span class=\"tc-overlay-btn\">View &amp; download <svg width=\"12\" height=\"12\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\"><path d=\"M5 12h14M13 5l7 7-7 7\"\/><\/svg><\/span><\/div>' +\n                \"<\/div>\" +\n                '<div class=\"tc-info\">' +\n                '<div style=\"flex:1;min-width:0\">' +\n                '<div class=\"tc-name\">' +\n                esc(t.name) +\n                \"<\/div>\" +\n                '<div class=\"tc-meta\">' +\n                esc(styleLabel(t.style)) +\n                '<span class=\"dot\">\u00b7<\/span>' +\n                esc(colorLabel(t.color)) +\n                \"<\/div>\" +\n                '<div class=\"tc-formats\">' +\n                fmts +\n                \"<\/div>\" +\n                \"<\/div>\" +\n                '<div class=\"tc-arrow\"><svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\"><path d=\"M5 12h14M13 5l7 7-7 7\"\/><\/svg><\/div>' +\n                \"<\/div>\" +\n                \"<\/button>\"\n              );\n            })\n            .join(\"\");\n        return;\n      }\n\n      grid.innerHTML = filtered\n        .map(function (t) {\n          const realIdx = TEMPLATES.indexOf(t);\n          \/\/ Build formats indicator\n          const fmts = [\"pdf\", \"word\", \"excel\", \"gdoc\", \"sheet\"]\n            .filter(function (f) {\n              return t[f];\n            })\n            .map(function (f) {\n              const label = {\n                pdf: \"PDF\",\n                word: \"DOC\",\n                excel: \"XLS\",\n                gdoc: \"GDC\",\n                sheet: \"GSH\",\n              }[f];\n              return '<span class=\"tc-fmt\">' + label + \"<\/span>\";\n            })\n            .join(\"\");\n          return (\n            '<button type=\"button\" class=\"template-card\" data-idx=\"' +\n            realIdx +\n            '\" aria-label=\"Open ' +\n            esc(t.name) +\n            '\">' +\n            '<div class=\"tc-thumb\">' +\n            '<span class=\"tc-badge\">Free<\/span>' +\n            '<div class=\"tc-img-clip\">' +\n            '<img src=\"' +\n            esc(t.image) +\n            '\" alt=\"' +\n            esc(t.name) +\n            '\" loading=\"lazy\" decoding=\"async\">' +\n            \"<\/div>\" +\n            '<div class=\"tc-overlay\"><span class=\"tc-overlay-btn\">View &amp; download <svg width=\"12\" height=\"12\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\"><path d=\"M5 12h14M13 5l7 7-7 7\"\/><\/svg><\/span><\/div>' +\n            \"<\/div>\" +\n            '<div class=\"tc-info\">' +\n            '<div style=\"flex:1;min-width:0\">' +\n            '<div class=\"tc-name\">' +\n            esc(t.name) +\n            \"<\/div>\" +\n            '<div class=\"tc-meta\">' +\n            esc(styleLabel(t.style)) +\n            '<span class=\"dot\">\u00b7<\/span>' +\n            esc(colorLabel(t.color)) +\n            \"<\/div>\" +\n            '<div class=\"tc-formats\">' +\n            fmts +\n            \"<\/div>\" +\n            \"<\/div>\" +\n            '<div class=\"tc-arrow\"><svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\"><path d=\"M5 12h14M13 5l7 7-7 7\"\/><\/svg><\/div>' +\n            \"<\/div>\" +\n            \"<\/button>\"\n          );\n        })\n        .join(\"\");\n    }\n\n    \/\/ ============================================\n    \/\/ ACTIVE FILTER CHIPS\n    \/\/ ============================================\n    function renderActiveFilters() {\n      const container = $(\"#iftpl-active-filters\");\n      const wrap = $(\"#iftpl-sticky-chips-wrap\");\n      if (!container) return;\n      const chips = [];\n      state.style.forEach(function (v) {\n        chips.push({ type: \"style\", value: v, label: styleLabel(v) });\n      });\n      state.color.forEach(function (v) {\n        chips.push({ type: \"color\", value: v, label: colorLabel(v) });\n      });\n      state.format.forEach(function (v) {\n        chips.push({ type: \"format\", value: v, label: formatLabel(v) });\n      });\n      state.industry.forEach(function (v) {\n        chips.push({ type: \"industry\", value: v, label: industryLabel(v) });\n      });\n\n      if (chips.length === 0) {\n        container.innerHTML = \"\";\n        if (wrap) wrap.classList.remove(\"has-chips\");\n        return;\n      }\n      if (wrap) wrap.classList.add(\"has-chips\");\n\n      container.innerHTML =\n        chips\n          .map(function (c) {\n            return (\n              '<span class=\"active-filter-chip\" data-type=\"' +\n              c.type +\n              '\" data-value=\"' +\n              esc(c.value) +\n              '\">' +\n              esc(c.label) +\n              '<button type=\"button\" class=\"x\" aria-label=\"Remove\">\u2715<\/button>' +\n              \"<\/span>\"\n            );\n          })\n          .join(\"\") +\n        '<button type=\"button\" class=\"clear-all-btn\" data-iftpl-action=\"clear-all\">Clear all<\/button>';\n\n      container\n        .querySelectorAll(\".active-filter-chip .x\")\n        .forEach(function (xb) {\n          xb.addEventListener(\"click\", function (e) {\n            e.stopPropagation();\n            const chip = xb.closest(\".active-filter-chip\");\n            const type = chip.dataset.type,\n              value = chip.dataset.value;\n            state[type].delete(value);\n            syncOptionStates();\n            if (type === \"industry\") syncTradeBand();\n            renderGrid();\n            renderActiveFilters();\n            updateFilterButtons();\n          });\n        });\n      const ca = container.querySelector('[data-iftpl-action=\"clear-all\"]');\n      if (ca) ca.addEventListener(\"click\", clearAllFilters);\n    }\n\n    function clearAllFilters() {\n      state.search = \"\";\n      state.style.clear();\n      state.color.clear();\n      state.format.clear();\n      state.industry.clear();\n      const si = $(\"#iftpl-search\");\n      if (si) si.value = \"\";\n      syncOptionStates();\n      syncTradeBand();\n      renderGrid();\n      renderActiveFilters();\n      updateFilterButtons();\n    }\n\n    function updateFilterButtons() {\n      [\"style\", \"color\", \"format\", \"industry\"].forEach(function (key) {\n        const filter = root.querySelector(\n          '.tb-filter[data-filter=\"' + key + '\"]',\n        );\n        if (!filter) return;\n        const countEl = filter.querySelector(\".count\");\n        const btn = filter.querySelector(\".tb-filter-btn\");\n        const n = state[key].size;\n        if (n > 0) {\n          countEl.textContent = n;\n          countEl.style.display = \"\";\n          btn.classList.add(\"has-selection\");\n        } else {\n          countEl.style.display = \"none\";\n          btn.classList.remove(\"has-selection\");\n        }\n      });\n    }\n\n    \/\/ ============================================\n    \/\/ FILTER DROPDOWN OPEN\/CLOSE\n    \/\/ ============================================\n    let outsideHandlerInstalled = false;\n\n    function isMobile() {\n      return window.matchMedia(\"(max-width: 768px)\").matches;\n    }\n\n    function closeAllDropdowns() {\n      $$(\".tb-filter\").forEach(function (f) {\n        f.classList.remove(\"open\");\n      });\n      const backdrop = $(\"#iftpl-tb-backdrop\");\n      if (backdrop) backdrop.classList.remove(\"show\");\n    }\n\n    function openDropdown(filter) {\n      closeAllDropdowns();\n      filter.classList.add(\"open\");\n      if (isMobile()) {\n        const backdrop = $(\"#iftpl-tb-backdrop\");\n        if (backdrop) backdrop.classList.add(\"show\");\n      }\n    }\n\n    function setupFilterDropdowns() {\n      $$(\".tb-filter\").forEach(function (filter) {\n        const btn = filter.querySelector(\".tb-filter-btn\");\n        const dropdown = filter.querySelector(\".tb-dropdown\");\n        const filterKey = filter.dataset.filter;\n        const clearBtn = filter.querySelector(\".tb-clear\");\n        const applyBtn = filter.querySelector(\".tb-apply\");\n        const mobileClose = filter.querySelector(\".tb-mobile-close\");\n\n        if (!btn || btn.dataset.iftplWired === \"1\") return;\n        btn.dataset.iftplWired = \"1\";\n\n        btn.addEventListener(\"click\", function (e) {\n          e.preventDefault();\n          e.stopPropagation();\n          if (filter.classList.contains(\"open\")) {\n            closeAllDropdowns();\n          } else {\n            openDropdown(filter);\n          }\n        });\n\n        dropdown.addEventListener(\"click\", function (e) {\n          e.stopPropagation();\n        });\n\n        if (clearBtn)\n          clearBtn.addEventListener(\"click\", function (e) {\n            e.stopPropagation();\n            state[filterKey].clear();\n            syncOptionStates();\n            if (filterKey === \"industry\") syncTradeBand();\n            renderGrid();\n            renderActiveFilters();\n            updateFilterButtons();\n          });\n        if (applyBtn)\n          applyBtn.addEventListener(\"click\", function (e) {\n            e.stopPropagation();\n            closeAllDropdowns();\n          });\n        if (mobileClose)\n          mobileClose.addEventListener(\"click\", function (e) {\n            e.stopPropagation();\n            closeAllDropdowns();\n          });\n      });\n\n      if (!outsideHandlerInstalled) {\n        outsideHandlerInstalled = true;\n        document.addEventListener(\n          \"click\",\n          function (e) {\n            if (!root || !root.contains(e.target)) {\n              closeAllDropdowns();\n              return;\n            }\n            if (\n              !e.target.closest(\".tb-filter\") &&\n              !e.target.closest(\".tb-mobile-backdrop\")\n            ) {\n              closeAllDropdowns();\n            }\n          },\n          false,\n        );\n\n        document.addEventListener(\"keydown\", function (e) {\n          if (e.key === \"Escape\") {\n            closeAllDropdowns();\n            closeModal();\n          }\n        });\n\n        const backdrop = root.querySelector(\"#iftpl-tb-backdrop\");\n        if (backdrop) backdrop.addEventListener(\"click\", closeAllDropdowns);\n      }\n    }\n\n    function setupSearch() {\n      const input = $(\"#iftpl-search\");\n      if (!input || input.dataset.iftplWired === \"1\") return;\n      input.dataset.iftplWired = \"1\";\n      let t;\n      input.addEventListener(\"input\", function (e) {\n        clearTimeout(t);\n        t = setTimeout(function () {\n          state.search = e.target.value.trim();\n          renderGrid();\n        }, 120);\n      });\n    }\n\n    \/\/ ============================================\n    \/\/ MODAL\n    \/\/ ============================================\n    function openModal(idx) {\n      const t = TEMPLATES[idx];\n      if (!t) return;\n      const m = $(\"#iftpl-modal\");\n      const img = $(\"#iftpl-modal-img\");\n      const title = $(\"#iftpl-modal-title\");\n      const desc = $(\"#iftpl-modal-desc\");\n      const appBtn = $(\"#iftpl-modal-app\");\n      const genBtn = $(\"#iftpl-modal-generator\");\n      const fmts = $(\"#iftpl-modal-formats\");\n      if (!m || !img || !title || !fmts) return;\n\n      img.src = t.image;\n      img.alt = t.name;\n      title.textContent = t.name;\n      desc.textContent = t.desc;\n      appBtn.href = t.app || \"https:\/\/invoicefly.onelink.me\/AeUs\/qohijf8g\";\n      genBtn.href =\n        t.generator ||\n        \"https:\/\/invoicefly.com\/free-resources\/free-generators\/free-estimate-generator\/\";\n\n      var SVG_PDF =\n        '<svg viewBox=\"0 0 56 54\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"28\" height=\"28\"><path d=\"M9.9 0h36.2C51.6 0 56 4.4 56 9.9v34.2c0 5.5-4.4 9.9-9.9 9.9H9.9C4.4 54 0 49.6 0 44.1V9.9C0 4.4 4.4 0 9.9 0z\" fill=\"#fa0f00\"\/><path d=\"M45 31.2c-2.6-2.7-9.7-1.6-11.4-1.4-2.5-2.4-4.2-5.3-4.8-6.3.9-2.7 1.5-5.4 1.6-8.3 0-2.5-1-5.2-3.8-5.2-1 0-1.9.6-2.4 1.4-1.2 2.1-.7 6.3 1.2 10.6-1.1 3.1-2.1 6.1-4.9 11.4-2.9 1.2-9 4-9.5 7-.2.9.1 1.8.8 2.5.7.6 1.6.9 2.5.9 3.7 0 7.3-5.1 9.8-9.4 2.1-.7 5.4-1.7 8.7-2.3 3.9 3.4 7.3 3.9 9.1 3.9 2.4 0 3.3-1 3.6-1.9.5-1 .2-2.1-.5-2.9zm-2.5 1.7c-.1.7-1 1.4-2.6 1-1.9-.5-3.6-1.4-5.1-2.6 1.3-.2 4.2-.5 6.3-.1.8.2 1.6.7 1.4 1.7zM25.8 12.3c.2-.3.5-.5.8-.5.9 0 1.1 1.1 1.1 2-.1 2.1-.5 4.2-1.2 6.2-1.5-4-1.2-6.8-.7-7.7zm-.2 19.4c.8-1.6 1.9-4.4 2.3-5.6.9 1.5 2.4 3.3 3.2 4.1 0 .1-3.1.7-5.5 1.5zm-5.9 4c-2.3 3.8-4.7 6.2-6 6.2-.2 0-.4-.1-.6-.2-.3-.2-.4-.5-.3-.9.3-1.4 2.9-3.3 6.9-5.1z\" fill=\"#fff\"\/><\/svg>';\n      var SVG_WORD =\n        '<svg viewBox=\"-0.13 0 32.13 32\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"28\" height=\"28\"><path d=\"M30.667 2H9.333A1.333 1.333 0 0 0 8 3.333V9l12 3.5L32 9V3.333A1.333 1.333 0 0 0 30.667 2z\" fill=\"#41a5ee\"\/><path d=\"M32 9H8v7l12 3.5L32 16z\" fill=\"#2b7cd3\"\/><path d=\"M32 16H8v7l12 3.5L32 23z\" fill=\"#185abd\"\/><path d=\"M32 23H8v5.667A1.333 1.333 0 0 0 9.333 30h21.334A1.333 1.333 0 0 0 32 28.667z\" fill=\"#103f91\"\/><path d=\"M16.667 7H8v19h8.667A1.337 1.337 0 0 0 18 24.667V8.333A1.337 1.337 0 0 0 16.667 7z\" opacity=\".1\"\/><path d=\"M15.667 8H8v19h7.667A1.337 1.337 0 0 0 17 25.667V9.333A1.337 1.337 0 0 0 15.667 8z\" opacity=\".2\"\/><path d=\"M15.667 8H8v17h7.667A1.337 1.337 0 0 0 17 23.667V9.333A1.337 1.337 0 0 0 15.667 8z\" opacity=\".2\"\/><path d=\"M14.667 8H8v17h6.667A1.337 1.337 0 0 0 16 23.667V9.333A1.337 1.337 0 0 0 14.667 8z\" opacity=\".2\"\/><path d=\"M1.333 8h13.334A1.333 1.333 0 0 1 16 9.333v13.334A1.333 1.333 0 0 1 14.667 24H1.333A1.333 1.333 0 0 1 0 22.667V9.333A1.333 1.333 0 0 1 1.333 8z\" fill=\"#185abd\"\/><path d=\"M11.95 21h-1.8l-2.1-6.9-2.2 6.9h-1.8l-2-10h1.8l1.4 7 2.1-6.8h1.5l2 6.8 1.4-7h1.7z\" fill=\"#fff\"\/><\/svg>';\n      var SVG_EXCEL =\n        '<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"28\" height=\"28\" viewBox=\"0 0 110.037 107.5\"><path d=\"M57.55 0h7.425v10c12.513 0 25.025.025 37.537-.038 2.113.087 4.438-.062 6.275 1.2 1.287 1.85 1.138 4.2 1.225 6.325-.062 21.7-.037 43.388-.024 65.075-.062 3.638.337 7.35-.425 10.938-.5 2.6-3.625 2.662-5.713 2.75-12.95.037-25.912-.025-38.875 0v11.25h-7.763c-19.05-3.463-38.138-6.662-57.212-10V10.013C19.188 6.675 38.375 3.388 57.55 0z\" fill=\"#207245\"\/><path d=\"M64.975 13.75h41.25V92.5h-41.25V85h10v-8.75h-10v-5h10V62.5h-10v-5h10v-8.75h-10v-5h10V35h-10v-5h10v-8.75h-10v-7.5z\" fill=\"#fff\"\/><path d=\"M79.975 21.25h17.5V30h-17.5v-8.75z\" fill=\"#207245\"\/><path d=\"M37.025 32.962c2.825-.2 5.663-.375 8.5-.512a2607.344 2607.344 0 0 1-10.087 20.487c3.438 7 6.949 13.95 10.399 20.95a716.28 716.28 0 0 1-9.024-.575c-2.125-5.213-4.713-10.25-6.238-15.7-1.699 5.075-4.125 9.862-6.074 14.838-2.738-.038-5.476-.15-8.213-.263C19.5 65.9 22.6 59.562 25.912 53.312c-2.812-6.438-5.9-12.75-8.8-19.15 2.75-.163 5.5-.325 8.25-.475 1.862 4.888 3.899 9.712 5.438 14.725 1.649-5.312 4.112-10.312 6.225-15.45z\" fill=\"#fff\"\/><path d=\"M79.975 35h17.5v8.75h-17.5V35zM79.975 48.75h17.5v8.75h-17.5v-8.75zM79.975 62.5h17.5v8.75h-17.5V62.5zM79.975 76.25h17.5V85h-17.5v-8.75z\" fill=\"#207245\"\/><\/svg>';\n      var SVG_GDOC =\n        '<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 1818.2 2500\" width=\"28\" height=\"28\"><path fill=\"#4285F4\" d=\"M1136.4,0H170.4C79.6,0,0,79.5,0,170.5v2159.1c0,90.9,79.5,170.5,170.5,170.5h1477.3c90.9,0,170.5-79.5,170.5-170.5V681.8l-397.7-284.1L1136.4,0z\"\/><path fill=\"#F1F1F1\" d=\"M454.5,1818.2h909.1v-113.6H454.6L454.5,1818.2z M454.5,2045.5h681.8v-113.6H454.5V2045.5z M454.5,1250v113.6h909.1V1250H454.5z M454.5,1590.9h909.1v-113.6H454.6L454.5,1590.9z\"\/><path fill=\"#A1C2FA\" d=\"M1136.4,0v511.4c0,90.9,79.5,170.4,170.4,170.4h511.4L1136.4,0z\"\/><\/svg>';\n      var SVG_SHEET =\n        '<svg viewBox=\"0 0 314.7 428\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"28\" height=\"28\"><path d=\"M206 108.7h108.7L206 0z\" fill=\"#188038\"\/><path d=\"M206 108.7V0H24C10.7 0 0 10.7 0 24v380c0 13.3 10.7 24 24 24h266.7c13.3 0 24-10.7 24-24V108.7z\" fill=\"#34a853\"\/><path d=\"M60 167.9V315h194.7V167.9zM145.3 291H84v-37.6h61.3zm0-61.5H84v-37.6h61.3zm85.4 61.5h-61.3v-37.6h61.3zm0-61.5h-61.3v-37.6h61.3z\" fill=\"#fff\"\/><\/svg>';\n      const fmtMeta = [\n        { key: \"pdf\", label: \"PDF\", hint: \"Print or email\", svg: SVG_PDF },\n        {\n          key: \"word\",\n          label: \"Word (.docx)\",\n          hint: \"Edit text freely\",\n          svg: SVG_WORD,\n        },\n        {\n          key: \"excel\",\n          label: \"Excel (.xlsx)\",\n          hint: \"Auto totals\",\n          svg: SVG_EXCEL,\n        },\n        {\n          key: \"gdoc\",\n          label: \"Google Docs\",\n          hint: \"Edit online \u00b7 free\",\n          svg: SVG_GDOC,\n        },\n        {\n          key: \"sheet\",\n          label: \"Google Sheets\",\n          hint: \"Edit online \u00b7 free\",\n          svg: SVG_SHEET,\n        },\n      ];\n      fmts.innerHTML = fmtMeta\n        .filter(function (f) {\n          return t[f.key];\n        })\n        .map(function (f) {\n          return (\n            '<a href=\"' +\n            esc(t[f.key]) +\n            '\" class=\"modal-format\" target=\"_blank\" rel=\"noopener\" download>' +\n            '<div class=\"modal-format-icon\">' +\n            f.svg +\n            \"<\/div>\" +\n            '<div class=\"modal-format-text\"><div class=\"modal-format-name\">' +\n            f.label +\n            '<\/div><div class=\"modal-format-hint\">' +\n            f.hint +\n            \"<\/div><\/div>\" +\n            '<svg class=\"modal-format-arrow\" width=\"16\" height=\"16\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\"><path d=\"M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4\"\/><polyline points=\"7 10 12 15 17 10\"\/><line x1=\"12\" y1=\"15\" x2=\"12\" y2=\"3\"\/><\/svg>' +\n            \"<\/a>\"\n          );\n        })\n        .join(\"\");\n\n      m.classList.add(\"open\");\n      m.setAttribute(\"aria-hidden\", \"false\");\n      document.body.style.overflow = \"hidden\";\n    }\n\n    function closeModal() {\n      const m = $(\"#iftpl-modal\");\n      if (!m) return;\n      m.classList.remove(\"open\");\n      m.setAttribute(\"aria-hidden\", \"true\");\n      document.body.style.overflow = \"\";\n    }\n\n    function setupModal() {\n      const m = $(\"#iftpl-modal\");\n      if (!m || m.dataset.iftplWired === \"1\") return;\n      m.dataset.iftplWired = \"1\";\n      const cb = $(\"#iftpl-modal-close\");\n      if (cb) cb.addEventListener(\"click\", closeModal);\n      m.addEventListener(\"click\", function (e) {\n        if (e.target === m) closeModal();\n      });\n    }\n\n    function setupFAQ() {\n      $$(\".faq-q\").forEach(function (q) {\n        if (q.dataset.iftplWired === \"1\") return;\n        q.dataset.iftplWired = \"1\";\n        q.addEventListener(\"click\", function () {\n          q.parentElement.classList.toggle(\"open\");\n        });\n      });\n    }\n\n    \/\/ ============================================\n    \/\/ STICKY BAR + HEADER AUTO-HIDE\n    \/\/ ============================================\n    function setupStickyBar() {\n      const stickyBar = $(\"#iftpl-sticky-bar\");\n      if (!stickyBar || stickyBar.dataset.iftplWired === \"1\") return;\n      stickyBar.dataset.iftplWired = \"1\";\n\n      \/\/ Position-based detection: when the bar IS stuck, getBoundingClientRect().top\n      \/\/ equals the CSS `top` value (i.e. stickyOffset). When it's in normal document\n      \/\/ flow, rect.top is greater than stickyOffset. This approach is immune to\n      \/\/ race conditions and works correctly even when --iftpl-sticky-offset changes\n      \/\/ dynamically (e.g. the global header auto-hiding mid-scroll).\n      let ticking = false;\n      let cooldown = false; \/\/ blocks re-toggle during CSS transition to prevent oscillation\n      function checkSticky() {\n        if (ticking) return;\n        ticking = true;\n        requestAnimationFrame(function () {\n          \/\/ On mobile the bar is position:relative \u2014 remove is-stuck if present and bail out.\n          if (window.innerWidth <= 768) {\n            stickyBar.classList.remove(\"is-stuck\");\n            ticking = false;\n            return;\n          }\n          const rect = stickyBar.getBoundingClientRect();\n          \/\/ Read the bar's own computed `top` value (resolves the CSS var and\n          \/\/ reflects any ongoing transition). When the bar IS stuck, rect.top \u2248 cssTop.\n          \/\/ When it's in normal document flow, rect.top is significantly larger than cssTop.\n          const cssTop = parseFloat(getComputedStyle(stickyBar).top) || 0;\n          const wasStuck = stickyBar.classList.contains(\"is-stuck\");\n          \/\/ Asymmetric hysteresis: snap on quickly (\u22642 px) but release slowly (>20 px).\n          \/\/ This prevents tiny scrolls near the threshold from toggling the class,\n          \/\/ e.g. after a smooth-scroll click that lands right at the sticky boundary.\n          const tolerance = wasStuck ? 20 : 2;\n          const stuck = rect.top <= cssTop + tolerance;\n          if (!cooldown && stuck !== wasStuck) {\n            stickyBar.classList.toggle(\"is-stuck\", stuck);\n            \/\/ Lock out further toggles for 300ms (matches padding transition duration)\n            \/\/ so the height-change from compact styles can't create a feedback loop.\n            cooldown = true;\n            setTimeout(function () {\n              cooldown = false;\n            }, 300);\n          }\n          ticking = false;\n        });\n      }\n\n      window.addEventListener(\"scroll\", checkSticky, { passive: true });\n      window.addEventListener(\"resize\", checkSticky, { passive: true });\n\n      \/\/ Initial check (slight delay so layout is settled)\n      setTimeout(checkSticky, 50);\n\n      \/\/ \u2500\u2500 Anchor-click interception \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \/\/ id=\"templates\" lives INSIDE the sticky bar (.tab-pills-wrap).\n      \/\/ Native browser scroll-to-anchor positions that element's natural\n      \/\/ document-flow top exactly at the sticky threshold \u2192 rect.top \u2248 cssTop\n      \/\/ on every scroll event \u2192 is-stuck flickers add\/remove\/add.\n      \/\/\n      \/\/ Fix: intercept any a[href=\"#templates\"] click, prevent the browser's\n      \/\/ default scroll, and instead scroll to the .gallery element (which is\n      \/\/ below the sticky bar), offset so the bar is already firmly stuck when\n      \/\/ the scroll settles.  This guarantees rect.top < cssTop by > 20 px and\n      \/\/ the hysteresis logic never releases is-stuck.\n      document\n        .querySelectorAll('a[href=\"#templates\"]')\n        .forEach(function (link) {\n          link.addEventListener(\"click\", function (e) {\n            e.preventDefault();\n            var gallery = document.querySelector(\".gallery\");\n            if (!gallery) return;\n            var barH = stickyBar.offsetHeight;\n            var cssT = parseFloat(getComputedStyle(stickyBar).top) || 0;\n            \/\/ Target: gallery's document-flow top, minus sticky bar height & offset,\n            \/\/ minus a small extra gap (16 px) so the bar is firmly past threshold.\n            var targetY =\n              gallery.getBoundingClientRect().top +\n              window.scrollY -\n              cssT -\n              barH -\n              16;\n            window.scrollTo({ top: Math.max(0, targetY), behavior: \"smooth\" });\n          });\n        });\n    }\n\n    function setupHeaderAutoHide() {\n      \/\/ \u2500\u2500 WordPress admin bar \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\n      \/\/ When a WP user is logged in, #wpadminbar is 32 px tall (46 px on\n      \/\/ mobile). We must include it in the sticky offset so the bar doesn't\n      \/\/ hide behind it. We observe resize because WP collapses the admin bar\n      \/\/ from 32\u219246 px at the 600 px breakpoint.\n      function getAdminBarHeight() {\n        var ab = document.getElementById(\"wpadminbar\");\n        return ab ? ab.getBoundingClientRect().height : 0;\n      }\n\n      \/\/ Detect the page's fixed\/sticky header using multiple common selectors.\n      \/\/ Falls back gracefully if none is found.\n      function findPageHeader() {\n        var candidates = [\n          \".if-header\",\n          \"#site-header\",\n          \".site-header\",\n          \"#masthead\",\n          \".elementor-location-header\",\n          '.elementor-section[data-element_type=\"section\"].elementor-sticky',\n          \"header\",\n        ];\n        for (var i = 0; i < candidates.length; i++) {\n          var el = document.querySelector(candidates[i]);\n          if (el) {\n            var pos = getComputedStyle(el).position;\n            if (pos === \"fixed\" || pos === \"sticky\") return el;\n          }\n        }\n        return null;\n      }\n      const header = findPageHeader();\n\n      \/\/ Set initial sticky offset = actual visible bottom edge of the header.\n      \/\/ We use getBoundingClientRect().bottom (NOT .height) so the value\n      \/\/ accounts for the CSS transform: translateY(-100%) used to hide\/show the\n      \/\/ header.  During the 0.3 s slide animation .bottom interpolates smoothly\n      \/\/ between 0 (fully hidden) and headerHeight (fully visible), which lets us\n      \/\/ keep the sticky bar perfectly flush with the header at every frame with\n      \/\/ no jump and no gap.\n      function updateOffset() {\n        var abH = getAdminBarHeight();\n        var hH = 0;\n        if (header) {\n          \/\/ rect.bottom reflects the transformed position, giving us the real\n          \/\/ visible bottom edge of the header in viewport coordinates.\n          var rect = header.getBoundingClientRect();\n          hH = Math.max(0, rect.bottom - abH);\n        }\n        if (root)\n          root.style.setProperty(\"--iftpl-sticky-offset\", abH + hH + \"px\");\n      }\n      updateOffset();\n      window.addEventListener(\"resize\", updateOffset, { passive: true });\n\n      if (!header || header.dataset.iftplWired === \"1\") return;\n      header.dataset.iftplWired = \"1\";\n\n      let lastY = window.scrollY;\n      let ticking = false;\n      const threshold = 80; \/\/ Don't hide until scrolled past this much\n      const delta = 6; \/\/ Minimum scroll delta to trigger\n\n      \/\/ During the header CSS transition we pump updateOffset() every rAF frame\n      \/\/ so the sticky-bar top tracks the animated header position continuously,\n      \/\/ not just on scroll events (which stop firing when the user lifts their\n      \/\/ finger but the header animation is still running).\n      let transitionRaf = null;\n      function trackHeaderTransition() {\n        cancelAnimationFrame(transitionRaf);\n        var deadline = performance.now() + 360; \/\/ slightly longer than the 0.3 s CSS transition\n        function frame() {\n          updateOffset();\n          if (performance.now() < deadline) {\n            transitionRaf = requestAnimationFrame(frame);\n          } else {\n            updateOffset(); \/\/ one final update once the transition has settled\n          }\n        }\n        transitionRaf = requestAnimationFrame(frame);\n      }\n\n      function onScroll() {\n        if (ticking) return;\n        ticking = true;\n        requestAnimationFrame(function () {\n          const y = window.scrollY;\n          const diff = y - lastY;\n\n          \/\/ Ignore tiny movements\n          if (Math.abs(diff) < delta) {\n            ticking = false;\n            return;\n          }\n          \/\/ Always show when near the top\n          if (y < threshold) {\n            header.classList.remove(\"iftpl-hidden\");\n            document.body.classList.remove(\"iftpl-header-hidden\");\n            trackHeaderTransition();\n          } else if (diff > 0) {\n            \/\/ Scrolling down \u2192 hide\n            header.classList.add(\"iftpl-hidden\");\n            document.body.classList.add(\"iftpl-header-hidden\");\n            trackHeaderTransition();\n            \/\/ Only close dropdowns if user is actively scrolling far (not on render)\n            if (Math.abs(diff) > 40) closeAllDropdowns();\n          } else if (diff < 0) {\n            \/\/ Scrolling up \u2192 show\n            header.classList.remove(\"iftpl-hidden\");\n            document.body.classList.remove(\"iftpl-header-hidden\");\n            trackHeaderTransition();\n          }\n          updateOffset();\n          lastY = y;\n          ticking = false;\n        });\n      }\n\n      window.addEventListener(\"scroll\", onScroll, { passive: true });\n    }\n\n    \/\/ ============================================\n    \/\/ INIT\n    \/\/ ============================================\n    function init() {\n      root = document.getElementById(\"iftpl-root\");\n      if (!root) return false;\n      if (initialized && root.dataset.iftplInit === \"1\") return true;\n\n      initialized = true;\n      root.dataset.iftplInit = \"1\";\n\n      buildTrades();\n      buildFilterOptions();\n      setupFilterDropdowns();\n      setupSearch();\n      setupModal();\n      setupFAQ();\n      setupStickyBar();\n      setupHeaderAutoHide();\n      \/\/ The 71-card gallery is below the fold \u2014 build it after first paint so it\n      \/\/ doesn't block the critical render (helps LCP\/TBT). Filters call\n      \/\/ renderGrid() directly on interaction, so this only defers the first paint.\n      if (\"requestIdleCallback\" in window) {\n        requestIdleCallback(renderGrid, { timeout: 1800 });\n      } else {\n        setTimeout(renderGrid, 1);\n      }\n      renderActiveFilters();\n      updateFilterButtons();\n      return true;\n    }\n\n    function tryInit(retries) {\n      if (init()) return;\n      if (retries > 0)\n        setTimeout(function () {\n          tryInit(retries - 1);\n        }, 200);\n    }\n\n    if (document.readyState === \"loading\") {\n      document.addEventListener(\"DOMContentLoaded\", function () {\n        tryInit(10);\n      });\n    } else {\n      tryInit(10);\n    }\n    window.addEventListener(\"load\", function () {\n      tryInit(3);\n    });\n\n    if (typeof MutationObserver !== \"undefined\") {\n      let mo;\n      const start = function () {\n        if (mo || initialized) return;\n        mo = new MutationObserver(function () {\n          if (!initialized && document.getElementById(\"iftpl-root\")) {\n            init();\n            if (initialized) {\n              mo.disconnect();\n              mo = null;\n            }\n          }\n        });\n        mo.observe(document.body, { childList: true, subtree: true });\n        setTimeout(function () {\n          if (mo) {\n            mo.disconnect();\n            mo = null;\n          }\n        }, 10000);\n      };\n      if (document.body) start();\n      else document.addEventListener(\"DOMContentLoaded\", start);\n    }\n  })();\n<\/script>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Home \/ Free Resources \/ Templates \/ Estimate Templates Built for contractors \u00b7 Free \u00b7 No sign-up Professional Estimate Templates for Every Trade Download free estimate templates in PDF, Word, Excel, Google Docs, and Google Sheets, or create and send estimates online with Invoice Fly. Designed for contractors, electricians, plumbers, roofers, landscapers, and small businesses. [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":39444,"parent":28245,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"_yoast_wpseo_focuskw":"Estimate Templates","_yoast_wpseo_title":"Free Estimate Templates | Docs, Sheets, Excel, PDF","_yoast_wpseo_metadesc":"Use this free estimate template to automatically create & download a custom estimate in Docs, Sheets, or PDF. Send unlimited estimates.","footnotes":""},"class_list":["post-28677","page","type-page","status-publish","has-post-thumbnail","hentry"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v25.8 (Yoast SEO v25.8) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Free Estimate Templates | Docs, Sheets, Excel, PDF<\/title>\n<meta name=\"description\" content=\"Use this free estimate template to automatically create &amp; download a custom estimate in Docs, Sheets, or PDF. Send unlimited estimates.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/invoicefly.com\/es\/recursos-gratuitos\/plantillas-gratuitas\/plantilla-presupuesto\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Free Estimate Templates\" \/>\n<meta property=\"og:description\" content=\"Use this free estimate template to automatically create &amp; download a custom estimate in Docs, Sheets, or PDF. Send unlimited estimates.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/invoicefly.com\/es\/recursos-gratuitos\/plantillas-gratuitas\/plantilla-presupuesto\/\" \/>\n<meta property=\"og:site_name\" content=\"Invoice Fly\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/invoiceflyapp\/\" \/>\n<meta property=\"article:modified_time\" content=\"2026-06-08T20:35:14+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/invoicefly.com\/wp-content\/uploads\/2024\/10\/estimate-templates-1200x675-1.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"675\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data1\" content=\"79 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/invoicefly.com\/free-resources\/free-templates\/estimate-templates\/\",\"url\":\"https:\/\/invoicefly.com\/free-resources\/free-templates\/estimate-templates\/\",\"name\":\"Free Estimate Templates | Docs, Sheets, Excel, PDF\",\"isPartOf\":{\"@id\":\"https:\/\/invoicefly.com\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/invoicefly.com\/free-resources\/free-templates\/estimate-templates\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/invoicefly.com\/free-resources\/free-templates\/estimate-templates\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/invoicefly.com\/wp-content\/uploads\/2024\/10\/estimate-templates-1200x675-1.jpg\",\"datePublished\":\"2026-04-24T09:43:55+00:00\",\"dateModified\":\"2026-06-08T20:35:14+00:00\",\"description\":\"Use this free estimate template to automatically create & download a custom estimate in Docs, Sheets, or PDF. Send unlimited estimates.\",\"breadcrumb\":{\"@id\":\"https:\/\/invoicefly.com\/free-resources\/free-templates\/estimate-templates\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/invoicefly.com\/free-resources\/free-templates\/estimate-templates\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/invoicefly.com\/free-resources\/free-templates\/estimate-templates\/#primaryimage\",\"url\":\"https:\/\/invoicefly.com\/wp-content\/uploads\/2024\/10\/estimate-templates-1200x675-1.jpg\",\"contentUrl\":\"https:\/\/invoicefly.com\/wp-content\/uploads\/2024\/10\/estimate-templates-1200x675-1.jpg\",\"width\":1200,\"height\":675,\"caption\":\"Estimate Template | Invoice Fly\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/invoicefly.com\/free-resources\/free-templates\/estimate-templates\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Invoice Fly\",\"item\":\"https:\/\/invoicefly.com\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Free Resources for Small Businesses\",\"item\":\"https:\/\/invoicefly.com\/free-resources\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Free Templates\",\"item\":\"https:\/\/invoicefly.com\/free-resources\/free-templates\/\"},{\"@type\":\"ListItem\",\"position\":4,\"name\":\"Free Estimate Templates\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/invoicefly.com\/#website\",\"url\":\"https:\/\/invoicefly.com\/\",\"name\":\"Invoice Fly\",\"description\":\"The Best Invoice App\",\"publisher\":{\"@id\":\"https:\/\/invoicefly.com\/#organization\"},\"alternateName\":\"Invoice Fly\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/invoicefly.com\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/invoicefly.com\/#organization\",\"name\":\"Invoice Fly\",\"alternateName\":\"Invoice Fly\",\"url\":\"https:\/\/invoicefly.com\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/invoicefly.com\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/invoicefly.com\/wp-content\/uploads\/2023\/09\/invoice-fly-logo.png\",\"contentUrl\":\"https:\/\/invoicefly.com\/wp-content\/uploads\/2023\/09\/invoice-fly-logo.png\",\"width\":524,\"height\":113,\"caption\":\"Invoice Fly\"},\"image\":{\"@id\":\"https:\/\/invoicefly.com\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/invoiceflyapp\/\",\"https:\/\/www.instagram.com\/invoiceflyapp\/\",\"https:\/\/www.tiktok.com\/@invoicefly\",\"https:\/\/www.youtube.com\/channel\/UCS20FuF4lzTotiD3cOHKYTg\"],\"description\":\"Invoice Fly helps you send estimates & invoices, collect credit card and online payments fast, build reports, track expenses, organize your clients and items and run your home service business with ease.\\u2028\",\"legalName\":\"Invoice Fly\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Plantillas gratuitas de presupuestos | Docs, Sheets, Excel, PDF","description":"Utilice esta plantilla de presupuesto gratuita para crear y descargar autom\u00e1ticamente un presupuesto personalizado en Docs, Sheets o PDF. Env\u00ede un n\u00famero ilimitado de presupuestos.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/invoicefly.com\/es\/recursos-gratuitos\/plantillas-gratuitas\/plantilla-presupuesto\/","og_locale":"es_ES","og_type":"article","og_title":"Free Estimate Templates","og_description":"Use this free estimate template to automatically create & download a custom estimate in Docs, Sheets, or PDF. Send unlimited estimates.","og_url":"https:\/\/invoicefly.com\/es\/recursos-gratuitos\/plantillas-gratuitas\/plantilla-presupuesto\/","og_site_name":"Invoice Fly","article_publisher":"https:\/\/www.facebook.com\/invoiceflyapp\/","article_modified_time":"2026-06-08T20:35:14+00:00","og_image":[{"width":1200,"height":675,"url":"https:\/\/invoicefly.com\/wp-content\/uploads\/2024\/10\/estimate-templates-1200x675-1.jpg","type":"image\/jpeg"}],"twitter_card":"summary_large_image","twitter_misc":{"Tiempo de lectura":"79 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/invoicefly.com\/free-resources\/free-templates\/estimate-templates\/","url":"https:\/\/invoicefly.com\/free-resources\/free-templates\/estimate-templates\/","name":"Plantillas gratuitas de presupuestos | Docs, Sheets, Excel, PDF","isPartOf":{"@id":"https:\/\/invoicefly.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/invoicefly.com\/free-resources\/free-templates\/estimate-templates\/#primaryimage"},"image":{"@id":"https:\/\/invoicefly.com\/free-resources\/free-templates\/estimate-templates\/#primaryimage"},"thumbnailUrl":"https:\/\/invoicefly.com\/wp-content\/uploads\/2024\/10\/estimate-templates-1200x675-1.jpg","datePublished":"2026-04-24T09:43:55+00:00","dateModified":"2026-06-08T20:35:14+00:00","description":"Utilice esta plantilla de presupuesto gratuita para crear y descargar autom\u00e1ticamente un presupuesto personalizado en Docs, Sheets o PDF. Env\u00ede un n\u00famero ilimitado de presupuestos.","breadcrumb":{"@id":"https:\/\/invoicefly.com\/free-resources\/free-templates\/estimate-templates\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/invoicefly.com\/free-resources\/free-templates\/estimate-templates\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/invoicefly.com\/free-resources\/free-templates\/estimate-templates\/#primaryimage","url":"https:\/\/invoicefly.com\/wp-content\/uploads\/2024\/10\/estimate-templates-1200x675-1.jpg","contentUrl":"https:\/\/invoicefly.com\/wp-content\/uploads\/2024\/10\/estimate-templates-1200x675-1.jpg","width":1200,"height":675,"caption":"Estimate Template | Invoice Fly"},{"@type":"BreadcrumbList","@id":"https:\/\/invoicefly.com\/free-resources\/free-templates\/estimate-templates\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Invoice Fly","item":"https:\/\/invoicefly.com\/"},{"@type":"ListItem","position":2,"name":"Free Resources for Small Businesses","item":"https:\/\/invoicefly.com\/free-resources\/"},{"@type":"ListItem","position":3,"name":"Free Templates","item":"https:\/\/invoicefly.com\/free-resources\/free-templates\/"},{"@type":"ListItem","position":4,"name":"Free Estimate Templates"}]},{"@type":"WebSite","@id":"https:\/\/invoicefly.com\/#website","url":"https:\/\/invoicefly.com\/","name":"Invoice Fly","description":"La Mejor App de Facturaci\u00f3n","publisher":{"@id":"https:\/\/invoicefly.com\/#organization"},"alternateName":"Invoice Fly","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/invoicefly.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Organization","@id":"https:\/\/invoicefly.com\/#organization","name":"Invoice Fly","alternateName":"Invoice Fly","url":"https:\/\/invoicefly.com\/","logo":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/invoicefly.com\/#\/schema\/logo\/image\/","url":"https:\/\/invoicefly.com\/wp-content\/uploads\/2023\/09\/invoice-fly-logo.png","contentUrl":"https:\/\/invoicefly.com\/wp-content\/uploads\/2023\/09\/invoice-fly-logo.png","width":524,"height":113,"caption":"Invoice Fly"},"image":{"@id":"https:\/\/invoicefly.com\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/invoiceflyapp\/","https:\/\/www.instagram.com\/invoiceflyapp\/","https:\/\/www.tiktok.com\/@invoicefly","https:\/\/www.youtube.com\/channel\/UCS20FuF4lzTotiD3cOHKYTg"],"description":"Invoice Fly te ayuda a enviar presupuestos y facturas, cobrar tarjetas de cr\u00e9dito y pagos en l\u00ednea r\u00e1pidamente, generar informes, rastrear gastos, organizar tus clientes y art\u00edculos y administrar tu negocio de servicios del hogar con facilidad.","legalName":"Invoice Fly"}]}},"hero_title":"","hero_text":"","how_to_title":null,"how_to_content_1":null,"how_to_content_2":null,"how_to_content_3":null,"how_to_content_4":null,"key_section_title":null,"bill_confidently_title":null,"icon_title_1":null,"icon_text_1":null,"icon_title_2":null,"icon_text_2":null,"icon_title_3":null,"icon_text_3":null,"icon_title_4":null,"icon_text_4":null,"icon_title_5":null,"icon_text_5":null,"icon_title_6":null,"icon_text_6":null,"icon_title_7":null,"icon_text_7":null,"faq_header":null,"faq_text":null,"faq_title_1":null,"faq_content_1":"","faq_title_2":null,"faq_content_2":"","faq_title_3":null,"faq_content_3":"","faq_title_4":null,"faq_content_4":"","faq_title_5":null,"faq_content_5":"","faq_title_6":null,"faq_content_6":null,"faq_title_7":null,"faq_content_7":null,"faq_title_8":null,"faq_content_8":null,"faq_title_9":null,"faq_content_9":null,"faq_title_10":null,"faq_content_10":null,"get_paid_title":null,"get_paid_text":null,"stay_on_top_title":null,"stay_on_top_text":null,"icon_2_title_1":null,"icon_2_text_1":null,"icon_2_title_2":null,"icon_2_text_2":null,"icon_2_title_3":null,"icon_2_text_3":null,"icon_2_title_4":null,"icon_2_text_4":null,"invoicing_that_title":null,"invoicing_that_text":null,"icon_3_title_1":null,"icon_3_text_1":null,"icon_3_title_2":null,"icon_3_text_2":null,"icon_3_title_3":null,"icon_3_text_3":null,"icon_3_title_4":null,"icon_3_text_4":null,"faq_title_header":null,"faq_text_header":null,"hero_image":null,"invoice_template_title_seo":"Professional Invoice Templates by Invoice Fly","descripcion_invoice_template_seo":"<p>A great invoice doesn\u2019t just list numbers,  it reflects your brand and makes it easy for clients to pay.<\/p>\n<p>With Invoice Fly\u2019s free invoice templates, you can customize and download professional invoices in Word, Excel, PDF, Google Docs, or Google Sheets in minutes. Add your logo, edit your details, and create a polished invoice template ready to send to your clients. <\/p>\n<p>Whether you\u2019re a contractor, freelancer, consultant, agency, or growing business, Invoice Fly helps you invoice confidently across industries. \u2028\u2028And when you need more flexibility, the  Invoice Fly app lets you generate invoices on the go, track payments, save client details, and manage your invoicing workflow in one place &#8211; wherever your work takes you.<\/p>\n<p>From editable invoice templates to a full invoice generator, everything is designed to help you bill professionally and get paid faster.\u2028\u2028<\/p>\n<p>Get the Invoice Fly app for free and manage your invoicing from anywhere. \u2028\u2028<\/p>\n","whats_included_title":"","whats_included_text":"","whats_included_image":false,"faqs_title":"","faq_1":"","faq_2":"","faq_3":"","faq_4":"","faq_5":"","_links":{"self":[{"href":"https:\/\/invoicefly.com\/es\/wp-json\/wp\/v2\/pages\/28677","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/invoicefly.com\/es\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/invoicefly.com\/es\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/invoicefly.com\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/invoicefly.com\/es\/wp-json\/wp\/v2\/comments?post=28677"}],"version-history":[{"count":19,"href":"https:\/\/invoicefly.com\/es\/wp-json\/wp\/v2\/pages\/28677\/revisions"}],"predecessor-version":[{"id":97405,"href":"https:\/\/invoicefly.com\/es\/wp-json\/wp\/v2\/pages\/28677\/revisions\/97405"}],"up":[{"embeddable":true,"href":"https:\/\/invoicefly.com\/es\/wp-json\/wp\/v2\/pages\/28245"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/invoicefly.com\/es\/wp-json\/wp\/v2\/media\/39444"}],"wp:attachment":[{"href":"https:\/\/invoicefly.com\/es\/wp-json\/wp\/v2\/media?parent=28677"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}