/*
Theme Name: Linqz Tools
Theme URI: https://linqz.me
Author: Linqz
Author URI: https://linqz.me
Description: A tools-first finance theme: a searchable, filterable directory of calculators with calculator reviews and money-truth articles. Light + dark, SEO- and AdSense-ready.
Version: 1.10.3
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: linqz-tools
Tags: blog, news, two-columns, right-sidebar, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready, full-width-template, block-styles, wide-blocks
*/
:root{--ink:#0f172a;--muted:#5a6b85;--bg:#f6f8fb;--surface:#ffffff;--surface-2:#eef3f9;--primary:#2563eb;--primary-d:#1d4ed8;--primary-ink:#ffffff;--accent:#0ea5e9;--line:#e3e9f1;--ring:rgba(37,99,235,.32);--display:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--body:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;--mono:ui-monospace,SFMono-Regular,Menlo,monospace;--radius:16px;--radius-sm:11px;--maxw:1400px;--shadow:0 1px 2px rgba(15,23,42,.04),0 16px 38px -14px rgba(15,23,42,.16);}
:root[data-theme="dark"]{--ink:#e8edf6;--muted:#93a1ba;--bg:#0b1220;--surface:#111a2e;--surface-2:#16223a;--primary:#3b82f6;--primary-d:#60a5fa;--primary-ink:#0b1220;--accent:#38bdf8;--line:#1e2b45;--ring:rgba(59,130,246,.4);--shadow:0 1px 2px rgba(0,0,0,.4),0 20px 44px -14px rgba(0,0,0,.6);}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;transition:background .2s,color .2s;}
img{max-width:100%;height:auto;display:block;}
a{color:var(--primary-d);text-decoration:none;}
a:hover{text-decoration:underline;}
h1,h2,h3,h4,h5{font-family:var(--display);color:var(--ink);line-height:1.18;margin:0 0 .5em;font-weight:700;letter-spacing:-.015em;}
p{margin:0 0 1em;}
:focus-visible{outline:none;box-shadow:0 0 0 3px var(--ring);border-radius:6px;}
.lz-container{max-width:var(--maxw);margin:0 auto;padding:0 22px;}
/* Section 2.66: full-bleed variant -- stacked onto .lz-container (not a
   replacement) for pages/sections whose main content is a card/tile grid
   with no long-form prose to protect (category archives, homepage tool
   grids, calculator pages -- the calculator widget itself already self-caps
   its own width via inline CSS, so letting its wrapper go edge-to-edge is
   safe). Deliberately NOT applied to single.php/page.php's .lz-layout,
   since those hold .lz-article prose where an unbounded width would make
   line length unreadable on wide monitors -- those keep the standard
   --maxw cap above. */
.lz-container-fluid{max-width:none;padding:0 clamp(22px,3vw,56px);}
.lz-skip-link{position:absolute;left:-9999px;}
.lz-skip-link:focus{left:12px;top:12px;background:var(--surface);padding:10px 14px;border-radius:8px;z-index:999;box-shadow:var(--shadow);}
.lz-muted{color:var(--muted);}

.lz-btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--display);font-weight:600;font-size:14.5px;padding:11px 18px;
  border-radius:var(--radius-sm);border:1px solid transparent;cursor:pointer;transition:.18s;line-height:1;text-decoration:none;}
.lz-btn:hover{text-decoration:none;transform:translateY(-1px);}
.lz-btn-primary{background:var(--primary);color:var(--primary-ink);}
.lz-btn-primary:hover{background:var(--primary-d);color:var(--primary-ink);}
.lz-btn-ghost{background:var(--surface);color:var(--ink);border-color:var(--line);}
.lz-btn-ghost:hover{border-color:var(--primary);color:var(--primary-d);}

.lz-site-header{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--surface) 90%,transparent);
  backdrop-filter:saturate(1.3) blur(10px);border-bottom:1px solid var(--line);}
.lz-header-inner{display:flex;align-items:center;gap:16px;min-height:64px;}
.lz-brand{display:flex;align-items:center;gap:10px;margin-right:auto;}
.lz-brand img{max-height:38px;width:auto;}
.lz-site-title{font-family:var(--display);font-weight:800;font-size:20px;color:var(--ink);letter-spacing:-.02em;}
.lz-site-title a{color:inherit;} .lz-site-title a:hover{text-decoration:none;}
.lz-primary-nav ul{list-style:none;display:flex;gap:2px;margin:0;padding:0;}
.lz-primary-nav a{display:block;padding:9px 12px;border-radius:9px;color:var(--ink);font-weight:600;font-size:14.5px;font-family:var(--display);}
.lz-primary-nav a:hover{background:var(--surface-2);text-decoration:none;color:var(--primary-d);}
.lz-primary-nav .current-menu-item>a{color:var(--primary-d);}
.lz-primary-nav li{position:relative;}
.lz-primary-nav .sub-menu{display:none;position:absolute;top:100%;left:0;min-width:200px;background:var(--surface);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);padding:8px;}
.lz-primary-nav li:hover>.sub-menu{display:block;}
.lz-primary-nav .sub-menu a{padding:8px 12px;}
.lz-header-tools{display:flex;align-items:center;gap:10px;}
.lz-country select{font:600 13px/1 var(--body);color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:9px;padding:8px 9px;cursor:pointer;}
.lz-dark-toggle{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:10px;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;transition:.15s;}
.lz-dark-toggle:hover{border-color:var(--primary);color:var(--primary-d);}
.lz-i-sun{display:none;} .lz-i-moon{display:inline-block;}
[data-theme="dark"] .lz-i-sun{display:inline-block;} [data-theme="dark"] .lz-i-moon{display:none;}
.lz-menu-toggle{display:none;background:var(--surface-2);border:1px solid var(--line);border-radius:10px;width:42px;height:42px;align-items:center;justify-content:center;cursor:pointer;}
.lz-menu-toggle span,.lz-menu-toggle span::before,.lz-menu-toggle span::after{content:"";display:block;width:18px;height:2px;background:var(--ink);position:relative;transition:.2s;}
.lz-menu-toggle span::before{position:absolute;top:-6px;} .lz-menu-toggle span::after{position:absolute;top:6px;}

.lz-section{padding:46px 0;}
.lz-section-alt{background:var(--surface-2);}
.lz-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:24px;}
.lz-section-title{font-size:clamp(22px,3vw,30px);margin:0;letter-spacing:-.02em;}
.lz-section-head .lz-eyebrow{margin-bottom:6px;display:block;}
.lz-section-more{font-family:var(--display);font-weight:600;font-size:14px;color:var(--primary-d);white-space:nowrap;}
.lz-eyebrow{display:inline-block;font-family:var(--display);font-weight:700;font-size:12px;letter-spacing:.13em;text-transform:uppercase;color:var(--primary-d);margin-bottom:12px;}
.lz-kicker{font-family:var(--display);font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0 0 16px;}

/* Section 2.69: 3-way view toggle for the aggregate calculators hub --
   Featured, Split, and List (Compact view was dropped per owner request --
   it duplicated Featured at a smaller size and added little). A global
   control (see .lz-hub-toggle-btn wiring script in linqz-content.php) flips
   this attribute on <html>; each of the three view containers is hidden
   unless its own data-hubview value matches, so exactly one renders at a
   time. Defaults to featured before JS runs (the script itself randomises
   between featured/split once per browser session unless the visitor has
   explicitly picked a view). */
.lz-hub-toggle{display:inline-flex;gap:6px;flex-wrap:wrap;background:var(--surface-2);border:1px solid var(--line);border-radius:999px;padding:4px;margin:4px 0 22px;}
.lz-hub-toggle-btn{font-family:var(--display);font-weight:700;font-size:12.5px;padding:7px 16px;border-radius:999px;border:0;background:transparent;color:var(--muted);cursor:pointer;transition:.15s;}
.lz-hub-toggle-btn.is-active{background:var(--surface);color:var(--primary-d);box-shadow:0 1px 2px rgba(15,23,42,.08);}
.lz-hub-toggle-btn:hover{color:var(--primary-d);}
/* Section 2.63 fix: the hide rule below MUST beat the unconditional
   display:grid/flex declared on each view's own container class (e.g.
   .lz-hub-feat-grid{display:grid} printed inline by the shortcode, and
   .lz-hub-list{display:flex} further down this file) -- both of those have
   the exact same specificity (0,1,0) as a bare ".lz-hub-view-x{display:none}"
   rule, so ties were being decided by source order and, for at least the
   List view (and the inline-printed grid containers, which render later in
   the DOM than this stylesheet), the unconditional rule was winning --
   showing every view stacked at once instead of exactly one. Qualifying the
   hide rule with the `html` element raises its specificity just enough to
   always win against the unconditional container rules, while the `[data-
   hubview="x"]` show rules below (which add an attribute selector on top)
   remain more specific still and correctly override the hide rule when active. */
html .lz-hub-view-featured,html .lz-hub-view-split,html .lz-hub-view-list{display:none;}
html:not([data-hubview]) .lz-hub-view-featured,html[data-hubview="featured"] .lz-hub-view-featured{display:grid;}
html[data-hubview="split"] .lz-hub-view-split{display:grid;}
html[data-hubview="list"] .lz-hub-view-list{display:flex;}

.lz-tools{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.lz-tool{position:relative;display:flex;flex-direction:column;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px 15px;transition:.2s;color:var(--ink);overflow:hidden;}
.lz-tool:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:color-mix(in srgb,var(--primary) 40%,var(--line));text-decoration:none;}
.lz-tool-head{display:flex;align-items:center;gap:10px;}
.lz-tool-ico{flex:none;width:32px;height:32px;border-radius:9px;background:var(--surface-2);color:var(--primary-d);display:flex;align-items:center;justify-content:center;transition:.2s;}
.lz-tool-ico svg{width:17px;height:17px;}
/* Icon background/color per calculator category, same hues as the .lz-tag-*
   pills below -- previously every icon used the same neutral surface color
   regardless of category, which is why the cards all looked identical/flat
   at a glance despite the colored category tag underneath. Also applied to
   the list-row icon (.lz-hub-row-ico) so both views share the same coloring. */
.lz-tool-ico.lz-ico-loans,.lz-hub-row-ico.lz-ico-loans,.lz-hub-feat-ico.lz-ico-loans{background:color-mix(in srgb,#f59e0b 18%,var(--surface-2));color:#f59e0b;}
.lz-tool-ico.lz-ico-investing,.lz-hub-row-ico.lz-ico-investing,.lz-hub-feat-ico.lz-ico-investing{background:color-mix(in srgb,var(--primary) 18%,var(--surface-2));color:var(--primary-d);}
.lz-tool-ico.lz-ico-tax,.lz-hub-row-ico.lz-ico-tax,.lz-hub-feat-ico.lz-ico-tax{background:color-mix(in srgb,#7c3aed 18%,var(--surface-2));color:#7c3aed;}
.lz-tool-ico.lz-ico-retirement,.lz-hub-row-ico.lz-ico-retirement,.lz-hub-feat-ico.lz-ico-retirement{background:color-mix(in srgb,#e11d48 18%,var(--surface-2));color:#e11d48;}
.lz-tool-ico.lz-ico-savings,.lz-hub-row-ico.lz-ico-savings,.lz-hub-feat-ico.lz-ico-savings{background:color-mix(in srgb,#059669 18%,var(--surface-2));color:#059669;}
.lz-tool-ico.lz-ico-budgeting,.lz-hub-row-ico.lz-ico-budgeting,.lz-hub-feat-ico.lz-ico-budgeting{background:var(--surface-2);color:var(--muted);}
.lz-tool-ico.lz-ico-credit,.lz-hub-row-ico.lz-ico-credit,.lz-hub-feat-ico.lz-ico-credit{background:color-mix(in srgb,var(--accent) 20%,var(--surface-2));color:var(--accent);}
.lz-tool:hover .lz-tool-ico{transform:scale(1.06);}
.lz-tool-title{font-family:var(--display);font-weight:700;font-size:14.5px;margin:0;letter-spacing:-.01em;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;}
.lz-tool-desc{font-size:12.5px;color:var(--muted);margin:0;line-height:1.4;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;}
.lz-tool-arrow{margin-top:auto;font-family:var(--display);font-weight:700;font-size:13px;color:var(--primary-d);}
.lz-tool-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:2px;}
.lz-tool-tag{font-family:var(--display);font-weight:700;font-size:10.5px;letter-spacing:.02em;padding:3px 9px;border-radius:999px;}
.lz-tag-loans{background:color-mix(in srgb,#f59e0b 16%,var(--surface-2));color:color-mix(in srgb,#f59e0b 70%,var(--ink));}
.lz-tag-investing{background:color-mix(in srgb,var(--primary) 16%,var(--surface-2));color:color-mix(in srgb,var(--primary) 70%,var(--ink));}
.lz-tag-tax{background:color-mix(in srgb,#7c3aed 16%,var(--surface-2));color:color-mix(in srgb,#7c3aed 70%,var(--ink));}
.lz-tag-retirement{background:color-mix(in srgb,#e11d48 16%,var(--surface-2));color:color-mix(in srgb,#e11d48 70%,var(--ink));}
.lz-tag-savings{background:color-mix(in srgb,#059669 16%,var(--surface-2));color:color-mix(in srgb,#059669 70%,var(--ink));}
.lz-tag-budgeting{background:var(--surface-2);color:var(--muted);}
.lz-tag-credit{background:color-mix(in srgb,var(--accent) 18%,var(--surface-2));color:color-mix(in srgb,var(--accent) 70%,var(--ink));}
.lz-tool-cta{display:flex;align-items:center;gap:5px;font-family:var(--display);font-weight:700;font-size:12px;color:var(--muted);transition:.2s;}
.lz-tool-cta svg{transition:.2s;}
.lz-tool:hover .lz-tool-cta{color:var(--primary-d);}
.lz-tool:hover .lz-tool-cta svg{transform:translateX(3px);}

/* Section 2.48: settings-style list view -- the space-efficient alternative
   to the card grid above, toggled via html[data-hubview] (see toggle rules
   at the top of this block). */
/* Section 2.61: list view was a single-column stack, wasting the full width of the page on desktop -- now a 2-up grid (each row is its own bordered card instead of fused table rows, so a 2-column grid doesn't leave dangling borders). */
.lz-hub-list{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:8px;}
.lz-hub-row{display:flex;align-items:center;gap:14px;padding:14px 16px;text-decoration:none;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm,10px);transition:.15s;}
.lz-hub-row:hover{background:var(--surface-2);text-decoration:none;border-color:color-mix(in srgb,var(--primary) 30%,var(--line));}
@media(max-width:720px){.lz-hub-list{grid-template-columns:1fr;}}
.lz-hub-row-ico{flex:none;width:36px;height:36px;border-radius:10px;background:var(--surface-2);color:var(--primary-d);display:flex;align-items:center;justify-content:center;}
.lz-hub-row-ico svg{width:19px;height:19px;}
.lz-hub-row-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;}
.lz-hub-row-top{display:flex;align-items:center;gap:8px;}
.lz-hub-row-dot{flex:none;width:7px;height:7px;border-radius:50%;background:var(--muted);}
.lz-hub-row-dot.lz-dot-loans{background:#f59e0b;}
.lz-hub-row-dot.lz-dot-investing{background:var(--primary);}
.lz-hub-row-dot.lz-dot-tax{background:#7c3aed;}
.lz-hub-row-dot.lz-dot-retirement{background:#e11d48;}
.lz-hub-row-dot.lz-dot-savings{background:#059669;}
.lz-hub-row-dot.lz-dot-budgeting{background:var(--muted);}
.lz-hub-row-dot.lz-dot-credit{background:var(--accent);}
.lz-hub-row-title{font-family:var(--display);font-weight:700;font-size:14.5px;letter-spacing:-.01em;}
.lz-hub-row-desc{font-size:12.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.lz-hub-row-chev{flex:none;color:var(--muted);transition:.15s;display:flex;}
.lz-hub-row-chev svg{width:16px;height:16px;}
.lz-hub-row:hover .lz-hub-row-chev{color:var(--primary-d);transform:translateX(2px);}
@media(max-width:640px){.lz-hub-row-desc{display:none;}}

.lz-posts{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.lz-posts-2{grid-template-columns:repeat(2,1fr);}
.lz-post-card{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:.2s;}
.lz-post-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);}
.lz-post-thumb{display:block;aspect-ratio:16/9;background:var(--surface-2);overflow:hidden;}
.lz-post-thumb img{width:100%;height:100%;object-fit:cover;transition:.4s;}
.lz-post-card:hover .lz-post-thumb img{transform:scale(1.04);}
.lz-post-body{padding:18px;display:flex;flex-direction:column;gap:9px;flex:1;}
.lz-cat{font-family:var(--display);font-weight:700;font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--primary-d);}
.lz-post-title{font-size:18px;line-height:1.28;margin:0;}
.lz-post-title a{color:var(--ink);} .lz-post-title a:hover{color:var(--primary-d);text-decoration:none;}
.lz-post-excerpt{font-size:14px;color:var(--muted);margin:0;}
.lz-post-meta{font-size:12.5px;color:var(--muted);display:flex;gap:10px;margin-top:auto;padding-top:4px;}

/* Unified search-result rows (search.php + lztool_search_result_row()) --
   same list handles post-type content and calculator pages without either
   looking out of place, unlike the post-only grid card above. */
.lz-results-list{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
.lz-results-list .lz-result-row{display:flex;align-items:center;gap:12px;padding:13px 16px;border-bottom:1px solid var(--line);background:transparent;border-radius:0;transition:.15s;color:var(--ink);text-decoration:none;}
.lz-results-list .lz-result-row:last-child{border-bottom:none;}
.lz-results-list .lz-result-row:hover{background:var(--surface-2);transform:none;box-shadow:none;text-decoration:none;}
.lz-result-thumb{flex:none;width:42px;height:42px;border-radius:9px;overflow:hidden;background:var(--surface-2);}
.lz-result-thumb img{width:100%;height:100%;object-fit:cover;}
.lz-result-ico{flex:none;}
.lz-result-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;}
.lz-result-top{display:flex;align-items:center;gap:8px;min-width:0;}
.lz-result-title{font-size:14.5px;font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lz-result-sub{font-size:12.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lz-badge{flex:none;font-family:var(--display);font-weight:700;font-size:10px;letter-spacing:.03em;text-transform:uppercase;padding:3px 8px;border-radius:999px;}
.lz-badge-calc{background:color-mix(in srgb,var(--primary) 16%,var(--surface-2));color:var(--primary-d);}
.lz-badge-post{background:color-mix(in srgb,var(--accent) 18%,var(--surface-2));color:var(--accent);}
.lz-result-arrow{flex:none;font-family:var(--display);font-weight:700;color:var(--muted);transition:.15s;}
.lz-results-list .lz-result-row:hover .lz-result-arrow{color:var(--primary-d);transform:translateX(2px);}
.lz-results-ad{padding:14px 16px;border-bottom:1px solid var(--line);}

.lz-row{display:flex;gap:16px;padding:16px 0;border-bottom:1px solid var(--line);}
.lz-row-thumb{flex:none;width:130px;aspect-ratio:16/10;border-radius:var(--radius-sm);overflow:hidden;background:var(--surface-2);}
.lz-row-thumb img{width:100%;height:100%;object-fit:cover;}
.lz-row-title{font-size:18px;margin:0 0 6px;line-height:1.25;}
.lz-row-title a{color:var(--ink);} .lz-row-title a:hover{color:var(--primary-d);text-decoration:none;}
.lz-row-ex{font-size:14px;color:var(--muted);margin:0 0 6px;}

/* padding-top/-bottom only (NOT the shorthand) -- .lz-layout is always
   combined on the same element as .lz-container (padding:0 22px), and a
   full `padding:` shorthand here would silently overwrite .lz-container's
   left/right value with this rule's implicit 0, zeroing out every page's
   side margins (search/archive/single/page templates). Confirmed as the
   actual root cause of "no minimum spacing left/right on articles/reviews". */
.lz-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:38px;padding-top:34px;padding-bottom:56px;align-items:start;}
.lz-main-narrow{min-width:0;}
.lz-sidebar{position:sticky;top:84px;display:flex;flex-direction:column;gap:24px;}
/* Section 2.70: the 6 auto-seeded Company/legal pages (Privacy Policy,
   About, Contact, Sitemap, Disclaimer, Terms of Service) drop the always-on
   sidebar -- see page.php's linqz_is_info_page() branch. Reclaim that width
   as one centered, comfortably-wide reading column instead of stretching
   prose edge-to-edge (which .lz-container-fluid would do, and which this
   project deliberately avoids for prose elsewhere) -- keeps a real minimum
   side margin on wide screens rather than "just filling completely". */
.lz-layout-full{grid-template-columns:1fr;}
.lz-layout-full .lz-main-wide{max-width:880px;margin:0 auto;width:100%;}
/* Subtle section dividers for these longer, multi-heading pages (Privacy
   Policy, Disclaimer, Terms all run 5-8 h2/h3 sections) -- makes use of the
   extra breathing room the freed sidebar width provides without touching
   the actual wording. */
.lz-layout-full .lz-article h2{padding-top:.6em;border-top:1px solid var(--line);}
.lz-layout-full .lz-article h2:first-child{padding-top:0;border-top:0;}

.lz-breadcrumbs{font-size:13px;color:var(--muted);padding:18px 0 0;}
.lz-breadcrumbs a{color:var(--muted);} .lz-breadcrumbs a:hover{color:var(--primary-d);}
.lz-breadcrumbs span[aria-current]{color:var(--ink);font-weight:600;}

.lz-article-head{padding:14px 0 18px;}
.lz-article-head h1{font-size:clamp(26px,4vw,40px);margin:8px 0 12px;letter-spacing:-.02em;}
/* Calculators-hub heading row: a small inline script (linqz-content.php)
   moves the shared Featured/Split/List .lz-hub-toggle into this same header,
   next to the H1, instead of it sitting stacked below the heading and search
   box -- owner request for a more standard "title left, view switcher right"
   layout. Only applied when the toggle is actually present (hub pages). */
.lz-hub-head-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px 16px;}
.lz-hub-head-row .lz-hub-toggle{margin:0;flex:none;}
@media(max-width:560px){.lz-hub-head-row{flex-direction:column;align-items:flex-start;}}
.lz-meta-row{display:flex;flex-wrap:wrap;align-items:center;gap:12px;font-size:13.5px;color:var(--muted);}
.lz-meta-row .lz-avatar{width:30px;height:30px;border-radius:50%;}
.lz-featured{border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);margin:0 0 26px;}
.lz-article{font-size:17px;line-height:1.75;}
.lz-article h2{font-size:26px;margin:1.6em 0 .5em;letter-spacing:-.02em;}
.lz-article h3{font-size:20px;margin:1.4em 0 .4em;}
.lz-article p{margin:0 0 1.1em;}
.lz-article ul,.lz-article ol{margin:0 0 1.1em;padding-left:1.3em;}
.lz-article li{margin:.35em 0;}
.lz-article a{color:var(--primary-d);text-decoration:underline;text-underline-offset:2px;}
.lz-article blockquote{margin:1.4em 0;padding:14px 20px;border-left:3px solid var(--primary);background:var(--surface-2);border-radius:0 12px 12px 0;}
.lz-article img,.lz-article figure{border-radius:var(--radius-sm);margin:1.2em 0;}
.lz-article table{width:100%;border-collapse:collapse;margin:1.2em 0;font-size:15px;}
.lz-article th,.lz-article td{border:1px solid var(--line);padding:9px 12px;text-align:left;}
.lz-article th{background:var(--surface-2);font-family:var(--display);}
.lz-article code{font-family:var(--mono);background:var(--surface-2);padding:2px 6px;border-radius:6px;font-size:.9em;}
.lz-article pre{background:var(--surface-2);padding:16px;border-radius:12px;overflow:auto;}
.lz-tags{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0;}
.lz-tags a{font-size:12.5px;font-weight:600;padding:6px 12px;border-radius:999px;background:var(--surface-2);color:var(--ink);}
.lz-tags a:hover{background:var(--primary);color:var(--primary-ink);text-decoration:none;}
.lz-author-box{display:flex;gap:16px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:20px;margin:28px 0;}
.lz-author-box img{width:56px;height:56px;border-radius:50%;}
.lz-author-box h4{margin:0 0 4px;} .lz-author-box p{margin:0;font-size:14px;color:var(--muted);}
.lz-related{margin:34px 0;} .lz-related h3{font-size:20px;margin-bottom:16px;}

.lz-widget{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:20px;}
.lz-widget .widget-title,.lz-widget h2,.lz-widget h3{font-size:15px;font-family:var(--display);font-weight:700;margin:0 0 14px;padding-bottom:10px;border-bottom:1px solid var(--line);letter-spacing:-.01em;}
.lz-widget ul{list-style:none;margin:0;padding:0;}
.lz-widget li{padding:7px 0;border-bottom:1px dashed var(--line);font-size:14.5px;}
.lz-widget li:last-child{border-bottom:0;}
.lz-widget a{color:var(--ink);} .lz-widget a:hover{color:var(--primary-d);}

.lz-ad{margin:26px auto;text-align:center;max-width:100%;overflow:hidden;}
.lz-ad-label{display:block;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:6px;}
.lz-ad-inline{margin:30px 0;}
.lz-pagination{display:flex;gap:8px;justify-content:center;margin:36px 0 8px;flex-wrap:wrap;}
.lz-pagination a,.lz-pagination span{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 12px;border-radius:10px;border:1px solid var(--line);background:var(--surface);font-weight:600;font-size:14px;color:var(--ink);}
.lz-pagination .current{background:var(--primary);color:var(--primary-ink);border-color:var(--primary);}
.lz-pagination a:hover{border-color:var(--primary);color:var(--primary-d);text-decoration:none;}

.lz-cta{background:var(--primary);color:var(--primary-ink);border-radius:calc(var(--radius) + 4px);padding:40px;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;}
.lz-cta h2{color:var(--primary-ink);margin:0 0 6px;font-size:clamp(22px,3vw,30px);}
.lz-cta p{color:color-mix(in srgb,var(--primary-ink) 86%,transparent);margin:0;}
.lz-cta .lz-btn-ghost{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.4);color:#fff;}

.lz-footer{background:var(--surface);border-top:1px solid var(--line);margin-top:40px;}
/* Same fix as .lz-layout above -- .lz-footer-cols shares its element with
   .lz-container, so this must not use the padding shorthand either. */
.lz-footer-cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:30px;padding-top:48px;padding-bottom:30px;}
.lz-footer h4{font-size:14px;font-family:var(--display);margin:0 0 14px;letter-spacing:-.01em;}
.lz-footer .lz-site-title{font-size:22px;margin-bottom:10px;}
.lz-footer p{font-size:14px;color:var(--muted);}
.lz-footer ul{list-style:none;margin:0;padding:0;} .lz-footer li{padding:5px 0;font-size:14px;}
.lz-footer a{color:var(--muted);} .lz-footer a:hover{color:var(--primary-d);}
.lz-footer-bottom{border-top:1px solid var(--line);padding:18px 0;font-size:13px;color:var(--muted);}
.lz-fb-inner{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;align-items:center;}
.lz-disclaimer{font-size:12px;color:var(--muted);max-width:620px;line-height:1.55;padding-bottom:6px;}
/* Section 2.60: richer 4-column footer (About / Popular calculators / Explore / Company) -- was often just one thin About column when no widgets were configured. */
.lz-foot-trust{font-size:12.5px;margin-top:10px;padding-top:10px;border-top:1px dashed var(--line);}
.lz-foot-links li{border-bottom:1px solid color-mix(in srgb,var(--line) 60%,transparent);}
.lz-foot-links li:last-child{border-bottom:none;}
.lz-foot-viewall a{color:var(--primary-d);font-weight:700;}
.lz-foot-links nav ul{margin:0;}
.lz-page-head{padding:30px 0 8px;} .lz-page-head h1{font-size:clamp(24px,3.4vw,34px);margin:0;}
.lz-hero-sub{font-size:16px;color:var(--muted);}
.lz-notice{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:30px;text-align:center;}
.lz-noresult{text-align:center;color:var(--muted);padding:24px;}
.lz-count{font-size:13px;color:var(--muted);font-weight:600;}

input[type=search],input[type=text],input[type=email]{font-family:var(--body);font-size:15px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink);width:100%;}
input[type=search]:focus,input[type=text]:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--ring);}
.search-form{display:flex;gap:8px;} .search-form .search-submit{flex:none;}

@media(max-width:1024px){.lz-tools{grid-template-columns:repeat(3,1fr);}}
@media(max-width:900px){
  .lz-layout{grid-template-columns:1fr;} .lz-sidebar{position:static;}
  .lz-posts{grid-template-columns:repeat(2,1fr);} .lz-footer-cols{grid-template-columns:1fr 1fr;}
}
@media(max-width:760px){
  .lz-menu-toggle{display:flex;}
  .lz-primary-nav{position:fixed;inset:64px 0 auto 0;background:var(--surface);border-bottom:1px solid var(--line);transform:translateY(-12px);opacity:0;pointer-events:none;transition:.2s;box-shadow:var(--shadow);}
  .lz-primary-nav.is-open{transform:none;opacity:1;pointer-events:auto;}
  .lz-primary-nav ul{flex-direction:column;gap:0;padding:10px;}
  .lz-primary-nav a{padding:13px;border-radius:10px;}
  .lz-primary-nav .sub-menu{position:static;display:block;box-shadow:none;border:0;padding:0 0 0 12px;}
  .lz-header-cta,.lz-country{display:none;}
  .lz-tools{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:520px){.lz-posts,.lz-posts-2{grid-template-columns:1fr;}.lz-tools{grid-template-columns:1fr 1fr;}.lz-cta{padding:28px;}.lz-footer-cols{grid-template-columns:1fr;}.lz-row-thumb{width:96px;}.lz-results-list .lz-result-row{padding:11px 12px;gap:10px;}.lz-result-thumb,.lz-result-ico{width:36px;height:36px;}.lz-badge{font-size:9px;padding:2px 6px;}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important;}.lz-post-card:hover .lz-post-thumb img{transform:none;}}

/* Tools directory */
.lz-dir-hero{padding:56px 0 30px;background:radial-gradient(900px 380px at 80% -20%,color-mix(in srgb,var(--accent) 16%,transparent),transparent 60%),var(--bg);}
.lz-dir-title{font-size:clamp(30px,5vw,48px);letter-spacing:-.025em;margin:0 0 12px;line-height:1.08;max-width:760px;}
.lz-dir-sub{font-size:clamp(16px,2vw,19px);color:var(--muted);margin:0 0 24px;max-width:560px;}
.lz-dir-search{display:flex;align-items:center;gap:10px;max-width:560px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:6px 14px;box-shadow:var(--shadow);}
.lz-dir-search svg{color:var(--muted);flex:none;}
.lz-dir-search input{border:0;background:transparent;box-shadow:none;font-size:16px;padding:12px 0;}
.lz-dir-search input:focus{box-shadow:none;}
.lz-dir-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
@media(max-width:980px){.lz-dir-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:480px){.lz-dir-grid{grid-template-columns:1fr;}}
.lz-tile{display:flex;flex-direction:column;gap:8px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:18px;transition:.18s;color:var(--ink);}
.lz-tile:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:color-mix(in srgb,var(--primary) 40%,var(--line));text-decoration:none;}
.lz-tile-ico{width:38px;height:38px;border-radius:10px;background:var(--surface-2);color:var(--primary-d);display:flex;align-items:center;justify-content:center;transition:.2s;}
.lz-tile-ico svg{width:20px;height:20px;}
/* Same per-category icon coloring as .lz-tool-ico on the Calculators page. */
.lz-tile-ico.lz-ico-loans{background:color-mix(in srgb,#f59e0b 18%,var(--surface-2));color:#f59e0b;}
.lz-tile-ico.lz-ico-investing{background:color-mix(in srgb,var(--primary) 18%,var(--surface-2));color:var(--primary-d);}
.lz-tile-ico.lz-ico-tax{background:color-mix(in srgb,#7c3aed 18%,var(--surface-2));color:#7c3aed;}
.lz-tile-ico.lz-ico-retirement{background:color-mix(in srgb,#e11d48 18%,var(--surface-2));color:#e11d48;}
.lz-tile-ico.lz-ico-savings{background:color-mix(in srgb,#059669 18%,var(--surface-2));color:#059669;}
.lz-tile-ico.lz-ico-budgeting{background:var(--surface-2);color:var(--muted);}
.lz-tile-ico.lz-ico-credit{background:color-mix(in srgb,var(--accent) 20%,var(--surface-2));color:var(--accent);}
.lz-tile:hover .lz-tile-ico{transform:scale(1.06);}
.lz-tile-name{font-family:var(--display);font-weight:700;font-size:15.5px;letter-spacing:-.01em;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
/* Clamped to a fixed 2-line box regardless of actual sentence length -- before
   this, a one-line tagline and a two-line tagline left the "e.g." stat pill
   starting at two different heights from card to card, so the row of tiles
   looked jagged/misaligned as soon as descriptions varied in length (which
   they always do). Pinning the stat pill to the bottom of the card via
   margin-top:auto (below) is what actually keeps it level across a row --
   the clamp here just keeps the space it displaces from getting too extreme. */
.lz-tile-ex{font-size:13px;color:var(--muted);line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.lz-tile-stat{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:12px;color:var(--ink);line-height:1.4;background:var(--surface-2);border-radius:8px;padding:7px 10px;margin-top:auto;}
.lz-tile-stat-eg{color:var(--muted);font-weight:500;}
.lz-tile-stat-val{font-weight:600;white-space:nowrap;}
.lz-tile.is-hidden{display:none;}
.lz-country-hidden{display:none !important;}
.lz-primary-nav li:has(> a.lz-country-hidden){display:none;}
.lz-tools-viewall{text-align:center;margin-top:26px;}

/* Homepage tile caps: web keeps all 8 (2 complete rows of 4); tablet hides tiles 7-8 per country; mobile hides 5-8 (see front-page.php). */
@media(max-width:980px){.lz-tile-t{display:none;}}
@media(max-width:480px){.lz-tile-m{display:none;}}

/* Homepage tile: icon (left) and category tag (right) share one row (see front-page.php). */
.lz-tile-row{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;}
.lz-tile-tag.lz-tool-tag{align-self:center;}

/* Rotating hero visual (plugin linqz_hero_visual): layer behind the hero content. */
.lz-dir-hero{position:relative;overflow:hidden;}
.lz-dir-hero>.lz-container{position:relative;z-index:2;}

/* ===== Section 2.58: split hero (V4) — search panel + trending, all from theme tokens ===== */
.lz-hero-split{display:grid;grid-template-columns:1.12fr 1fr;gap:44px;align-items:center;}
.lz-dir-hero .lz-hero-viz{opacity:.6;}
.lz-hero-chips{display:flex;gap:9px;flex-wrap:wrap;}
.lz-hero-chips a{font:600 12.5px var(--body);color:var(--primary-d);background:color-mix(in srgb,var(--primary) 10%,transparent);border-radius:99px;padding:7px 14px;text-decoration:none;transition:.15s;}
.lz-hero-chips a:hover{background:color-mix(in srgb,var(--primary) 18%,transparent);text-decoration:none;}
.lz-searchpanel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px;position:relative;z-index:3;}
.lz-searchpanel h3{font-size:15px;margin:0 0 12px;display:flex;align-items:center;gap:8px;}
.lz-searchpanel-ic{color:var(--primary);}
.lz-spot{position:relative;}
.lz-spot input[type=search]{width:100%;height:50px;border-radius:var(--radius-sm);border:1.5px solid var(--line);background:var(--surface);padding:0 42px 0 44px;font-size:15px;outline:none;color:var(--ink);transition:.2s;font-family:var(--body);}
.lz-spot input[type=search]:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--ring);}
.lz-spot-ic{position:absolute;left:15px;top:15px;width:19px;height:19px;color:var(--muted);pointer-events:none;}
.lz-spot-kbd{position:absolute;right:12px;top:12px;font:600 10.5px var(--body);color:var(--muted);border:1px solid var(--line);border-radius:7px;padding:4px 7px;background:var(--surface-2);}
.lz-spot-drop{position:absolute;top:58px;left:0;right:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);box-shadow:var(--shadow);overflow:hidden;z-index:60;display:none;}
.lz-spot-sec{font:700 10.5px var(--body);letter-spacing:.09em;text-transform:uppercase;color:var(--muted);padding:11px 16px 3px;}
.lz-spot-item{display:flex;gap:11px;align-items:center;padding:9px 16px;cursor:pointer;color:var(--ink);text-decoration:none;}
.lz-spot-item:hover{background:var(--surface-2);text-decoration:none;}
.lz-spot-item .lz-spot-dot{width:8px;height:8px;border-radius:99px;background:var(--accent);flex:none;}
.lz-spot-item b{font-size:14px;}
.lz-spot-item b em{font-style:normal;background:color-mix(in srgb,var(--primary) 22%,transparent);border-radius:4px;padding:0 1px;}
.lz-spot-item .lz-spot-d{font-size:11.5px;color:var(--muted);}
.lz-spot-rel{display:flex;gap:8px;padding:11px 14px;border-top:1px dashed var(--line);flex-wrap:wrap;}
.lz-spot-rel a{font:600 12px var(--body);color:var(--primary-d);background:var(--surface-2);border-radius:99px;padding:6px 12px;text-decoration:none;}
.lz-trend{margin-top:13px;}
.lz-trend-tt{font:700 10.5px var(--body);letter-spacing:.09em;text-transform:uppercase;color:var(--muted);margin-bottom:7px;}
.lz-titem{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:10px;font:600 13.5px var(--body);color:var(--ink);text-decoration:none;transition:.15s;}
.lz-titem:hover{background:var(--surface-2);text-decoration:none;}
.lz-titem-n{font:800 11px var(--body);color:var(--primary-d);background:color-mix(in srgb,var(--primary) 12%,transparent);width:20px;height:20px;border-radius:99px;display:flex;align-items:center;justify-content:center;flex:none;}
.lz-titem-m{margin-left:auto;font:600 11px var(--body);color:var(--muted);}
@media(max-width:900px){.lz-hero-split{grid-template-columns:1fr;gap:26px;}}
/* Section 2.60: [linqz_sitemap] page -- also doubles as a dense internal-link map for crawlers. */
.lz-sitemap{max-width:900px;}
.lz-sitemap-country{font-family:var(--display);font-size:19px;font-weight:800;margin:32px 0 4px;letter-spacing:-.01em;}
.lz-sitemap-country:first-child{margin-top:6px;}
.lz-sitemap-cat{font-size:12.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin:16px 0 6px;}
.lz-sitemap-list{list-style:none;margin:0 0 4px;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:2px 18px;}
.lz-sitemap-list li{padding:4px 0;}
.lz-sitemap-list a{color:var(--ink);font-size:14px;text-decoration:none;}
.lz-sitemap-list a:hover{color:var(--primary-d);text-decoration:underline;}
/* Section 2.60: FAQ accordion on calculator pages. */
.lz-calc-disclaimer a{color:var(--primary-d);}