:root{
  --ink:#0b1220;--ink-2:#111827;--text:#172033;--muted:#667085;--line:#e5e9f0;--surface:#fff;--bg:#f7f9fc;
  --blue:#2563eb;--blue-2:#1d4ed8;--green:#22c55e;--amber:#f59e0b;--danger:#ef4444;--radius:22px;--shadow:0 18px 60px rgba(17,24,39,.09);
  --font-head:"Manrope",system-ui,sans-serif;--font-body:"Inter",system-ui,sans-serif;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:var(--font-body);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}body.modal-open{overflow:hidden}a{color:inherit;text-decoration:none}button,input,select{font:inherit}button{cursor:pointer}.icon{width:20px;height:20px;display:inline-block}.container{width:min(1180px,calc(100% - 40px));margin:0 auto}.narrow{width:min(760px,100%)}.muted{color:var(--muted)}
.site-shell{min-height:100vh}.site-header{height:76px;background:rgba(255,255,255,.94);backdrop-filter:blur(18px);border-bottom:1px solid rgba(229,233,240,.9);position:sticky;top:0;z-index:60}.header-inner{height:100%;display:flex;align-items:center;gap:28px}.brand{display:inline-flex;align-items:center;gap:10px;flex:none}.brand-mark{width:36px;height:28px;position:relative;display:inline-block;border:3px solid var(--ink);border-bottom:0;border-radius:24px 24px 5px 5px;overflow:hidden}.brand-mark:after{content:"";position:absolute;width:5px;height:5px;border-radius:50%;background:var(--blue);left:50%;bottom:2px;transform:translateX(-50%)}.brand-needle{position:absolute;width:13px;height:2px;background:var(--blue);left:50%;bottom:4px;transform-origin:0 50%;transform:rotate(-47deg);border-radius:2px}.brand-word{font:800 22px/1 var(--font-head);letter-spacing:-1px;color:var(--ink)}.brand-word span{color:var(--blue)}.desktop-nav{display:flex;align-items:center;gap:3px;margin-left:10px}.nav-link{border:0;background:transparent;padding:10px 12px;border-radius:10px;color:#344054;font-weight:600;font-size:14px}.nav-link:hover{background:#f1f5f9;color:var(--ink)}.nav-menu-trigger{display:flex;align-items:center;gap:5px}.header-actions{margin-left:auto;display:flex;align-items:center;gap:8px}.header-search-btn{display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:#fff;color:#475467;padding:9px 10px;border-radius:12px;box-shadow:0 1px 2px rgba(16,24,40,.03)}.header-search-btn span{font-size:13px;font-weight:600}.header-search-btn kbd{font:600 11px var(--font-body);border:1px solid var(--line);background:#f8fafc;padding:2px 6px;border-radius:6px;color:#98a2b3}.unit-pill{border:1px solid var(--line);background:#fff;border-radius:12px;padding:10px 12px;font-weight:800;color:var(--ink);min-width:46px}.mobile-menu-btn{display:none;border:0;background:transparent;padding:10px}.mega-menu{position:absolute;left:0;right:0;top:75px;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 24px 40px rgba(15,23,42,.08);opacity:0;visibility:hidden;transform:translateY(-8px);transition:.18s ease}.mega-menu.open{opacity:1;visibility:visible;transform:none}.mega-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:22px 0 28px}.mega-item{display:flex;gap:12px;align-items:center;padding:12px;border-radius:14px}.mega-item:hover{background:#f7f9fc}.mega-icon{width:38px;height:38px;border-radius:10px;background:#eff6ff;color:var(--blue);display:grid;place-items:center;flex:none}.mega-icon .icon{width:19px}.mega-item strong{display:block;font-size:13px}.mega-item small{display:block;color:var(--muted);font-size:11px;margin-top:3px}.mega-all{grid-column:1/-1;margin-top:6px;border-top:1px solid var(--line);padding:16px 12px 0;display:flex;align-items:center;justify-content:flex-end;gap:7px;color:var(--blue);font-weight:700;font-size:13px}.mega-all .icon{width:17px}
.mobile-drawer{position:fixed;inset:0;z-index:100;visibility:hidden}.mobile-drawer.open{visibility:visible}.drawer-backdrop{position:absolute;inset:0;background:rgba(11,18,32,.5);opacity:0;transition:.2s}.mobile-drawer.open .drawer-backdrop{opacity:1}.drawer-panel{position:absolute;right:0;top:0;height:100%;width:min(360px,88vw);background:#fff;padding:18px 20px;transform:translateX(100%);transition:.22s ease;overflow:auto}.mobile-drawer.open .drawer-panel{transform:none}.drawer-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.drawer-head button{border:0;background:#f5f7fa;border-radius:10px;padding:9px}.drawer-panel>a{display:block;padding:12px 4px;border-bottom:1px solid #f1f3f6;font-weight:600;font-size:14px}.drawer-panel hr{border:0;border-top:1px solid var(--line);margin:16px 0}
.search-modal{position:fixed;inset:0;z-index:120;visibility:hidden}.search-modal.open{visibility:visible}.search-backdrop{position:absolute;inset:0;background:rgba(11,18,32,.55);backdrop-filter:blur(4px);opacity:0;transition:.2s}.search-modal.open .search-backdrop{opacity:1}.search-panel{position:relative;width:min(720px,calc(100% - 32px));max-height:min(660px,80vh);margin:10vh auto 0;background:#fff;border-radius:20px;box-shadow:0 28px 100px rgba(0,0,0,.2);overflow:hidden;transform:translateY(-14px);opacity:0;transition:.2s}.search-modal.open .search-panel{transform:none;opacity:1}.search-input-wrap{display:flex;align-items:center;gap:12px;padding:18px;border-bottom:1px solid var(--line)}.search-input-wrap .icon{color:var(--blue);width:24px}.search-input-wrap input{border:0;outline:0;flex:1;font-size:18px;color:var(--ink)}.search-input-wrap button{border:1px solid var(--line);background:#f8fafc;color:#667085;border-radius:8px;padding:6px 9px;font-size:11px}.search-results{padding:12px;max-height:520px;overflow:auto}.search-hint{padding:18px;color:var(--muted);margin:0}.search-result-item{display:flex;align-items:center;gap:12px;padding:13px;border-radius:13px}.search-result-item:hover{background:#f7f9fc}.search-result-icon{width:38px;height:38px;display:grid;place-items:center;background:#eff6ff;border-radius:11px;color:var(--blue)}.search-result-item strong{font-size:14px;display:block}.search-result-item small{color:var(--muted);display:block;margin-top:3px}.search-result-item .icon{margin-left:auto;width:17px;color:#98a2b3}
.hero-section{background:linear-gradient(180deg,#fff 0%,#f7f9fc 100%);padding:78px 0 94px;overflow:hidden;border-bottom:1px solid #edf0f4}.hero-grid{display:grid;grid-template-columns:1.02fr .98fr;align-items:center;gap:72px}.eyebrow-pill{display:inline-flex;align-items:center;gap:9px;border:1px solid #dbe7fb;color:#35527d;background:#f8fbff;padding:8px 12px;border-radius:999px;font-weight:700;font-size:12px}.eyebrow-pill span{width:7px;height:7px;background:var(--green);border-radius:50%;box-shadow:0 0 0 4px rgba(34,197,94,.12)}.hero-copy h1{font:800 clamp(48px,5.8vw,78px)/.98 var(--font-head);letter-spacing:-4.5px;color:var(--ink);margin:22px 0 20px}.hero-copy h1 em{font-style:normal;color:var(--blue)}.hero-lead{font-size:18px;line-height:1.7;color:#536179;max-width:650px;margin:0 0 28px}.hero-search{width:min(620px,100%);display:flex;align-items:center;gap:14px;text-align:left;border:1px solid #dce3ec;background:#fff;border-radius:16px;padding:15px 16px;box-shadow:0 7px 30px rgba(31,41,55,.06);transition:.2s}.hero-search:hover{transform:translateY(-2px);box-shadow:0 12px 34px rgba(31,41,55,.1);border-color:#cbd5e1}.hero-search>.icon{width:24px;color:var(--blue)}.hero-search>span{display:flex;flex-direction:column;gap:3px;flex:1}.hero-search strong{font-size:14px;color:var(--ink)}.hero-search small{font-size:12px;color:#98a2b3}.hero-search kbd{font:700 12px var(--font-body);color:#98a2b3;border:1px solid var(--line);border-radius:7px;padding:4px 8px;background:#f8fafc}.hero-actions{display:flex;gap:10px;margin-top:18px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:12px;padding:12px 16px;font-weight:700;font-size:13px;border:1px solid transparent;transition:.18s}.btn .icon{width:17px}.btn-primary{background:var(--blue);color:#fff;box-shadow:0 7px 16px rgba(37,99,235,.22)}.btn-primary:hover{background:var(--blue-2);transform:translateY(-1px)}.btn-ghost{background:#fff;border-color:var(--line);color:#344054}.btn-ghost:hover{border-color:#cbd5e1;background:#f8fafc}.btn-light{background:#fff;color:var(--ink)}.btn-danger-ghost{border-color:#fecaca;background:#fff;color:#b42318}.hero-trust{display:flex;gap:18px;align-items:center;margin-top:24px;color:#667085;font-size:12px;font-weight:600;flex-wrap:wrap}.hero-trust span{display:flex;align-items:center;gap:6px}.hero-trust .icon{width:15px;color:var(--green)}
.hero-visual{position:relative;min-height:520px;display:grid;place-items:center}.blueprint-grid{position:absolute;inset:-80px;background-image:linear-gradient(rgba(37,99,235,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(37,99,235,.055) 1px,transparent 1px);background-size:30px 30px;mask-image:radial-gradient(circle at center,#000 0%,transparent 70%)}.preview-card{position:relative;width:min(430px,92%);background:#fff;border:1px solid #e5eaf1;border-radius:24px;padding:24px;box-shadow:0 28px 70px rgba(30,41,59,.16);transform:rotate(-1deg)}.preview-top{display:flex;align-items:flex-start;justify-content:space-between;padding-bottom:18px;border-bottom:1px solid var(--line)}.mini-eyebrow{font-size:9px;letter-spacing:1.5px;font-weight:800;color:var(--blue)}.preview-top h3{margin:5px 0 0;font:700 20px var(--font-head);color:var(--ink)}.preview-badge{border:1px solid var(--line);border-radius:8px;padding:5px 8px;font-size:10px;font-weight:800;color:#475467}.preview-content{display:grid;grid-template-columns:1fr 1.05fr;gap:24px;padding:24px 0}.preview-inputs{display:flex;flex-direction:column;gap:10px}.preview-inputs label{font-size:10px;color:#667085}.preview-inputs span{display:block;margin-top:4px;border:1px solid var(--line);border-radius:8px;padding:8px 9px;color:var(--ink);font-weight:700;background:#fafbfc}.gauge-wrap{text-align:center}.gauge{width:150px;height:82px;overflow:hidden;position:relative;margin:3px auto 6px}.gauge-arc{position:absolute;width:150px;height:150px;border-radius:50%;border:16px solid #eaf0fb;border-bottom-color:transparent;border-left-color:#93c5fd;border-top-color:var(--blue);transform:rotate(45deg);top:4px}.gauge-needle{position:absolute;width:50px;height:3px;background:var(--ink);left:50%;bottom:10px;transform-origin:0 50%;transform:rotate(-42deg);border-radius:2px;z-index:2}.gauge-needle:before{content:"";width:10px;height:10px;border-radius:50%;background:var(--ink);position:absolute;left:-5px;top:-3px}.gauge-center{position:absolute;inset:auto 0 0;text-align:center}.gauge-center strong{display:block;font:800 31px var(--font-head);color:var(--ink)}.gauge-center span{display:block;font-size:8px;letter-spacing:1.5px;font-weight:800;color:#98a2b3}.gauge-wrap p{font-size:9px;color:#667085;margin:0}.preview-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px}.preview-stats div{background:#f8fafc;border-radius:10px;padding:11px}.preview-stats span{display:block;font-size:8px;color:#98a2b3;text-transform:uppercase;letter-spacing:.5px}.preview-stats strong{display:block;margin-top:4px;font-size:12px}.preview-cta{margin-top:12px;background:var(--ink);color:#fff;border-radius:11px;padding:11px 13px;font-size:11px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:7px}.preview-cta .icon{width:14px}.floating-chip{position:absolute;background:#fff;border:1px solid var(--line);box-shadow:0 12px 30px rgba(15,23,42,.12);border-radius:999px;padding:9px 12px;font-size:10px;font-weight:700;color:#475467}.chip-one{left:0;top:120px}.chip-two{right:-4px;bottom:105px;color:#166534;background:#f0fdf4;border-color:#dcfce7}
.section{padding:86px 0}.section-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:34px}.section-head.centered{text-align:center;justify-content:center}.kicker{display:block;font-size:10px;letter-spacing:1.7px;font-weight:800;color:var(--blue);margin-bottom:9px}.kicker-light{color:#93c5fd}.section-head h2,.project-promo h2,.how-section h2,.calculator-info h2,.related-section h2{font:800 clamp(30px,3vw,43px)/1.1 var(--font-head);letter-spacing:-1.7px;color:var(--ink);margin:0}.section-head p{color:var(--muted);margin:9px 0 0;line-height:1.6;font-size:14px}.text-link{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--blue);font-size:13px;white-space:nowrap}.text-link .icon{width:16px}.category-section{background:#fff}.category-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.category-card{border:1px solid var(--line);border-radius:18px;padding:20px;display:flex;gap:16px;background:#fff;transition:.18s}.category-card:hover{transform:translateY(-3px);border-color:#cbd8ee;box-shadow:0 14px 32px rgba(29,41,57,.07)}.category-icon{width:46px;height:46px;border-radius:13px;background:#eff6ff;color:var(--blue);display:grid;place-items:center;flex:none}.category-icon .icon{width:22px;height:22px}.category-icon.sm{width:40px;height:40px;border-radius:11px}.category-body h3{font:700 16px var(--font-head);margin:1px 0 6px;color:var(--ink)}.category-body p{font-size:11px;line-height:1.55;color:#7b8798;margin:0 0 11px}.category-body>span{display:flex;align-items:center;gap:5px;color:var(--blue);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.4px}.category-body .icon{width:13px}.popular-section{background:#f7f9fc}.tool-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.tool-card{position:relative;background:#fff;border:1px solid var(--line);border-radius:17px;padding:18px;display:flex;gap:13px;min-height:150px;transition:.18s}.tool-card:hover{border-color:#cbd8ee;box-shadow:0 12px 30px rgba(31,41,55,.07);transform:translateY(-2px)}.tool-card-icon{width:39px;height:39px;display:grid;place-items:center;background:#f2f6ff;color:var(--blue);border-radius:11px;flex:none}.tool-card-icon .icon{width:19px}.tool-card small{font-size:8px;color:#98a2b3;letter-spacing:.8px;text-transform:uppercase;font-weight:800}.tool-card h3{font:700 15px var(--font-head);color:var(--ink);margin:5px 28px 7px 0}.tool-card p{font-size:10.5px;line-height:1.55;color:#7b8798;margin:0}.tool-arrow{position:absolute;right:16px;top:19px;color:#c0c8d4}.tool-arrow .icon{width:16px}.tool-card:hover .tool-arrow{color:var(--blue);transform:translateX(2px)}.project-promo-section{padding-top:40px}.project-promo{background:var(--ink);border-radius:28px;min-height:430px;padding:58px 62px;display:grid;grid-template-columns:1fr .85fr;gap:70px;align-items:center;overflow:hidden;position:relative}.project-promo:after{content:"";position:absolute;width:500px;height:500px;border-radius:50%;border:1px solid rgba(255,255,255,.06);right:-180px;top:-220px;box-shadow:0 0 0 70px rgba(255,255,255,.018),0 0 0 140px rgba(255,255,255,.012)}.promo-copy{position:relative;z-index:2}.promo-copy h2{color:#fff;font-size:44px}.promo-copy p{color:#aab7cb;line-height:1.8;margin:18px 0 26px;font-size:14px;max-width:580px}.project-preview{position:relative;z-index:2;background:#fff;border-radius:20px;padding:22px;box-shadow:0 24px 60px rgba(0,0,0,.25);transform:rotate(1deg)}.project-preview-head{border-bottom:1px solid var(--line);padding-bottom:15px}.project-preview-head span{display:block;font-size:8px;color:var(--blue);letter-spacing:1.5px;font-weight:800}.project-preview-head strong{display:block;font:700 16px var(--font-head);margin-top:5px}.project-row{display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center;padding:13px 0;border-bottom:1px solid #f1f3f6}.row-check{width:24px;height:24px;border-radius:50%;background:#ecfdf3;color:#16a34a;display:grid;place-items:center;font-size:10px;font-weight:900}.project-row strong{display:block;font-size:11px}.project-row small{display:block;color:#98a2b3;margin-top:3px;font-size:9px}.project-row b{font-size:11px}.project-total{display:flex;align-items:center;justify-content:space-between;padding-top:18px}.project-total span{font-size:10px;color:#667085}.project-total strong{font:800 21px var(--font-head)}.how-section{background:#fff}.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:50px;margin-top:45px}.steps-grid>div{position:relative;padding-top:12px}.steps-grid>div:before{content:"";position:absolute;top:0;left:0;width:42px;height:3px;background:var(--blue);border-radius:10px}.steps-grid span{font:800 11px var(--font-head);color:#a6b1c0}.steps-grid h3{font:700 18px var(--font-head);margin:13px 0 8px;color:var(--ink)}.steps-grid p{color:var(--muted);font-size:12px;line-height:1.7;margin:0}
.page-hero{background:#fff;border-bottom:1px solid var(--line);padding:80px 0}.page-hero.compact{padding:68px 0}.page-hero h1{font:800 clamp(40px,5vw,62px)/1.05 var(--font-head);letter-spacing:-3px;color:var(--ink);margin:8px 0 14px}.page-hero p{font-size:16px;line-height:1.7;color:#667085;max-width:730px;margin:0}.directory-search{margin-top:26px;width:min(620px,100%);display:flex;align-items:center;gap:11px;border:1px solid var(--line);background:#fff;border-radius:14px;padding:13px 15px;box-shadow:0 5px 20px rgba(16,24,40,.05)}.directory-search .icon{color:var(--blue)}.directory-search input{flex:1;border:0;outline:0;font-size:14px}.directory-section{background:#f7f9fc}.filter-chips{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:28px}.filter-chips button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:8px 11px;font-size:10px;font-weight:700;color:#667085}.filter-chips button.active,.filter-chips button:hover{background:var(--ink);color:#fff;border-color:var(--ink)}.directory-group{background:#fff;border:1px solid var(--line);border-radius:20px;margin-bottom:18px;overflow:hidden}.directory-heading{display:grid;grid-template-columns:auto 1fr auto;gap:14px;align-items:center;padding:21px 22px;border-bottom:1px solid var(--line)}.directory-heading h2{font:700 19px var(--font-head);margin:0}.directory-heading p{margin:4px 0 0;color:#7d8999;font-size:10px}.directory-heading>span:last-child{font-size:9px;color:#98a2b3;font-weight:800;text-transform:uppercase;letter-spacing:.7px}.directory-list{display:grid;grid-template-columns:1fr 1fr}.directory-list a{position:relative;padding:15px 46px 15px 22px;border-bottom:1px solid #f0f2f5}.directory-list a:nth-child(odd){border-right:1px solid #f0f2f5}.directory-list a:hover{background:#fafcff}.directory-list span{display:block;font-weight:700;font-size:12px;color:#253047}.directory-list small{display:block;color:#98a2b3;font-size:9px;line-height:1.5;margin-top:4px}.directory-list .icon{position:absolute;right:18px;top:22px;width:14px;color:#c1c9d5}.directory-list a:hover .icon{color:var(--blue)}.category-hero{text-align:center;background:linear-gradient(180deg,#fff,#f8fbff)}.category-hero .container{display:flex;align-items:center;flex-direction:column}.category-hero-icon{width:62px;height:62px;border-radius:18px;background:#eaf2ff;color:var(--blue);display:grid;place-items:center;margin-bottom:17px}.category-hero-icon .icon{width:29px;height:29px}.category-hero p{text-align:center}.hero-meta{display:flex;align-items:center;gap:8px;margin-top:20px;flex-wrap:wrap;justify-content:center}.hero-meta span{font-size:9px;font-weight:800;color:#667085;border:1px solid var(--line);background:#fff;border-radius:999px;padding:6px 9px}.category-tools .tool-card.large{min-height:165px}
.calculator-page{padding:28px 0 90px;background:#f7f9fc}.breadcrumbs{display:flex;align-items:center;gap:7px;color:#8a95a4;font-size:10px;padding:8px 0 18px;flex-wrap:wrap}.breadcrumbs a:hover{color:var(--blue)}.calculator-title{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:27px}.calculator-title h1{font:800 clamp(34px,4vw,52px)/1.08 var(--font-head);letter-spacing:-2.2px;color:var(--ink);margin:4px 0 8px}.calculator-title p{margin:0;color:#667085;font-size:13px;line-height:1.65;max-width:720px}.icon-text-btn{border:1px solid var(--line);background:#fff;border-radius:10px;padding:9px 12px;color:#667085;font-size:11px;font-weight:700}.calculator-shell{display:grid;grid-template-columns:1.05fr .95fr;background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:0 12px 42px rgba(16,24,40,.06);overflow:visible}.calculator-input-panel,.calculator-result-panel{padding:28px}.calculator-input-panel{border-right:1px solid var(--line)}.calculator-result-panel{background:#fbfcfe;border-radius:0 24px 24px 0;align-self:start;position:sticky;top:92px;min-height:510px}.panel-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;padding-bottom:21px;border-bottom:1px solid var(--line);margin-bottom:22px}.panel-heading>div{display:flex;gap:11px}.panel-step{width:28px;height:28px;border-radius:9px;background:#eef4ff;color:var(--blue);font:800 11px var(--font-head);display:grid;place-items:center;flex:none}.panel-step.accent{background:var(--ink);color:#fff}.panel-heading h2{font:700 16px var(--font-head);margin:0;color:var(--ink)}.panel-heading p{font-size:9px;color:#98a2b3;margin:4px 0 0}.reset-link{border:0;background:transparent;color:#98a2b3;font-size:9px;font-weight:700}.reset-link:hover{color:var(--blue)}.result-status{font-size:8px;font-weight:900;letter-spacing:1px;color:#16a34a;background:#ecfdf3;padding:5px 7px;border-radius:999px}.dynamic-form{display:grid;grid-template-columns:1fr 1fr;gap:16px}.field{display:flex;flex-direction:column;gap:6px}.field.full{grid-column:1/-1}.field label{font-size:10px;color:#475467;font-weight:700}.field-help{font-size:8px;color:#98a2b3;margin-top:-2px}.input-unit{display:flex;border:1px solid #dce2ea;background:#fff;border-radius:10px;overflow:hidden;transition:.15s}.input-unit:focus-within{border-color:#8bb0f9;box-shadow:0 0 0 3px rgba(37,99,235,.08)}.input-unit input,.input-unit select{border:0;outline:0;background:transparent}.input-unit input{width:100%;padding:11px 12px;color:var(--ink);font-weight:700;font-size:12px}.input-unit select,.unit-label{border-left:1px solid #edf0f4;background:#f9fafb;padding:0 10px;display:flex;align-items:center;color:#667085;font-size:9px;font-weight:700;min-width:50px;justify-content:center}.field>select{border:1px solid #dce2ea;border-radius:10px;padding:11px 12px;background:#fff;font-size:11px;color:var(--ink);outline:none}.field>select:focus{border-color:#8bb0f9;box-shadow:0 0 0 3px rgba(37,99,235,.08)}.checkbox-field{grid-column:1/-1;display:flex;align-items:center;gap:9px;padding:11px 12px;background:#f8fafc;border:1px solid #edf0f4;border-radius:10px}.checkbox-field input{width:16px;height:16px;accent-color:var(--blue)}.checkbox-field label{font-size:10px;font-weight:600}.btn-calculate{width:100%;margin-top:20px;padding:13px}.input-note{text-align:center;color:#a0a9b6;font-size:8px;margin:11px 0 0}.results-empty{min-height:340px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:20px}.results-empty h3{font:700 16px var(--font-head);margin:12px 0 5px}.results-empty p{max-width:310px;color:#8b96a6;font-size:10px;line-height:1.6}.empty-gauge{width:92px;height:48px;overflow:hidden;position:relative}.empty-gauge:before{content:"";position:absolute;width:86px;height:86px;border:8px solid #e7ebf1;border-bottom-color:transparent;border-radius:50%;transform:rotate(45deg);left:3px;top:4px}.empty-gauge span{position:absolute;width:31px;height:2px;background:#bbc4d0;left:46px;bottom:5px;transform:rotate(-42deg);transform-origin:left}.result-primary{text-align:center;padding:8px 0 22px}.result-gauge{width:160px;height:84px;position:relative;overflow:hidden;margin:0 auto}.result-gauge:before{content:"";position:absolute;width:150px;height:150px;left:5px;top:5px;border:15px solid #eaf0fb;border-left-color:#93c5fd;border-top-color:var(--blue);border-bottom-color:transparent;border-radius:50%;transform:rotate(45deg)}.result-gauge:after{content:"";position:absolute;width:48px;height:3px;background:var(--ink);left:80px;bottom:9px;transform-origin:left;transform:rotate(-40deg);border-radius:4px}.result-gauge-value{position:absolute;left:0;right:0;bottom:0;text-align:center;z-index:2}.result-gauge-value strong{display:block;font:800 27px var(--font-head);color:var(--ink)}.result-gauge-value small{display:block;font-size:7px;letter-spacing:1.1px;text-transform:uppercase;color:#98a2b3;font-weight:800}.result-primary>p{font-size:9px;color:#7d8898;margin:7px 0 0}.result-cards{display:grid;grid-template-columns:1fr 1fr;gap:9px}.result-card{background:#fff;border:1px solid #e8ecf2;border-radius:11px;padding:11px}.result-card span{font-size:8px;color:#98a2b3;display:block;text-transform:uppercase;letter-spacing:.5px;font-weight:700}.result-card strong{font-size:12px;color:var(--ink);display:block;margin-top:4px}.result-card.full{grid-column:1/-1}.result-breakdown{margin-top:13px;border-top:1px solid var(--line);padding-top:12px}.breakdown-row{display:flex;justify-content:space-between;gap:12px;padding:6px 0;font-size:9px;color:#667085}.breakdown-row strong{color:#344054}.project-add-btn{width:100%;margin-top:14px;background:var(--ink);color:#fff;border:0;border-radius:11px;padding:11px;font-size:10px;font-weight:800}.project-add-btn.added{background:#166534}.result-assumption{margin-top:11px;background:#fffbeb;border:1px solid #fde68a;border-radius:10px;padding:9px 10px;font-size:8px;line-height:1.55;color:#8a5b12}.calculator-support-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}.support-card{background:#fff;border:1px solid var(--line);border-radius:15px;padding:17px;display:flex;gap:12px}.support-icon{width:32px;height:32px;border-radius:9px;background:#eef4ff;color:var(--blue);display:grid;place-items:center;flex:none;font-weight:900}.support-card h3{font:700 12px var(--font-head);margin:0 0 5px}.support-card p{color:#8994a3;font-size:8.5px;line-height:1.55;margin:0}.calculator-info{margin-top:72px;border-top:1px solid var(--line);padding-top:52px;display:grid;grid-template-columns:.8fr 1.2fr;gap:80px}.calculator-info p{color:#667085;font-size:12px;line-height:1.8;margin:0 0 12px}.related-section{margin-top:70px}.related-grid{grid-template-columns:repeat(4,1fr)}.related-grid .tool-card{min-height:160px}
.project-hero{text-align:center}.project-hero .container{display:flex;flex-direction:column;align-items:center}.project-hero p{text-align:center}.project-page{min-height:520px}.project-toolbar{display:flex;justify-content:space-between;gap:20px;align-items:end;background:#fff;border:1px solid var(--line);padding:18px;border-radius:16px;margin-bottom:16px}.project-toolbar label{display:block;color:#667085;font-size:9px;font-weight:700;margin-bottom:5px}.project-toolbar input{border:1px solid var(--line);border-radius:9px;padding:9px 11px;font-weight:700;color:var(--ink);min-width:270px;outline:0}.project-toolbar-actions{display:flex;gap:8px}.project-empty{background:#fff;border:1px dashed #d9e0ea;border-radius:20px;padding:70px 20px;text-align:center}.project-empty-icon{width:55px;height:55px;border-radius:16px;background:#eff6ff;color:var(--blue);display:grid;place-items:center;margin:0 auto 15px;font-size:22px}.project-empty h2{font:700 21px var(--font-head);margin:0 0 7px}.project-empty p{color:#7b8798;font-size:11px;line-height:1.7;margin:0 auto 18px;max-width:480px}.saved-project-list{display:grid;gap:10px}.saved-project-item{background:#fff;border:1px solid var(--line);border-radius:15px;padding:16px;display:grid;grid-template-columns:42px 1fr auto auto;align-items:center;gap:13px}.saved-project-icon{width:42px;height:42px;border-radius:12px;background:#eff6ff;color:var(--blue);display:grid;place-items:center;font-weight:900}.saved-project-item h3{font:700 13px var(--font-head);margin:0}.saved-project-item p{font-size:9px;color:#98a2b3;margin:4px 0 0}.saved-project-item strong{font-size:12px}.remove-project-item{border:0;background:#fff;color:#b42318;width:30px;height:30px;border-radius:8px}.remove-project-item:hover{background:#fef2f2}.project-summary-box{margin-top:14px;background:var(--ink);color:#fff;border-radius:16px;padding:20px;display:flex;align-items:center;justify-content:space-between}.project-summary-box span{color:#aeb9c9;font-size:10px}.project-summary-box strong{font:800 24px var(--font-head)}.content-placeholder{background:#fff;border:1px solid var(--line);padding:32px;border-radius:20px}.content-placeholder h2{font:700 22px var(--font-head);margin:0 0 10px}.content-placeholder p{color:#667085;line-height:1.8;font-size:13px}.site-footer{background:#09111f;color:#fff;padding:62px 0 20px}.footer-grid{display:grid;grid-template-columns:1.6fr repeat(3,1fr);gap:50px}.brand-footer .brand-mark{border-color:#fff}.brand-footer .brand-word{color:#fff}.footer-brand>p{font:700 13px var(--font-head);margin:16px 0 7px}.footer-brand .muted{font:400 10px/1.7 var(--font-body);max-width:300px;color:#7f8da3}.site-footer h4{font:700 11px var(--font-head);margin:4px 0 14px}.site-footer>div>div:not(.footer-brand) a{display:block;color:#8997aa;font-size:10px;margin:9px 0}.site-footer>div>div:not(.footer-brand) a:hover{color:#fff}.footer-bottom{border-top:1px solid rgba(255,255,255,.08);margin-top:42px;padding-top:18px;display:flex;justify-content:space-between;gap:15px;color:#637188;font-size:8px}.mobile-bottom-nav{display:none}
@media(max-width:1020px){.desktop-nav{display:none}.mobile-menu-btn{display:grid;place-items:center}.header-search-btn span,.header-search-btn kbd{display:none}.mega-menu{display:none}.hero-grid{grid-template-columns:1fr;gap:40px}.hero-copy{text-align:center}.hero-copy h1{font-size:65px}.hero-lead,.hero-search{margin-left:auto;margin-right:auto}.hero-actions,.hero-trust{justify-content:center}.hero-visual{min-height:430px}.chip-one{left:15%}.chip-two{right:12%}.category-grid{grid-template-columns:repeat(2,1fr)}.tool-grid{grid-template-columns:repeat(2,1fr)}.project-promo{grid-template-columns:1fr 1fr;gap:34px;padding:45px}.calculator-shell{grid-template-columns:1fr}.calculator-input-panel{border-right:0;border-bottom:1px solid var(--line)}.calculator-result-panel{position:relative;top:auto;border-radius:0 0 24px 24px}.calculator-support-grid{grid-template-columns:1fr 1fr 1fr}.related-grid{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:1.4fr repeat(3,1fr);gap:25px}}
@media(max-width:720px){body{padding-bottom:64px}.container{width:min(100% - 26px,1180px)}.site-header{height:64px}.header-inner{gap:10px}.brand-mark{width:31px;height:24px;border-width:2.5px}.brand-word{font-size:19px}.header-search-btn{padding:8px}.unit-pill{padding:9px;font-size:11px;min-width:42px}.hero-section{padding:50px 0 58px}.hero-grid{gap:26px}.eyebrow-pill{font-size:9px}.hero-copy h1{font-size:48px;letter-spacing:-3px;margin-top:18px}.hero-lead{font-size:14px}.hero-search{padding:13px}.hero-actions .btn{flex:1}.hero-trust{gap:10px;font-size:9px}.hero-visual{min-height:350px}.preview-card{width:95%;padding:18px}.preview-content{gap:10px}.gauge{transform:scale(.82);margin-left:-3px}.floating-chip{display:none}.section{padding:60px 0}.section-head{align-items:flex-start}.section-head h2,.project-promo h2,.how-section h2,.calculator-info h2,.related-section h2{font-size:31px}.section-head .text-link{display:none}.category-grid{grid-template-columns:1fr;gap:10px}.category-card{padding:16px}.tool-grid{grid-template-columns:1fr;gap:9px}.tool-card{min-height:132px}.project-promo-section{padding:20px 0 55px}.project-promo{grid-template-columns:1fr;padding:34px 23px;border-radius:22px;gap:28px}.promo-copy h2{font-size:34px}.steps-grid{grid-template-columns:1fr;gap:30px}.page-hero,.page-hero.compact{padding:48px 0}.page-hero h1{font-size:42px;letter-spacing:-2px}.page-hero p{font-size:13px}.filter-chips{overflow-x:auto;flex-wrap:nowrap;padding-bottom:5px}.filter-chips button{white-space:nowrap}.directory-heading{grid-template-columns:auto 1fr}.directory-heading>span:last-child{grid-column:2}.directory-list{grid-template-columns:1fr}.directory-list a:nth-child(odd){border-right:0}.calculator-page{padding-top:15px}.calculator-title{display:block}.calculator-title-actions{margin-top:13px}.calculator-shell{border-radius:18px}.calculator-input-panel,.calculator-result-panel{padding:20px 17px}.calculator-result-panel{min-height:430px}.dynamic-form{grid-template-columns:1fr}.field.full{grid-column:auto}.checkbox-field{grid-column:auto}.calculator-support-grid{grid-template-columns:1fr}.calculator-info{grid-template-columns:1fr;gap:20px;margin-top:55px;padding-top:40px}.related-grid{grid-template-columns:1fr}.project-toolbar{display:block}.project-toolbar input{min-width:0;width:100%}.project-toolbar-actions{margin-top:12px}.saved-project-item{grid-template-columns:36px 1fr auto}.saved-project-item>strong{grid-column:2}.saved-project-item .remove-project-item{grid-column:3;grid-row:1}.footer-grid{grid-template-columns:1fr 1fr;gap:35px}.footer-brand{grid-column:1/-1}.footer-bottom{display:block;line-height:1.8}.mobile-bottom-nav{position:fixed;display:grid;grid-template-columns:repeat(4,1fr);left:0;right:0;bottom:0;height:64px;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-top:1px solid var(--line);z-index:50}.mobile-bottom-nav a,.mobile-bottom-nav button{border:0;background:transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:#667085;font-size:17px}.mobile-bottom-nav small{font-size:8px;font-weight:700}.search-panel{margin-top:4vh}.search-results{max-height:68vh}}
@media print{.site-header,.site-footer,.mobile-bottom-nav,.project-toolbar-actions,.remove-project-item{display:none!important}body{background:#fff;padding:0}.project-page{padding:0}.saved-project-item{break-inside:avoid}.project-summary-box{background:#fff;color:#000;border:1px solid #ddd}}


/* DIYGauge v1.1 visual polish — additive overrides */
.brand{gap:11px}.brand-mark{width:39px;height:30px}.brand-word{font-size:24px;letter-spacing:-1.15px}
.unit-switcher{position:relative}.unit-pill{display:flex;align-items:center;justify-content:center;gap:6px;min-width:58px;transition:.16s}.unit-pill:hover,.unit-pill[aria-expanded="true"]{border-color:#c9d5e8;background:#f8fbff;box-shadow:0 5px 18px rgba(31,41,55,.07)}.unit-chevron{font-size:11px;color:#8a95a4;transform:translateY(-1px)}.unit-menu{position:absolute;right:0;top:calc(100% + 10px);width:230px;padding:9px;background:#fff;border:1px solid var(--line);border-radius:15px;box-shadow:0 20px 55px rgba(15,23,42,.16);opacity:0;visibility:hidden;transform:translateY(-5px);transition:.16s;z-index:85}.unit-menu.open{opacity:1;visibility:visible;transform:none}.unit-menu-label{display:block;padding:7px 9px 8px;color:#98a2b3;text-transform:uppercase;letter-spacing:.75px;font-size:8px;font-weight:800}.unit-menu button{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;border:0;background:#fff;padding:10px;border-radius:10px;text-align:left;color:var(--ink)}.unit-menu button:hover{background:#f6f9fe}.unit-menu button>span{display:flex;flex-direction:column;gap:3px}.unit-menu strong{font-size:11px}.unit-menu small{font-size:8px;color:#98a2b3}.unit-menu b{opacity:0;color:var(--blue);font-size:12px}.unit-menu button.active{background:#eff6ff}.unit-menu button.active b{opacity:1}
.category-body p,.tool-card p{color:#64748b}.category-card{will-change:transform}.category-card:hover{transform:translateY(-3px);border-color:#b9cdf0;box-shadow:0 16px 38px rgba(29,41,57,.085)}.category-card:hover .category-icon{background:#e6efff}.category-card:hover .category-body>span .icon{transform:translateX(2px)}.category-icon,.category-body>span .icon,.tool-arrow{transition:.18s}.tool-card h3{font-size:16px;line-height:1.28}.tool-card:hover{border-color:#b9cdf0;box-shadow:0 15px 34px rgba(31,41,55,.08)}
.popular-section{padding-bottom:66px}.project-promo-section{padding-top:28px}.how-section{padding-top:70px;padding-bottom:70px}.steps-grid{margin-top:4px}
.reset-link{display:inline-flex;align-items:center;gap:4px;padding:5px 7px;border-radius:7px}.reset-link:hover{background:#f1f5f9}.reset-link span{font-size:12px;line-height:1}
.result-gauge-value strong{font-size:32px;letter-spacing:-1px}.result-primary{padding-bottom:17px}.result-summary{width:min(250px,100%);margin:11px auto 0;padding:10px 13px;border:1px solid #dfe7f3;background:#fff;border-radius:12px}.result-summary span{display:block;font-size:7px;color:#98a2b3;letter-spacing:.7px;text-transform:uppercase;font-weight:800}.result-summary strong{display:block;margin-top:4px;font:800 14px var(--font-head);color:var(--ink)}
.result-card strong{font-size:12.5px}.breakdown-row{font-size:9.5px;padding:7px 0}.result-breakdown{margin-top:15px}.result-visual{margin-top:13px;background:#f7faff;border:1px solid #e3ebf7;border-radius:12px;padding:11px 12px 13px}.result-visual-kicker{display:block;color:#7c8da6;font-size:7px;font-weight:800;letter-spacing:.8px;margin-bottom:10px}.dimension-plan{width:150px;height:84px;position:relative;margin:0 auto 2px;padding-top:15px}.plan-box{height:56px;border:2px solid #8fb2f4;background:linear-gradient(135deg,rgba(37,99,235,.035) 25%,transparent 25%) 0 0/12px 12px;border-radius:4px;position:relative}.plan-box span{position:absolute;left:50%;top:50%;width:28px;height:2px;background:var(--blue);transform:translate(-50%,-50%) rotate(-32deg);border-radius:2px}.dimension-top{position:absolute;top:0;left:0;right:0;text-align:center;font-size:8px;font-weight:700;color:#52647c}.dimension-side{position:absolute;right:-34px;top:41px;transform:rotate(90deg);font-size:8px;font-weight:700;color:#52647c}
.money-input{position:relative}.money-prefix{display:flex;align-items:center;justify-content:center;min-width:38px;padding:0 10px;background:#f9fafb;border-right:1px solid #edf0f4;color:#667085;font-size:10px;font-weight:800}.money-input input{padding-left:11px}.project-add-btn{transition:.16s}.project-add-btn:hover{background:#17233a;transform:translateY(-1px)}
@media(max-width:720px){.brand-mark{width:33px;height:25px}.brand-word{font-size:20px}.unit-pill{min-width:53px;padding:9px 8px}.unit-menu{right:-44px;width:218px}.popular-section{padding-bottom:48px}.project-promo-section{padding-top:18px}.how-section{padding-top:54px;padding-bottom:54px}.result-summary{width:100%}.dimension-plan{width:140px}}

/* DIYGauge v1.2 — clean calculator UI */
.calculator-result-panel .result-heading{justify-content:flex-start}
.calculator-input-panel .btn-calculate{margin-top:22px}
.calculator-shell{margin-bottom:0}
@media (max-width:760px){.calculator-input-panel .btn-calculate{margin-top:18px}}

/* ==========================================================
   DIYGauge v1.5 — Final Professional Design
   Visual-only overrides. No calculator logic is changed.
   ========================================================== */

/* Calculator page: stronger hierarchy, cleaner reading rhythm */
.calculator-page{
  background:
    radial-gradient(circle at 88% 7%,rgba(37,99,235,.035),transparent 26%),
    #f7f9fc;
  padding-top:30px;
}
.calculator-title{margin-bottom:30px}
.calculator-title h1{
  font-size:clamp(38px,4vw,54px);
  letter-spacing:-2.35px;
}
.calculator-title p{
  max-width:760px;
  font-size:14px;
  line-height:1.65;
  color:#5f6f86;
}
.icon-text-btn{
  min-height:40px;
  padding:10px 14px;
  border-radius:11px;
  background:#fff;
  box-shadow:0 1px 2px rgba(16,24,40,.025);
  transition:.16s ease;
}
.icon-text-btn:hover{border-color:#c9d5e8;color:var(--ink);transform:translateY(-1px)}

.calculator-shell{
  grid-template-columns:1.02fr .98fr;
  border-color:#dfe5ed;
  border-radius:26px;
  box-shadow:0 18px 55px rgba(16,24,40,.075);
}
.calculator-input-panel,.calculator-result-panel{padding:32px}
.calculator-input-panel{border-right-color:#e2e7ef}
.calculator-result-panel{
  top:94px;
  min-height:540px;
  background:linear-gradient(180deg,#fcfdff 0%,#f8fafe 100%);
  border-radius:0 26px 26px 0;
}
.panel-heading{
  padding-bottom:23px;
  margin-bottom:24px;
}
.panel-heading>div{gap:12px}
.panel-step{
  width:30px;height:30px;border-radius:9px;
  font-size:12px;
}
.panel-heading h2{font-size:18px;letter-spacing:-.25px}
.panel-heading p{font-size:10px;margin-top:5px;line-height:1.45}
.reset-link{font-size:10px;padding:6px 8px}

/* Form controls: larger, calmer, easier to use on desktop and mobile */
.dynamic-form{gap:18px 16px}
.field{gap:7px}
.field label{font-size:11px;color:#344054;font-weight:700}
.field-help{font-size:9px;line-height:1.45}
.input-unit{min-height:44px;border-color:#d8e0ea;border-radius:11px}
.input-unit:focus-within{border-color:#7fa8f6;box-shadow:0 0 0 4px rgba(37,99,235,.07)}
.input-unit input{padding:12px 13px;font-size:13px}
.input-unit select,.unit-label{font-size:10px;min-width:54px;padding:0 11px}
.field>select{min-height:44px;padding:12px 13px;font-size:12px;border-radius:11px;border-color:#d8e0ea}
.checkbox-field label{font-size:11px}
.money-prefix{font-size:11px;min-width:40px}
.calculator-input-panel .btn-calculate{
  min-height:50px;
  margin-top:24px;
  border-radius:12px;
  font-size:13px;
  box-shadow:0 9px 22px rgba(37,99,235,.22);
}

/* Result: the answer is the hero. The old centre needle is moved off the number. */
.result-primary{padding:16px 0 22px}
.result-gauge{
  width:210px;
  height:108px;
  margin:0 auto;
  overflow:hidden;
}
.result-gauge:before{
  width:190px;height:190px;
  left:10px;top:8px;
  border-width:18px;
  border-color:#e8effa;
  border-left-color:#8fc1fb;
  border-top-color:var(--blue);
}
.result-gauge:after{
  /* gauge indicator kept as a brand cue, but no longer crosses the answer */
  width:28px;height:4px;
  left:auto;right:18px;
  top:54px;bottom:auto;
  transform:rotate(-38deg);
  transform-origin:center;
  border-radius:999px;
  background:var(--ink);
  z-index:1;
}
.result-gauge-value{
  bottom:3px;
  z-index:3;
}
.result-gauge-value strong{
  font-size:43px;
  line-height:.95;
  letter-spacing:-2px;
}
.result-gauge-value small{
  margin-top:5px;
  font-size:8px;
  letter-spacing:1.45px;
}
.result-summary{
  width:min(315px,100%);
  margin:15px auto 0;
  padding:14px 16px;
  border-color:#d7e1ef;
  border-radius:14px;
  box-shadow:0 4px 15px rgba(30,64,175,.035);
}
.result-summary span{font-size:8px;letter-spacing:.85px}
.result-summary strong{
  margin-top:5px;
  font-size:18px;
  line-height:1.25;
}
.result-cards{gap:11px}
.result-card{
  min-height:66px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:13px 14px;
  border-color:#e1e7ef;
  border-radius:12px;
  background:rgba(255,255,255,.92);
}
.result-card span{font-size:8px;letter-spacing:.65px}
.result-card strong{font-size:14px;line-height:1.3;margin-top:5px}
.result-breakdown{
  margin-top:18px;
  padding-top:14px;
}
.breakdown-row{font-size:10.5px;padding:8px 1px}
.breakdown-row strong{font-weight:700;color:#1f2937}
.project-add-btn{
  min-height:43px;
  margin-top:17px;
  border-radius:11px;
  font-size:11px;
  box-shadow:0 5px 14px rgba(11,18,32,.08);
}

/* Project View: useful rather than decorative */
.result-visual{
  margin-top:16px;
  padding:14px 16px 16px;
  border-radius:14px;
  background:linear-gradient(180deg,#f8fbff,#f5f9ff);
  border-color:#dbe7f6;
}
.result-visual-kicker{font-size:8px;letter-spacing:.9px;margin-bottom:12px}
.dimension-plan{
  width:220px;
  height:118px;
  padding-top:20px;
  margin-bottom:2px;
}
.plan-box{
  height:80px;
  border-radius:6px;
  background-size:14px 14px;
}
.plan-box span{width:36px;height:2px}
.dimension-top{font-size:9px}
.dimension-side{right:-39px;top:58px;font-size:9px}

/* Empty/error state stays quiet and professional */
.results-empty{min-height:380px;padding:30px}
.results-empty h3{font-size:18px;margin-top:14px}
.results-empty p{font-size:11px;line-height:1.65}
.empty-gauge{transform:scale(1.08);margin-bottom:4px}

/* Supporting content: readable without competing with the calculator */
.calculator-info{margin-top:68px;padding-top:48px;gap:72px}
.calculator-info p{font-size:13px;line-height:1.8}
.related-section{margin-top:64px}

/* The homepage preview uses a marker instead of a line through the number. */
.gauge-needle{
  width:24px;height:3px;
  left:auto;right:14px;
  bottom:auto;top:44px;
  transform:rotate(-39deg);
  transform-origin:center;
}
.gauge-needle:before{display:none}

/* Tablet: preserve the premium two-panel feel but remove sticky behavior. */
@media(max-width:1020px){
  .calculator-shell{grid-template-columns:1fr}
  .calculator-input-panel{border-right:0;border-bottom:1px solid var(--line)}
  .calculator-result-panel{position:relative;top:auto;border-radius:0 0 26px 26px}
}

/* Mobile: larger answers and controls, less dead space. */
@media(max-width:720px){
  .calculator-page{padding-top:14px;padding-bottom:72px}
  .calculator-title{margin-bottom:20px}
  .calculator-title h1{font-size:36px;letter-spacing:-1.8px;line-height:1.05}
  .calculator-title p{font-size:12.5px;line-height:1.6}
  .calculator-title-actions{margin-top:12px}
  .calculator-shell{border-radius:20px;box-shadow:0 12px 34px rgba(16,24,40,.065)}
  .calculator-input-panel,.calculator-result-panel{padding:21px 18px}
  .calculator-result-panel{border-radius:0 0 20px 20px;min-height:0}
  .panel-heading{padding-bottom:18px;margin-bottom:19px}
  .panel-heading h2{font-size:17px}
  .panel-heading p{font-size:9.5px}
  .dynamic-form{gap:15px}
  .field label{font-size:10.5px}
  .input-unit{min-height:46px}
  .input-unit input{font-size:13.5px;padding:12px}
  .field>select{min-height:46px;font-size:12.5px}
  .calculator-input-panel .btn-calculate{min-height:50px;margin-top:19px}
  .result-primary{padding:12px 0 19px}
  .result-gauge{width:195px;height:101px}
  .result-gauge:before{width:176px;height:176px;left:9px;border-width:17px}
  .result-gauge:after{right:17px;top:50px;width:25px}
  .result-gauge-value strong{font-size:40px}
  .result-summary{width:100%;padding:13px 14px;margin-top:13px}
  .result-summary strong{font-size:17px}
  .result-card{min-height:64px;padding:12px}
  .result-card strong{font-size:13.5px}
  .breakdown-row{font-size:10.5px}
  .result-visual{padding:13px 14px 15px}
  .dimension-plan{width:190px;height:108px;padding-top:19px}
  .plan-box{height:72px}
  .dimension-side{top:54px}
  .calculator-info{margin-top:48px;padding-top:36px}
  .calculator-info p{font-size:12px}
}

@media(max-width:420px){
  .calculator-title h1{font-size:32px}
  .result-cards{grid-template-columns:1fr}
  .result-card.full{grid-column:auto}
  .dimension-plan{width:170px}
  .result-gauge{width:185px}
  .result-gauge:before{width:166px;height:166px}
}

/* ==========================================================
   DIYGauge v1.7 — Final unified SVG gauge
   Arc, value, unit, pivot and needle share one coordinate system.
   ========================================================== */
.result-primary{
  display:flex;
  flex-direction:column;
  align-items:center;
  width:100%;
  padding:16px 0 23px;
}
.result-gauge{
  --dg-width:210px;
  --dg-font:58px;
  width:min(var(--dg-width),100%);
  aspect-ratio:360/220;
  height:auto !important;
  margin:0 auto;
  position:relative;
  overflow:visible !important;
  background:none !important;
  flex:none;
}
.result-gauge--sm{--dg-width:180px;--dg-font:58px}
.result-gauge--md{--dg-width:210px;--dg-font:46px}
.result-gauge--lg{--dg-width:250px;--dg-font:40px}
.result-gauge--xl{--dg-width:290px;--dg-font:31px}
.result-gauge:before,.result-gauge:after,.result-gauge-value{display:none !important;content:none !important}
.result-gauge-svg{display:block;width:100%;height:100%;overflow:visible}
.result-gauge-track,.result-gauge-accent{
  fill:none;
  stroke-width:22;
  stroke-linecap:butt;
  vector-effect:non-scaling-stroke;
}
.result-gauge-track{stroke:#8fc1fb}
.result-gauge-accent{stroke:var(--blue)}
.result-gauge-number{
  fill:var(--ink);
  font-family:var(--font-head);
  font-size:var(--dg-font);
  font-weight:800;
  letter-spacing:-2px;
  dominant-baseline:auto;
}
.result-gauge-unit{
  fill:#8b97a8;
  font-family:var(--font-head);
  font-size:14px;
  font-weight:800;
  letter-spacing:2px;
  text-transform:uppercase;
}
.result-gauge-needle{stroke:var(--ink);stroke-width:5;stroke-linecap:round;vector-effect:non-scaling-stroke}
.result-gauge-pivot{fill:var(--ink)}
.result-summary{
  width:min(290px,100%) !important;
  margin:3px auto 0 !important;
  align-self:center;
  text-align:center;
}

/* Homepage preview uses the same unified SVG geometry. */
.gauge-wrap{display:flex;flex-direction:column;align-items:center;text-align:center}
.gauge{
  width:160px;
  aspect-ratio:360/220;
  height:auto !important;
  overflow:visible !important;
  position:relative;
  margin:3px auto 5px;
  background:none !important;
}
.gauge:before,.gauge:after,.gauge-center,.gauge-needle{display:none !important;content:none !important}
.gauge-svg{display:block;width:100%;height:100%;overflow:visible}
.gauge-track,.gauge-accent{fill:none;stroke-width:22;stroke-linecap:butt;vector-effect:non-scaling-stroke}
.gauge-track{stroke:#8fc1fb}
.gauge-accent{stroke:var(--blue)}
.gauge-number{fill:var(--ink);font-family:var(--font-head);font-size:58px;font-weight:800;letter-spacing:-2px}
.gauge-unit{fill:#8b97a8;font-family:var(--font-head);font-size:14px;font-weight:800;letter-spacing:2px}
.gauge-needle-line{stroke:var(--ink);stroke-width:5;stroke-linecap:round;vector-effect:non-scaling-stroke}
.gauge-pivot{fill:var(--ink)}

@media(max-width:720px){
  .result-primary{padding:14px 0 20px}
  .result-gauge--sm{--dg-width:175px;--dg-font:58px}
  .result-gauge--md{--dg-width:205px;--dg-font:46px}
  .result-gauge--lg{--dg-width:235px;--dg-font:40px}
  .result-gauge--xl{--dg-width:270px;--dg-font:31px}
  .result-summary{width:min(280px,100%) !important;margin-top:2px !important}
}
@media(max-width:420px){
  .result-gauge--sm{--dg-width:170px}
  .result-gauge--md{--dg-width:195px}
  .result-gauge--lg{--dg-width:225px}
  .result-gauge--xl{--dg-width:255px}
}

/* ==========================================================
   DIYGauge v1.8 — Signature Brand Theme
   Electric blue + deep ink + warm stone + restrained amber.
   Visual-only. v1.7 calculator logic and unified SVG gauge remain intact.
   ========================================================== */
:root{
  --ink:#0c1628;
  --ink-2:#142035;
  --text:#243146;
  --muted:#6f746f;
  --line:#ddd8cd;
  --surface:#ffffff;
  --bg:#f4f1ea;
  --stone:#f4f1ea;
  --stone-2:#ece7dd;
  --stone-3:#fbfaf7;
  --blue:#2463eb;
  --blue-2:#174fc9;
  --amber:#d79a35;
  --amber-soft:#fff3dc;
  --green:#1f9d68;
  --shadow:0 18px 58px rgba(12,22,40,.085);
}
body{background:var(--stone);color:var(--text)}

/* Brand chrome */
.site-header{
  background:rgba(255,253,248,.94);
  border-bottom-color:rgba(211,204,191,.9);
  box-shadow:0 1px 0 rgba(12,22,40,.025);
}
.site-header:after{
  content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;
  background:linear-gradient(90deg,var(--blue) 0 78%,var(--amber) 78% 84%,transparent 84% 100%);
  opacity:.58;pointer-events:none;
}
.brand-needle{background:var(--amber)}
.nav-link:hover{background:#f0ece4;color:var(--ink)}
.header-search-btn,.unit-pill{background:#fffdf9;border-color:#dcd6cb}
.header-search-btn:hover,.unit-pill:hover{border-color:#cfc5b7}
.mega-menu{background:#fffdf9;border-bottom-color:#dcd6cb}
.mega-item:hover{background:#f2eee6}
.mega-icon,.search-result-icon{background:#edf3ff;color:var(--blue)}
.drawer-panel{background:#fffdf9}

/* Buttons and small brand details */
.btn-primary,.btn-calculate{background:var(--blue)}
.btn-primary:hover,.btn-calculate:hover{background:var(--blue-2)}
.btn-ghost{background:#fffdf9;border-color:#d8d1c6}
.btn-ghost:hover{background:#f1ede5;border-color:#cfc5b7}
.kicker{color:var(--blue);position:relative}
.kicker:after{content:"";display:inline-block;width:18px;height:2px;background:var(--amber);border-radius:99px;margin-left:8px;vertical-align:middle;opacity:.9}
.kicker-light:after{background:#f2c775}
.text-link{color:var(--blue)}

/* Homepage hero — warmer and more ownable than a generic SaaS white/blue hero */
.hero-section{
  background:
    radial-gradient(circle at 82% 28%,rgba(36,99,235,.105),transparent 31%),
    radial-gradient(circle at 13% 12%,rgba(215,154,53,.09),transparent 24%),
    linear-gradient(180deg,#fbfaf7 0%,#f1ece3 100%);
  border-bottom-color:#dcd6cb;
}
.eyebrow-pill{background:#fffaf1;border-color:#e4d8c5;color:#48556a;box-shadow:0 4px 18px rgba(87,72,47,.035)}
.eyebrow-pill span{background:var(--amber);box-shadow:0 0 0 4px rgba(215,154,53,.14)}
.hero-search{border-color:#d8d2c7;background:#fff;box-shadow:0 10px 30px rgba(45,39,28,.055)}
.hero-search:hover{border-color:#c6bba9;box-shadow:0 15px 38px rgba(45,39,28,.085)}
.hero-search kbd{background:#f5f1e9;border-color:#ddd6c9}
.blueprint-grid{
  background-image:linear-gradient(rgba(36,99,235,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(36,99,235,.05) 1px,transparent 1px);
  opacity:.86;
}
.preview-card{background:#fffdf9;border-color:#dcd6cb;box-shadow:0 32px 72px rgba(36,31,24,.15)}
.preview-inputs span{background:#faf7f1;border-color:#e4ddd2}
.preview-stats div{background:#f5f2ec}
.preview-badge{border-color:#ded7cc;background:#fff}
.floating-chip{border-color:#dfd6c9;background:#fffdf8}
.chip-one{background:var(--amber-soft);border-color:#efd4a5;color:#7c5722}
.chip-two{background:#eef9f3;border-color:#cfeedd;color:#16734e}

/* Homepage sections */
.category-section{background:var(--stone)}
.popular-section{background:#edf0f2}
.how-section{background:#fbfaf7}
.category-card,.tool-card{
  border-color:#dcd6cb;
  box-shadow:0 2px 0 rgba(12,22,40,.015);
}
.category-card{position:relative;overflow:hidden}
.category-card:before{
  content:"";position:absolute;left:0;top:18px;bottom:18px;width:3px;border-radius:0 4px 4px 0;
  background:linear-gradient(180deg,var(--blue),var(--amber));opacity:.72;
}
.category-card:hover,.tool-card:hover{border-color:#b9c8e4;box-shadow:0 17px 38px rgba(12,22,40,.09)}
.category-icon,.tool-card-icon,.support-icon,.project-empty-icon,.saved-project-icon{
  background:linear-gradient(135deg,#edf3ff 0 72%,#fff1d6 72% 100%);
  color:var(--blue);
  box-shadow:inset 0 0 0 1px rgba(36,99,235,.035);
}
.tool-card{overflow:hidden}
.tool-card:before{
  content:"";position:absolute;left:18px;top:0;width:36px;height:3px;border-radius:0 0 4px 4px;background:var(--amber);opacity:.72;
}
.tool-card:hover:before{width:62px;background:var(--blue);transition:.18s ease}
.project-promo{background:linear-gradient(135deg,#0c1628,#111f37);box-shadow:0 26px 70px rgba(12,22,40,.15)}
.project-promo:before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:linear-gradient(var(--blue),var(--amber))}
.project-preview{background:#fffdf9}
.steps-grid>div:before{background:linear-gradient(90deg,var(--blue) 0 72%,var(--amber) 72% 100%)}

/* All Tools and category pages */
.page-hero{
  position:relative;overflow:hidden;
  background:
    radial-gradient(circle at 82% 20%,rgba(36,99,235,.085),transparent 27%),
    radial-gradient(circle at 10% 0%,rgba(215,154,53,.075),transparent 23%),
    linear-gradient(180deg,#fbfaf7 0%,#f2eee6 100%);
  border-bottom-color:#d7d1c7;
}
.page-hero:after{
  content:"";position:absolute;right:-30px;top:-55px;width:370px;height:260px;opacity:.34;pointer-events:none;
  background-image:linear-gradient(rgba(36,99,235,.13) 1px,transparent 1px),linear-gradient(90deg,rgba(36,99,235,.13) 1px,transparent 1px);
  background-size:28px 28px;mask-image:linear-gradient(120deg,transparent 3%,#000 54%,transparent 96%);
}
.page-hero .container{position:relative;z-index:1}
.page-hero.compact{padding:58px 0 62px}
.page-hero h1{color:var(--ink)}
.directory-search{background:#fffdf9;border-color:#d4cdbf;box-shadow:0 12px 30px rgba(65,54,35,.06)}
.directory-search:focus-within{border-color:#9db8ef;box-shadow:0 0 0 4px rgba(36,99,235,.07),0 12px 30px rgba(65,54,35,.055)}
.directory-section{background:var(--stone-2);padding-top:58px}
.filter-chips{
  position:sticky;top:86px;z-index:24;
  padding:11px 0 12px;margin-bottom:24px;
  background:rgba(236,231,221,.92);backdrop-filter:blur(15px);
  border-bottom:1px solid rgba(205,197,183,.7);
}
.filter-chips button{background:#fffdf9;border-color:#d5cfc4;color:#5f6671;transition:.16s ease}
.filter-chips button:hover{background:#fff7e9;color:var(--ink);border-color:#e2bd78}
.filter-chips button.active{background:var(--ink);color:#fff;border-color:var(--ink);box-shadow:inset 0 -3px 0 var(--amber),0 6px 16px rgba(12,22,40,.12)}
.directory-group{
  position:relative;background:#fff;border-color:#d7d0c5;border-radius:20px;
  box-shadow:0 9px 24px rgba(54,46,33,.045);
}
.directory-group:before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--blue) 0 82%,var(--amber) 82% 100%);z-index:2}
.directory-heading{background:#fffdf9;border-bottom-color:#e0dbd2;padding-top:23px}
.directory-heading h2{color:var(--ink)}
.directory-heading p{color:#76756f}
.directory-list a{border-bottom-color:#eeeae3}
.directory-list a:nth-child(odd){border-right-color:#eeeae3}
.directory-list a:hover{background:#f9f7f2}
.directory-list span{color:#243146}
.directory-list small{color:#8a8983}
.directory-list a:hover .icon{color:var(--amber)}
.category-hero{padding:66px 0 70px;text-align:center}
.category-hero-icon{
  background:linear-gradient(145deg,#fff,#f4efe6);border:1px solid #d8d0c3;color:var(--blue);
  box-shadow:0 14px 34px rgba(62,50,31,.075);position:relative;
}
.category-hero-icon:after{content:"";position:absolute;width:22px;height:3px;border-radius:9px;background:var(--amber);bottom:-10px}
.hero-meta span{background:#fffdf9;border-color:#d9d2c6;color:#646a73}
.category-hero + .section{background:var(--stone);padding-top:60px}
.category-tools .tool-card.large{background:#fff;border-color:#d9d2c6;min-height:170px}

/* Calculator pages inherit the signature palette without disturbing the v1.7 gauge geometry */
.calculator-page{
  background:
    radial-gradient(circle at 88% 5%,rgba(36,99,235,.045),transparent 24%),
    linear-gradient(180deg,#f5f2eb,#efebe3);
}
.calculator-shell{border-color:#d8d1c6;box-shadow:0 20px 58px rgba(47,39,28,.075)}
.calculator-input-panel{background:#fff}
.calculator-result-panel{background:linear-gradient(180deg,#fffdf9 0%,#f8f5ef 100%)}
.panel-step{background:#edf3ff}
.panel-step.accent{background:var(--ink)}
.input-unit,.field>select{border-color:#d8d2c8;background:#fff}
.input-unit select,.unit-label,.money-prefix{background:#f7f4ee;border-color:#e5dfd5}
.input-unit:focus-within,.field>select:focus{border-color:#8eaded;box-shadow:0 0 0 4px rgba(36,99,235,.07)}
.result-card,.result-summary,.support-card{border-color:#ddd7cc;background:#fff}
.result-visual{background:linear-gradient(180deg,#f7f8f7,#f2f0ea);border-color:#d9d5cc}
.plan-box{border-color:#83aaf4}
.result-assumption{background:#fff5df;border-color:#edcf96;color:#79531f}
.calculator-info{border-top-color:#d8d2c8}
/* Keep the fixed v1.7 gauge dimensions; only harmonize its palette. */
.result-gauge-track,.gauge-track{stroke:#8bbcf7}
.result-gauge-accent,.gauge-accent{stroke:var(--blue)}

/* Project/static surfaces */
.project-toolbar,.project-empty,.saved-project-item,.content-placeholder{background:#fffdf9;border-color:#d9d2c6}
.project-summary-box{background:linear-gradient(135deg,var(--ink),#16233a);box-shadow:inset 0 3px 0 rgba(215,154,53,.75)}

/* Footer: dark ink, branded construction accent */
.site-footer{position:relative;background:#08111f;padding-top:66px}
.site-footer:before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,var(--blue) 0 82%,var(--amber) 82% 100%)}
.site-footer h4{color:#fff6e7}
.site-footer>div>div:not(.footer-brand) a{color:#929cad}
.site-footer>div>div:not(.footer-brand) a:hover{color:#fff4dc}
.footer-bottom{border-top-color:rgba(255,255,255,.1)}

/* Mobile polish */
@media(max-width:720px){
  .site-header:after{height:1px}
  .hero-section{padding-top:44px}
  .page-hero,.page-hero.compact{padding:43px 0 47px}
  .page-hero:after{width:240px;height:190px;right:-90px;top:-50px;opacity:.24}
  .category-hero{padding:48px 0 52px}
  .directory-section{padding-top:42px}
  .filter-chips{top:64px;margin-left:-2px;margin-right:-2px;padding:10px 0 11px;scrollbar-width:none}
  .filter-chips::-webkit-scrollbar{display:none}
  .category-card:before{top:13px;bottom:13px}
  .tool-card:before{left:16px}
  .mobile-bottom-nav{background:rgba(255,253,248,.96);border-top-color:#d7d0c5}
}

/* =========================================================
   DIYGauge v1.8.1 — Header Precision Polish
   Presentation only. No calculator or search logic changes.
   ========================================================= */

/* Give the utility controls the same visual weight as the nav. */
.header-actions{
  gap:10px;
}

.header-search-btn{
  min-width:140px;
  height:44px;
  padding:0 11px 0 13px;
  justify-content:flex-start;
  border-radius:14px;
  border-color:#d6cec1;
  background:linear-gradient(180deg,#fffefa 0%,#faf7f1 100%);
  box-shadow:0 2px 7px rgba(12,22,40,.035),0 1px 0 rgba(255,255,255,.75) inset;
  transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease,background .16s ease;
}
.header-search-btn .icon{
  width:18px;
  height:18px;
  color:#33445d;
  flex:none;
}
.header-search-btn span{
  font-size:13px;
  font-weight:700;
  color:#46556b;
  letter-spacing:-.05px;
}
.header-search-btn kbd{
  margin-left:auto;
  min-width:23px;
  height:22px;
  padding:0 6px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-color:#dcd4c8;
  background:#f2eee6;
  color:#7d8795;
  border-radius:7px;
}
.header-search-btn:hover{
  border-color:#abc0e6;
  background:#fff;
  box-shadow:0 7px 20px rgba(25,48,88,.085);
  transform:translateY(-1px);
}
.header-search-btn:focus-visible{
  outline:0;
  border-color:#7fa5ec;
  box-shadow:0 0 0 4px rgba(36,99,235,.09),0 7px 20px rgba(25,48,88,.07);
}

.unit-pill{
  height:44px;
  min-width:62px;
  padding:0 11px;
  border-radius:14px;
  border-color:#d6cec1;
  background:linear-gradient(180deg,#fffefa 0%,#faf7f1 100%);
  box-shadow:0 2px 7px rgba(12,22,40,.025);
  transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease,background .16s ease;
}
.unit-pill:hover,.unit-pill[aria-expanded="true"]{
  border-color:#abc0e6;
  background:#fff;
  box-shadow:0 7px 20px rgba(25,48,88,.07);
  transform:translateY(-1px);
}

/* More refined signature line: full-width, softly faded at both edges. */
.site-header:after{
  height:1px;
  bottom:-1px;
  opacity:.72;
  background:linear-gradient(90deg,
    transparent 0%,
    rgba(36,99,235,.16) 8%,
    rgba(36,99,235,.72) 24%,
    rgba(36,99,235,.72) 72%,
    rgba(215,154,53,.72) 83%,
    rgba(215,154,53,.20) 92%,
    transparent 100%);
}

/* Keep the compact icon treatment on tablet/mobile. */
@media(max-width:1020px){
  .header-search-btn{
    min-width:42px;
    width:42px;
    height:42px;
    padding:0;
    justify-content:center;
    border-radius:13px;
  }
  .header-search-btn span,.header-search-btn kbd{display:none}
  .unit-pill{height:42px;min-width:58px;border-radius:13px;padding:0 9px}
}

@media(max-width:720px){
  .header-actions{gap:7px}
  .header-search-btn{min-width:40px;width:40px;height:40px;border-radius:12px}
  .header-search-btn .icon{width:17px;height:17px}
  .unit-pill{height:40px;min-width:55px;border-radius:12px;padding:0 8px}
}

/* =========================================================
   DIYGauge v1.8.2 — Header + Hero Cleanup
   Strong visible refinement. No calculator logic changes.
   ========================================================= */

/* Desktop utility controls: clearly sized to match the visual weight of the nav. */
@media(min-width:1021px){
  .header-actions{gap:12px}
  .header-search-btn{
    width:184px;
    min-width:184px;
    height:46px;
    padding:0 12px 0 15px;
    border-radius:13px;
    justify-content:flex-start;
    background:#fff;
    border:1px solid #d8d1c6;
    box-shadow:0 3px 10px rgba(11,19,36,.045);
  }
  .header-search-btn .icon{width:18px;height:18px;margin-right:9px;color:#26364d}
  .header-search-btn span{
    display:inline !important;
    font-size:12.5px;
    font-weight:700;
    color:#34445a;
    white-space:nowrap;
  }
  .header-search-btn kbd{
    display:inline-flex !important;
    margin-left:auto;
    min-width:24px;
    height:22px;
    padding:0 6px;
    border-radius:7px;
    background:#f5f1e9;
    border:1px solid #ddd5c9;
    color:#89919d;
    font-size:10px;
  }
  .header-search-btn:hover{
    border-color:#93afe7;
    box-shadow:0 8px 22px rgba(36,99,235,.09);
    transform:translateY(-1px);
  }
  .unit-pill{
    height:46px;
    min-width:66px;
    border-radius:13px;
    padding:0 12px;
    background:#fff;
    border:1px solid #d8d1c6;
  }
}

/* The floating demo chips duplicate information already shown inside the card.
   Removing them gives the hero a cleaner, more premium silhouette. */
.hero-section .floating-chip{display:none !important}

/* Keep the preview card visually self-contained now that the outside chips are gone. */
.hero-section .preview-card{
  overflow:hidden;
  box-shadow:0 28px 72px rgba(26,35,50,.14),0 0 0 1px rgba(215,208,197,.14);
}

/* Small spacing correction between header utilities and page edge. */
@media(min-width:1021px){
  .header-inner{padding-right:2px}
}

/* ==========================================================
   DIYGauge v2.0 — Live Responsive SVG Project View
   Shared visual planning layer. Calculator formulas unchanged.
   ========================================================== */
.live-project-card{
  --pv-ink:#0b1220;--pv-blue:#2563eb;--pv-blue-soft:#8bb6ff;--pv-amber:#d9951a;--pv-line:#91a4bd;--pv-fill:#f8fbff;
  margin:0 0 20px;padding:14px 14px 11px;border:1px solid #d9d5cc;border-radius:16px;
  background:linear-gradient(145deg,#fff 0%,#fbfaf7 45%,#f4f7fb 100%);box-shadow:0 10px 26px rgba(31,41,55,.055);overflow:hidden
}
.live-project-card[hidden]{display:none!important}
.live-project-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:0 2px 10px}
.live-project-head>div{display:flex;flex-direction:column;gap:3px}
.live-project-head>div>span{font-size:7px;letter-spacing:1.25px;font-weight:900;color:var(--blue)}
.live-project-head strong{font:800 12px/1.2 var(--font-head);color:var(--ink)}
.live-project-status{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;padding:5px 8px;border:1px solid #d9eadf;background:#f3fbf5;color:#397451;border-radius:999px;font-size:7px;font-weight:800}
.live-project-status i{width:6px;height:6px;border-radius:50%;background:#22a35a;box-shadow:0 0 0 3px rgba(34,163,90,.1)}
.live-project-stage{position:relative;border:1px solid #e4e0d8;border-radius:13px;min-height:205px;background:
  linear-gradient(rgba(37,99,235,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(37,99,235,.035) 1px,transparent 1px),#fff;
  background-size:20px 20px;overflow:hidden}
.live-project-stage:after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 48px rgba(37,99,235,.035)}
.live-project-svg{display:block;width:100%;height:auto;max-height:250px;min-height:205px}
.live-project-caption{text-align:center;padding:8px 4px 0;font-size:8px;font-weight:700;color:#68778c}

/* SVG drafting language */
.live-project-svg .pv-arrow{fill:#71839c}
.live-project-svg .pv-grid-line{stroke:#dae5f3;stroke-width:.75}
.live-project-svg .pv-pattern-line{stroke:#cbd9ec;stroke-width:1}
.live-project-svg .pv-shape{stroke:#4f80df;stroke-width:2}
.live-project-svg .pv-line,.live-project-svg .pv-edge{stroke:#547294;stroke-width:1.5;fill:none}
.live-project-svg .pv-strong-line{stroke:#14233a;stroke-width:4;stroke-linecap:round}
.live-project-svg .pv-secondary-line{stroke:#66809f;stroke-width:2.2;stroke-linecap:round}
.live-project-svg .pv-dimension{stroke:#7d8da3;stroke-width:1;fill:none}
.live-project-svg .pv-tick{stroke:#7d8da3;stroke-width:1}
.live-project-svg .pv-label,.live-project-svg .pv-dim-label,.live-project-svg .pv-note{font-family:var(--font-body);fill:#5f7086}
.live-project-svg .pv-dim-label{font-size:12px;font-weight:800;fill:#34465f}
.live-project-svg .pv-note{font-size:11px;font-weight:700}
.live-project-svg .pv-area-label{font:800 13px var(--font-head);fill:#21324a;letter-spacing:.2px}
.live-project-svg .pv-area-number{font:800 30px var(--font-head);fill:#0b1220}
.live-project-svg .pv-area-unit{font:800 10px var(--font-body);fill:#7a899d;letter-spacing:1px;text-transform:uppercase}
.live-project-svg .pv-main-tee{stroke:#d9951a;stroke-width:2.2;opacity:.9}
.live-project-svg .pv-top-face{fill:#eaf2ff;stroke:#4f80df;stroke-width:2}
.live-project-svg .pv-front-face{fill:#d9e6fa;stroke:#4f80df;stroke-width:2}
.live-project-svg .pv-side-face{fill:#c9dbf5;stroke:#4f80df;stroke-width:2}
.live-project-svg .pv-floor{fill:#f7fbff;stroke:#4f80df;stroke-width:2}
.live-project-svg .pv-wall{stroke:#6d8fbf;stroke-width:1.8}
.live-project-svg .pv-wall-back{fill:#edf4ff}.live-project-svg .pv-wall-side{fill:#e1ebfa}
.live-project-svg .pv-opening{fill:#fff;stroke:#d9951a;stroke-width:1.8}.live-project-svg .pv-door{fill:#fffaf0}
.live-project-svg .pv-post{fill:#38547a}.live-project-svg .pv-marker{fill:#fff;stroke:#244976;stroke-width:3}
.live-project-svg .pv-roof{fill:#e9f1ff;stroke:#315fba;stroke-width:2.5}.live-project-svg .pv-ridge{stroke:#d9951a;stroke-width:3}
.live-project-svg .pv-triangle{fill:#eef4ff;stroke:#315fba;stroke-width:2.5}
.live-project-svg .pv-cylinder-top{fill:#edf4ff;stroke:#3f70ce;stroke-width:2}.live-project-svg .pv-cylinder-body{fill:#dce9fb;stroke:#3f70ce;stroke-width:2}.live-project-svg .pv-cylinder-bottom{fill:#cedff7;stroke:#3f70ce;stroke-width:2}
.live-project-svg .pv-gate-frame{fill:#f8fbff;stroke:#294f82;stroke-width:3}.live-project-svg .pv-gate-diag{stroke:#d9951a;stroke-width:2.4}
.live-project-svg .pv-stairs{stroke:#224d88;stroke-width:4;stroke-linejoin:round;stroke-linecap:round}
.live-project-svg .pv-pool{fill:#dff4ff;stroke:#2085cf;stroke-width:3}
.live-project-svg .pv-counter{fill:#f2eadc;stroke:#b77822;stroke-width:2.5}.live-project-svg .pv-island{fill:#fff8e8;stroke:#d9951a;stroke-width:2}
.live-project-svg .pv-pergola-frame{fill:#fffaf0;stroke:#7d5b2c;stroke-width:3}.live-project-svg .pv-pergola-slat{stroke:#bd7f2d;stroke-width:2}.live-project-svg .pv-pergola-post{fill:#62441e;stroke:#fff;stroke-width:1}
.live-project-svg .pv-wood-top{fill:#f6e8cf;stroke:#9a6b2e;stroke-width:2}.live-project-svg .pv-wood-face{fill:#e9d4af;stroke:#9a6b2e;stroke-width:2}
.live-project-svg .pv-tank{fill:#f8fbff;stroke:#4773b8;stroke-width:3}.live-project-svg .pv-water{fill:#bfe8ff;stroke:#2085cf;stroke-width:1.5}

/* Once the live SVG is present, the old static mini project visual is not needed. */
.calculator-result-panel .result-visual{display:none!important}

@media(max-width:720px){
  .live-project-card{margin-bottom:16px;padding:11px 10px 9px;border-radius:14px}
  .live-project-head{gap:8px}.live-project-status{font-size:6.5px;padding:4px 7px}
  .live-project-stage{min-height:180px}.live-project-svg{min-height:180px;max-height:220px}
}

/* ==========================================================
   DIYGauge v2.1 — Live Project View Visual Polish
   Presentation only. Calculator logic unchanged.
   ========================================================== */

/* Keep both calculator steps visually consistent. */
.panel-step,
.panel-step.accent{
  width:30px;height:30px;border-radius:10px;
  display:grid;place-items:center;
  background:linear-gradient(145deg,#2d6af0 0%,#2457d6 100%);
  color:#fff;
  border:1px solid rgba(28,75,182,.28);
  box-shadow:0 5px 14px rgba(37,99,235,.18),inset 0 1px 0 rgba(255,255,255,.24);
  font:800 12px/1 var(--font-head);
}

/* Premium drafting card */
.live-project-card{
  position:relative;
  margin:2px 0 22px;
  padding:16px 16px 13px;
  border:1px solid #d7deea;
  border-radius:18px;
  background:linear-gradient(145deg,#ffffff 0%,#fbfcff 58%,#f6f8fc 100%);
  box-shadow:0 14px 34px rgba(23,37,61,.075),0 1px 0 rgba(255,255,255,.9) inset;
}
.live-project-card:before{
  content:"";
  position:absolute;left:18px;right:18px;top:0;height:3px;
  border-radius:0 0 8px 8px;
  background:linear-gradient(90deg,var(--blue) 0 78%,var(--amber) 78% 100%);
  opacity:.92;
}
.live-project-head{padding:4px 3px 13px;gap:16px}
.live-project-head>div{gap:4px}
.live-project-head>div>span{
  font-size:7.5px;letter-spacing:1.45px;font-weight:900;color:#2863dc;
}
.live-project-head strong{
  font:800 14px/1.2 var(--font-head);letter-spacing:-.15px;color:#101828;
}
.live-project-status{
  padding:6px 9px;
  border:1px solid #d2e9d9;
  background:linear-gradient(180deg,#f7fdf8,#eef9f1);
  color:#2c7048;
  box-shadow:0 2px 7px rgba(32,130,72,.05);
  font-size:7.2px;
}
.live-project-status i{width:6px;height:6px;background:#20a85d;box-shadow:0 0 0 3px rgba(32,168,93,.11)}

.live-project-stage{
  min-height:230px;
  border:1px solid #d6dfeb;
  border-radius:15px;
  background-color:#fbfdff;
  background-image:
    linear-gradient(rgba(37,99,235,.065) 1px,transparent 1px),
    linear-gradient(90deg,rgba(37,99,235,.065) 1px,transparent 1px),
    linear-gradient(rgba(37,99,235,.025) 1px,transparent 1px),
    linear-gradient(90deg,rgba(37,99,235,.025) 1px,transparent 1px),
    linear-gradient(180deg,#ffffff 0%,#f8fbff 100%);
  background-size:100px 100px,100px 100px,20px 20px,20px 20px,100% 100%;
  box-shadow:inset 0 1px 0 #fff,inset 0 0 55px rgba(51,102,204,.035),0 6px 16px rgba(28,52,86,.045);
  overflow:hidden;
}
.live-project-stage:before,
.live-project-stage:after{
  content:"";position:absolute;width:20px;height:20px;pointer-events:none;z-index:2;opacity:.55;
}
.live-project-stage:before{left:10px;top:10px;border-left:2px solid #6f98e7;border-top:2px solid #6f98e7;border-radius:4px 0 0 0}
.live-project-stage:after{right:10px;bottom:10px;border-right:2px solid #d99a2f;border-bottom:2px solid #d99a2f;border-radius:0 0 4px 0;box-shadow:none}
.live-project-svg{min-height:230px;max-height:270px;filter:drop-shadow(0 2px 1px rgba(26,48,82,.025))}

/* Stronger, cleaner drafting language */
.live-project-svg .pv-grid-line{stroke:#dbe5f3;stroke-width:.72}
.live-project-svg .pv-pattern-line{stroke:#c8d7eb;stroke-width:1.05}
.live-project-svg .pv-shape,
.live-project-svg .pv-floor,
.live-project-svg .pv-roof,
.live-project-svg .pv-triangle,
.live-project-svg .pv-gate-frame,
.live-project-svg .pv-pool,
.live-project-svg .pv-counter,
.live-project-svg .pv-island,
.live-project-svg .pv-pergola-frame,
.live-project-svg .pv-tank{
  filter:drop-shadow(0 6px 7px rgba(34,69,123,.08));
}
.live-project-svg .pv-shape{stroke:#3974df;stroke-width:2.25}
.live-project-svg .pv-dimension{stroke:#6f819b;stroke-width:1.2}
.live-project-svg .pv-tick{stroke:#70839d;stroke-width:1.15}
.live-project-svg .pv-arrow{fill:#687b96}
.live-project-svg .pv-line,.live-project-svg .pv-edge{stroke:#4f698d;stroke-width:1.65}
.live-project-svg .pv-main-tee{stroke:#d58f18;stroke-width:2.35}

/* Give SVG labels a subtle white halo so they stay readable on every grid/shape. */
.live-project-svg .pv-label,
.live-project-svg .pv-dim-label,
.live-project-svg .pv-note,
.live-project-svg .pv-area-label{
  paint-order:stroke fill;
  stroke:rgba(255,255,255,.96);
  stroke-width:4px;
  stroke-linejoin:round;
}
.live-project-svg .pv-dim-label{font-size:12.5px;font-weight:850;fill:#263c5c}
.live-project-svg .pv-note{font-size:11px;font-weight:750;fill:#506680}
.live-project-svg .pv-area-label{font:850 14px var(--font-head);fill:#14233a;letter-spacing:.1px}
.live-project-svg .pv-area-number{font-weight:850;fill:#0b1220}

.live-project-caption{
  width:max-content;max-width:100%;margin:9px auto 0;padding:5px 10px;
  border:1px solid #e1e6ee;border-radius:999px;background:#fff;
  color:#607087;font-size:7.8px;font-weight:750;letter-spacing:.05px;
  box-shadow:0 2px 8px rgba(27,45,72,.035);
}

@media(max-width:720px){
  .panel-step,.panel-step.accent{width:29px;height:29px;border-radius:9px}
  .live-project-card{padding:13px 11px 11px;border-radius:16px}
  .live-project-card:before{left:14px;right:14px}
  .live-project-head{padding:3px 2px 11px;align-items:flex-start}
  .live-project-head strong{font-size:13px}
  .live-project-status{padding:5px 7px;font-size:6.5px}
  .live-project-stage{min-height:200px;border-radius:13px;background-size:80px 80px,80px 80px,16px 16px,16px 16px,100% 100%}
  .live-project-svg{min-height:200px;max-height:235px}
  .live-project-caption{font-size:7.2px;margin-top:7px}
}

/* =========================================================
   DIYGauge v2.2 — SEO content + trust system
   ========================================================= */
.seo-guide{margin-top:72px;padding-top:54px;border-top:1px solid #d8d2c8}
.seo-guide-intro{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);gap:54px;align-items:start}
.seo-guide-intro h2{font:800 clamp(32px,3.5vw,48px)/1.08 var(--font-head);letter-spacing:-1.9px;color:var(--ink);margin:0 0 14px;max-width:760px}
.seo-guide-intro>div>p{font-size:14px;line-height:1.85;color:#566275;margin:0;max-width:820px}
.seo-method-badge{background:linear-gradient(145deg,#fffdf9,#f7f4ed);border:1px solid #ddd5c7;border-radius:18px;padding:20px;box-shadow:0 12px 30px rgba(37,42,52,.045)}
.seo-method-badge strong{display:block;font:800 14px var(--font-head);color:var(--ink);margin-bottom:6px}
.seo-method-badge span{display:block;font-size:10px;color:#7d7468;margin-bottom:14px}
.seo-method-badge a{font-size:10px;font-weight:800;color:var(--blue)}
.seo-jump-nav{margin:30px 0 26px;padding:12px 14px;border:1px solid #ded8cd;background:rgba(255,253,249,.88);border-radius:14px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;box-shadow:0 5px 18px rgba(31,38,48,.035)}
.seo-jump-nav span{font-size:9px;font-weight:900;color:#8a8174;letter-spacing:.5px;text-transform:uppercase;margin-right:4px}
.seo-jump-nav a{font-size:10px;font-weight:750;color:#39475a;padding:7px 10px;border-radius:9px;background:#fff;border:1px solid #e7e2d9;transition:.16s}
.seo-jump-nav a:hover{color:var(--blue);border-color:#b9c9e8;transform:translateY(-1px)}
.seo-fact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:18px}
.seo-fact{background:#fff;border:1px solid #dedfe2;border-radius:16px;padding:17px 18px;position:relative;overflow:hidden}
.seo-fact:before{content:"";position:absolute;top:0;left:0;width:58px;height:3px;background:linear-gradient(90deg,var(--blue),var(--amber));border-radius:0 0 6px 0}
.seo-fact span{display:block;font-size:8px;font-weight:900;letter-spacing:1.05px;color:#7f8793;text-transform:uppercase;margin-bottom:8px}
.seo-fact p{margin:0;color:#4f5d70;font-size:11px;line-height:1.65}
.seo-content-block{margin-top:18px;background:#fff;border:1px solid #dedfe2;border-radius:20px;padding:28px 30px;box-shadow:0 9px 30px rgba(22,34,52,.035);scroll-margin-top:100px}
.seo-block-heading{display:flex;align-items:flex-start;gap:14px;margin-bottom:22px}
.seo-block-heading>span{width:31px;height:31px;border-radius:9px;background:#0d1728;color:#fff;display:grid;place-items:center;font:800 10px var(--font-head);flex:none;box-shadow:0 5px 12px rgba(11,18,32,.12)}
.seo-block-heading small{display:block;font-size:7.5px;color:var(--blue);font-weight:900;letter-spacing:1.15px;margin:2px 0 5px}
.seo-block-heading h3{font:800 21px/1.2 var(--font-head);letter-spacing:-.55px;color:var(--ink);margin:0}
.seo-steps{counter-reset:seoStep;display:grid;grid-template-columns:1fr 1fr;gap:10px 24px;margin:0;padding:0;list-style:none}
.seo-steps li{counter-increment:seoStep;position:relative;padding:14px 14px 14px 42px;border-bottom:1px solid #eef0f3;color:#526072;font-size:11.5px;line-height:1.68}
.seo-steps li:before{content:counter(seoStep);position:absolute;left:7px;top:13px;width:23px;height:23px;border-radius:50%;background:#edf3ff;color:var(--blue);display:grid;place-items:center;font-size:8px;font-weight:900}
.formula-stack{display:grid;gap:8px}
.formula-line{background:linear-gradient(90deg,#f6f8fc,#fbfcff);border:1px solid #dce3ef;border-left:3px solid var(--blue);border-radius:10px;padding:12px 14px;color:#26364f;font:700 11px/1.55 var(--font-body)}
.formula-stack .formula-line:nth-child(even){border-left-color:var(--amber)}
.seo-method-note{margin:15px 0 0;color:#7b8492;font-size:10px;line-height:1.7}
.example-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:16px}
.example-inputs{margin:0;border:1px solid #e2e4e7;border-radius:14px;overflow:hidden;background:#fcfcfd}
.example-inputs>div{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:10px 13px;border-bottom:1px solid #eceef1}
.example-inputs>div:last-child{border-bottom:0}.example-inputs dt{font-size:9px;color:#7b8491}.example-inputs dd{font-size:10.5px;font-weight:800;color:#172033;margin:0;text-align:right}
.example-result{border:1px solid #cfdcf2;background:linear-gradient(145deg,#f7faff,#edf4ff);border-radius:14px;padding:18px 19px;display:flex;flex-direction:column;justify-content:center}
.example-result span{font-size:7.5px;font-weight:900;color:var(--blue);letter-spacing:1.1px;margin-bottom:8px}
.example-result p{margin:0;color:#34445d;font-size:11.5px;line-height:1.75}
.seo-tip-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.seo-tip{border:1px solid #e4e1d9;border-radius:14px;background:#fffdf9;padding:16px;display:flex;gap:10px;align-items:flex-start}
.seo-tip>span{width:22px;height:22px;border-radius:50%;background:#edf9f2;color:#178c50;display:grid;place-items:center;font-size:9px;font-weight:900;flex:none}
.seo-tip p{margin:0;color:#596575;font-size:10.5px;line-height:1.65}
.faq-list{border-top:1px solid #e8e9ec}
.faq-list details{border-bottom:1px solid #e8e9ec}
.faq-list summary{list-style:none;cursor:pointer;padding:16px 2px;display:flex;align-items:center;justify-content:space-between;gap:18px;color:#192437;font:750 12px/1.4 var(--font-head)}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary span{width:24px;height:24px;border-radius:8px;background:#f2f5fa;color:#54647a;display:grid;place-items:center;font:700 15px var(--font-body);transition:.15s;flex:none}
.faq-list details[open] summary span{transform:rotate(45deg);background:#edf3ff;color:var(--blue)}
.faq-list details p{margin:-2px 42px 16px 2px;color:#637083;font-size:11px;line-height:1.75;max-width:850px}
.seo-curated-links{margin-top:18px;background:#0d1728;border-radius:20px;padding:26px 28px;color:#fff;display:grid;grid-template-columns:.7fr 1.3fr;gap:28px;align-items:start;position:relative;overflow:hidden}
.seo-curated-links:after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;border:1px solid rgba(255,255,255,.05);right:-100px;top:-130px;box-shadow:0 0 0 45px rgba(255,255,255,.015)}
.seo-curated-links h3{font:800 21px/1.25 var(--font-head);margin:0;color:#fff;max-width:280px}.seo-curated-links .kicker{color:#90b7ff}
.seo-curated-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;position:relative;z-index:2}
.seo-curated-grid a{position:relative;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.09);border-radius:12px;padding:13px 36px 13px 13px;transition:.16s}
.seo-curated-grid a:hover{background:rgba(255,255,255,.09);border-color:rgba(117,160,246,.4);transform:translateY(-1px)}
.seo-curated-grid strong{display:block;color:#fff;font-size:10.5px;margin-bottom:4px}.seo-curated-grid span{display:block;color:#96a5b9;font-size:8.5px;line-height:1.5}.seo-curated-grid b{position:absolute;right:13px;top:14px;color:#80aaf8;font-size:13px}
.seo-safety-note{margin-top:18px;border:1px solid #ead8b8;background:linear-gradient(135deg,#fffaf0,#fffdf8);border-radius:16px;padding:18px 20px;display:flex;align-items:center;justify-content:space-between;gap:28px}
.seo-safety-note strong{display:block;font:800 12px var(--font-head);color:#2f2a22;margin-bottom:4px}.seo-safety-note p{margin:0;color:#756c5f;font-size:9.5px;line-height:1.6;max-width:760px}.seo-safety-note>a{font-size:9.5px;font-weight:800;color:#a76a08;white-space:nowrap}

/* Editorial / methodology / legal pages */
.editorial-page{padding:64px 0 100px;background:linear-gradient(180deg,#f8f5ef 0,#f7f8fb 45%,#fff 100%)}
.editorial-wrap{max-width:1060px}.editorial-wrap.narrow{max-width:900px}
.editorial-hero{padding:28px 0 42px;border-bottom:1px solid #ddd8cf;margin-bottom:36px}
.editorial-hero h1{font:800 clamp(42px,5vw,64px)/1.03 var(--font-head);letter-spacing:-2.8px;color:var(--ink);margin:4px 0 14px}.editorial-hero p{max-width:820px;color:#5f6a79;font-size:14px;line-height:1.85;margin:0}
.editorial-grid{display:grid;grid-template-columns:1fr 300px;gap:42px;align-items:start}.editorial-main{background:#fff;border:1px solid #e0e1e4;border-radius:20px;padding:30px 34px;box-shadow:0 12px 36px rgba(24,34,50,.04)}
.editorial-main section{padding:4px 0 26px;margin-bottom:24px;border-bottom:1px solid #eceef1}.editorial-main section:last-child{border-bottom:0;margin-bottom:0;padding-bottom:4px}.editorial-main h2{font:800 22px/1.25 var(--font-head);letter-spacing:-.55px;color:var(--ink);margin:0 0 10px}.editorial-main p{font-size:12px;line-height:1.8;color:#5b6879;margin:8px 0}
.editorial-side{display:grid;gap:14px;position:sticky;top:95px}.trust-card{background:#0e1829;color:#fff;border-radius:18px;padding:22px}.trust-card>span{font-size:7.5px;font-weight:900;color:#8db4ff;letter-spacing:1.2px}.trust-card h3{font:800 20px/1.2 var(--font-head);margin:8px 0 14px}.trust-card ul{padding:0;margin:0;list-style:none;display:grid;gap:9px}.trust-card li{font-size:10px;color:#aab7c9;padding-left:17px;position:relative}.trust-card li:before{content:"✓";position:absolute;left:0;color:#55d58d;font-weight:900}.trust-card.soft{background:#fffaf0;color:#44392b;border:1px solid #ead9b9}.trust-card.soft>span{color:#a36b12}.trust-card.soft p{font-size:10.5px;line-height:1.7;color:#756a5a;margin:9px 0 0}.legal-copy{max-width:100%}

@media(max-width:900px){
  .seo-guide-intro{grid-template-columns:1fr;gap:20px}.seo-method-badge{max-width:520px}.seo-fact-grid{grid-template-columns:1fr}.seo-steps{grid-template-columns:1fr}.example-grid{grid-template-columns:1fr}.seo-tip-grid{grid-template-columns:1fr}.seo-curated-links{grid-template-columns:1fr}.editorial-grid{grid-template-columns:1fr}.editorial-side{position:static;grid-template-columns:1fr 1fr}
}
@media(max-width:720px){
  .seo-guide{margin-top:48px;padding-top:36px}.seo-guide-intro h2{font-size:31px;letter-spacing:-1.3px}.seo-guide-intro>div>p{font-size:12px}.seo-jump-nav{overflow-x:auto;flex-wrap:nowrap}.seo-jump-nav span,.seo-jump-nav a{white-space:nowrap}.seo-content-block{padding:21px 17px;border-radius:17px}.seo-block-heading h3{font-size:18px}.seo-steps li{font-size:10.5px}.formula-line{font-size:10px}.seo-curated-links{padding:22px 18px}.seo-curated-grid{grid-template-columns:1fr}.seo-safety-note{display:block}.seo-safety-note>a{display:inline-block;margin-top:12px}.editorial-page{padding:38px 0 80px}.editorial-hero h1{font-size:42px;letter-spacing:-2px}.editorial-main{padding:22px 18px}.editorial-side{grid-template-columns:1fr}
}

/* =========================================================
   DIYGauge v2.3 — Guide Hub & Editorial Cluster
   ========================================================= */
.guides-page,.guide-article-page{background:linear-gradient(180deg,#f8f5ee 0,#f5f2eb 34%,#f7f8fa 100%)}
.guides-page{padding:66px 0 100px}.guides-hero{max-width:880px;margin:0 auto 42px;text-align:center}.guides-hero h1{font:800 clamp(42px,5.2vw,68px)/.98 var(--font-head);letter-spacing:-3px;color:var(--ink);margin:10px 0 16px}.guides-hero>p{max-width:760px;margin:0 auto;color:#596679;font-size:14px;line-height:1.8}.guides-hero-meta{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:20px}.guides-hero-meta span{border:1px solid #d9d2c6;background:rgba(255,253,249,.86);border-radius:999px;padding:7px 11px;color:#6d665b;font-size:9px;font-weight:800}
.guides-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.guide-card{background:#fff;border:1px solid #dedfe2;border-radius:20px;padding:24px;box-shadow:0 10px 32px rgba(22,34,52,.035);transition:.18s;position:relative;overflow:hidden}.guide-card:before{content:"";position:absolute;left:0;top:0;width:82px;height:3px;background:linear-gradient(90deg,var(--blue),var(--amber))}.guide-card:hover{transform:translateY(-3px);border-color:#bcc9df;box-shadow:0 16px 40px rgba(22,34,52,.07)}.guide-card-top{display:flex;justify-content:space-between;gap:14px;align-items:center;margin-bottom:12px}.guide-card-top span{font-size:8px;font-weight:900;letter-spacing:1px;color:var(--blue);text-transform:uppercase}.guide-card-top small{font-size:8px;color:#90897d}.guide-card h2{font:800 22px/1.2 var(--font-head);letter-spacing:-.7px;margin:0 0 10px}.guide-card h2 a{color:var(--ink)}.guide-card>p{color:#617084;font-size:11px;line-height:1.72;margin:0 0 22px}.guide-card-bottom{border-top:1px solid #eef0f3;padding-top:14px;display:flex;justify-content:space-between;align-items:center;gap:12px}.guide-calc-link{font-size:9px;font-weight:750;color:#657386}.guide-read-link{font-size:9px;font-weight:900;color:var(--blue);white-space:nowrap}.guides-principles{margin-top:28px;background:#0d1728;color:#fff;border-radius:24px;padding:34px;display:grid;grid-template-columns:.72fr 1.28fr;gap:40px;position:relative;overflow:hidden}.guides-principles:after{content:"";position:absolute;right:-140px;top:-170px;width:360px;height:360px;border:1px solid rgba(255,255,255,.05);border-radius:50%;box-shadow:0 0 0 55px rgba(255,255,255,.018)}.guides-principles h2{font:800 28px/1.15 var(--font-head);letter-spacing:-1px;margin:8px 0 0;color:#fff}.guides-principles .kicker{color:#9dbcf5}.guides-principle-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;position:relative;z-index:2}.guides-principle-grid>div{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.08);border-radius:15px;padding:18px}.guides-principle-grid strong{width:28px;height:28px;display:grid;place-items:center;border-radius:9px;background:#f0b24a;color:#1b160d;font-size:10px}.guides-principle-grid h3{font:800 12px var(--font-head);margin:14px 0 6px;color:#fff}.guides-principle-grid p{font-size:9px;line-height:1.65;color:#9eabba;margin:0}
.guide-article-page{padding:28px 0 100px}.guide-article-wrap>.breadcrumbs{margin-bottom:26px}.guide-article-hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:48px;align-items:end;padding:30px 0 38px;border-bottom:1px solid #ddd7cd}.guide-article-hero h1{font:800 clamp(44px,5.2vw,70px)/.98 var(--font-head);letter-spacing:-3.1px;margin:9px 0 16px;color:var(--ink);max-width:850px}.guide-article-hero>div>p{font-size:14px;line-height:1.82;color:#596679;max-width:820px;margin:0}.guide-byline{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}.guide-byline span{font-size:8.5px;font-weight:800;color:#746e64;background:#fffdf9;border:1px solid #ddd6ca;border-radius:999px;padding:6px 9px}.guide-tool-cta{background:#fff;border:1px solid #dcdfe4;border-radius:20px;padding:22px;box-shadow:0 14px 36px rgba(20,31,49,.055)}.guide-tool-cta>span,.guide-side-card>span,.guide-section-label{display:block;font-size:7.5px;font-weight:900;letter-spacing:1.1px;color:var(--blue);margin-bottom:7px}.guide-tool-cta h2{font:800 19px var(--font-head);margin:0 0 8px}.guide-tool-cta p{font-size:10px;line-height:1.6;color:#6a7686;margin:0 0 15px}.guide-tool-cta .btn{display:flex;justify-content:center;width:100%}
.guide-article-grid{display:grid;grid-template-columns:minmax(0,1fr) 286px;gap:28px;margin-top:28px;align-items:start}.guide-article-main{display:grid;gap:16px}.guide-takeaways,.guide-copy-section,.guide-example-box,.guide-two-col>div,.guide-disclaimer{background:#fff;border:1px solid #dedfe2;border-radius:20px;padding:26px 28px}.guide-takeaways>div{display:grid;gap:7px;margin-top:13px}.guide-takeaways p{display:flex;gap:10px;align-items:flex-start;margin:0;color:#526073;font-size:11.5px;line-height:1.65}.guide-takeaways b{width:22px;height:22px;border-radius:50%;background:#edf9f2;color:#178c50;display:grid;place-items:center;flex:none;font-size:8px}.guide-formula-box{background:#0d1728;color:#fff;border-radius:20px;padding:24px 28px;display:grid;gap:8px}.guide-formula-box>span{font-size:7.5px;font-weight:900;letter-spacing:1.1px;color:#9bbcf7;margin-bottom:4px}.guide-formula-box code{display:block;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.05);border-radius:10px;padding:11px 13px;color:#f4f7fb;font:700 10px/1.5 var(--font-body);white-space:normal}.guide-copy-section h2,.guide-example-box h2,.guide-two-col h2{font:800 24px/1.2 var(--font-head);letter-spacing:-.7px;color:var(--ink);margin:0 0 13px}.guide-copy-section p{font-size:12px;line-height:1.85;color:#596679;margin:0 0 13px}.guide-copy-section p:last-child{margin-bottom:0}.guide-example-box{background:linear-gradient(135deg,#fffdf8,#fff)}.guide-example-box dl{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:17px 0}.guide-example-box dl>div{border:1px solid #e4e1d9;border-radius:12px;padding:11px 13px;background:#fff}.guide-example-box dt{font-size:7.5px;font-weight:900;letter-spacing:.7px;text-transform:uppercase;color:#8a8174}.guide-example-box dd{font-size:11px;font-weight:800;color:var(--ink);margin:4px 0 0}.guide-example-box>p{font-size:11.5px;line-height:1.72;color:#5a6677;margin:0 0 12px}.guide-example-box>a{font-size:10px;font-weight:900;color:var(--blue)}.guide-two-col{display:grid;grid-template-columns:1fr 1fr;gap:16px}.guide-two-col ul{margin:14px 0 0;padding:0;list-style:none;display:grid;gap:9px}.guide-two-col li{position:relative;padding-left:20px;color:#5d6979;font-size:10.5px;line-height:1.55}.guide-mistakes li:before{content:"×";position:absolute;left:0;color:#b54d36;font-weight:900}.guide-checklist li:before{content:"✓";position:absolute;left:0;color:#178c50;font-weight:900}.guide-disclaimer{border-color:#ead8b8;background:#fffaf0}.guide-disclaimer strong{font:800 12px var(--font-head);color:#342d23}.guide-disclaimer p{font-size:9.5px;line-height:1.65;color:#756c5f;margin:5px 0 10px}.guide-disclaimer a{font-size:9px;font-weight:850;color:#a76a08}
.guide-article-side{position:sticky;top:92px;display:grid;gap:12px}.guide-side-card{background:#fff;border:1px solid #dedfe2;border-radius:16px;padding:18px}.guide-side-card h3{font:800 15px var(--font-head);margin:0 0 7px}.guide-side-card>p{font-size:9.5px;line-height:1.6;color:#6b7686;margin:0 0 10px}.guide-side-card>a:not(.guide-side-link){font-size:9px;font-weight:850;color:var(--blue)}.guide-side-link{display:block;border-top:1px solid #edf0f3;padding:11px 0}.guide-side-link:first-of-type{margin-top:8px}.guide-side-link strong{display:block;font-size:9.5px;color:var(--ink);margin-bottom:3px}.guide-side-link small{display:block;font-size:7.8px;line-height:1.45;color:#8a95a4}.more-guides{margin-top:34px}.more-guides .section-head{align-items:end}.more-guides .section-head>a{font-size:9px;font-weight:850;color:var(--blue)}.more-guides-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.more-guides-grid>a{background:#fff;border:1px solid #dedfe2;border-radius:16px;padding:18px;transition:.16s}.more-guides-grid>a:hover{transform:translateY(-2px);border-color:#c5d1e5}.more-guides-grid small{display:block;font-size:7.5px;font-weight:900;letter-spacing:.85px;color:var(--blue);text-transform:uppercase;margin-bottom:6px}.more-guides-grid strong{display:block;font:800 13px/1.25 var(--font-head);color:var(--ink);margin-bottom:6px}.more-guides-grid span{font-size:8.5px;line-height:1.5;color:#7a8696}.seo-featured-guide{margin-top:18px;background:linear-gradient(135deg,#f2f6ff,#fffaf0);border:1px solid #d8dfeb;border-radius:18px;padding:21px 23px;display:flex;justify-content:space-between;gap:24px;align-items:center}.seo-featured-guide h3{font:800 18px var(--font-head);color:var(--ink);margin:5px 0 5px}.seo-featured-guide p{font-size:9.5px;line-height:1.6;color:#687587;margin:0;max-width:700px}.seo-featured-guide>a{display:inline-flex;align-items:center;gap:7px;border:1px solid #c5d2e7;background:#fff;border-radius:11px;padding:10px 12px;color:var(--blue);font-size:9px;font-weight:900;white-space:nowrap}.seo-featured-guide>a .icon{width:13px;height:13px}
@media(max-width:900px){.guides-grid{grid-template-columns:1fr}.guides-principles{grid-template-columns:1fr}.guides-principle-grid{grid-template-columns:1fr}.guide-article-hero{grid-template-columns:1fr;gap:22px}.guide-tool-cta{max-width:520px}.guide-article-grid{grid-template-columns:1fr}.guide-article-side{position:static;grid-template-columns:repeat(2,1fr)}.more-guides-grid{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.guides-page{padding:42px 0 72px}.guides-hero{text-align:left}.guides-hero h1{font-size:43px;letter-spacing:-2px}.guides-hero-meta{justify-content:flex-start}.guide-card{padding:19px}.guides-principles{padding:24px 19px}.guide-article-page{padding-top:18px}.guide-article-hero{padding:18px 0 28px}.guide-article-hero h1{font-size:43px;letter-spacing:-2px}.guide-article-hero>div>p{font-size:12px}.guide-takeaways,.guide-copy-section,.guide-example-box,.guide-two-col>div,.guide-disclaimer{padding:21px 18px;border-radius:17px}.guide-copy-section h2,.guide-example-box h2,.guide-two-col h2{font-size:20px}.guide-copy-section p{font-size:11px}.guide-example-box dl{grid-template-columns:1fr}.guide-two-col{grid-template-columns:1fr}.guide-article-side{grid-template-columns:1fr}.more-guides-grid{grid-template-columns:1fr}.seo-featured-guide{display:block;padding:18px}.seo-featured-guide>a{margin-top:13px}}


/* =========================================================
   v2.4 MASTER SEO ROLLOUT
   Light formula treatment + category planning documentation.
   ========================================================= */
.guide-formula-box{
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg,#f6f9ff 0%,#ffffff 58%,#fffaf0 100%);
  color:var(--ink);
  border:1px solid #d8e0eb;
  border-radius:20px;
  padding:25px 28px;
  display:grid;
  gap:9px;
  box-shadow:0 12px 32px rgba(11,19,36,.045);
}
.guide-formula-box:before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;height:3px;
  background:linear-gradient(90deg,var(--blue) 0 72%,var(--amber) 72% 100%);
}
.guide-formula-box>span{
  color:var(--blue);
  font-size:7.5px;
  font-weight:900;
  letter-spacing:1.15px;
  margin-bottom:4px;
}
.guide-formula-box code{
  display:block;
  position:relative;
  background:#fff;
  color:#26364f;
  border:1px solid #dde4ef;
  border-left:3px solid var(--blue);
  border-radius:11px;
  padding:12px 14px;
  font:750 10.5px/1.55 var(--font-body);
  white-space:normal;
  box-shadow:0 3px 10px rgba(24,39,75,.025);
}
.guide-formula-box code:nth-of-type(even){border-left-color:var(--amber)}

.category-planning{padding:0 0 92px}
.category-planning .container{border-top:1px solid #dedfdc;padding-top:46px}
.category-planning-head{max-width:760px;margin-bottom:24px}
.category-planning-head h2{font:800 32px/1.12 var(--font-head);letter-spacing:-1.25px;color:var(--ink);margin:9px 0 11px}
.category-planning-head p{font-size:12.5px;line-height:1.75;color:#5c6878;margin:0}
.category-planning-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}
.category-planning-grid article{background:#fff;border:1px solid #dedfe2;border-radius:18px;padding:22px 22px 24px;box-shadow:0 10px 28px rgba(11,19,36,.035)}
.category-planning-grid article>span{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:#edf3ff;color:var(--blue);font:900 9px var(--font-body);margin-bottom:16px}
.category-planning-grid article:nth-child(2)>span{background:#fff5df;color:#a86705}
.category-planning-grid article:nth-child(3)>span{background:#eef9f3;color:#16844c}
.category-planning-grid h3{font:800 16px/1.2 var(--font-head);letter-spacing:-.35px;color:var(--ink);margin:0 0 8px}
.category-planning-grid p{font-size:10.5px;line-height:1.7;color:#606c7c;margin:0}
.category-method-link{margin-top:15px;background:linear-gradient(90deg,#f7f9fd,#fffaf1);border:1px solid #dde2e8;border-radius:16px;padding:16px 18px;display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center}
.category-method-link strong{font:800 11px var(--font-head);color:var(--ink)}
.category-method-link span{font-size:9.5px;color:#6a7481}
.category-method-link a{font-size:9.5px;font-weight:900;color:var(--blue);white-space:nowrap}

@media(max-width:760px){
  .category-planning{padding-bottom:64px}.category-planning .container{padding-top:32px}.category-planning-head h2{font-size:26px;letter-spacing:-.9px}.category-planning-grid{grid-template-columns:1fr}.category-method-link{grid-template-columns:1fr;gap:6px}.category-method-link a{margin-top:4px}
}


/* DIYGauge v2.6 — final trust and monetization readiness */
.trust-page .trust-hero{max-width:900px}.trust-check-list{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:10px}.trust-check-list li{position:relative;padding-left:24px;color:#566273;font-size:12px;line-height:1.7}.trust-check-list li:before{content:"✓";position:absolute;left:0;top:1px;width:16px;height:16px;border-radius:50%;display:grid;place-items:center;background:#e8f8ef;color:#159455;font-size:9px;font-weight:900}.contact-panel{max-width:780px;margin:0 auto}.contact-email{font-weight:800;color:var(--blue);word-break:break-word}.setup-notice{padding:18px 19px;border:1px solid #ead7ad;background:#fff9eb;border-radius:14px;color:#604c27}.setup-notice strong{display:block;font:800 14px var(--font-head);color:#3b3020}.setup-notice p{margin:6px 0 0!important;color:#74664e!important}.setup-notice code{background:#fff;border:1px solid #e7dcc5;border-radius:5px;padding:2px 5px;color:#2f3d50}.legal-copy a{color:var(--blue);font-weight:700}.editorial-main .btn{display:inline-flex;margin-top:8px}.footer-brand .muted{max-width:330px}
@media(max-width:720px){.trust-check-list li{font-size:11px}.contact-panel{margin:0}.setup-notice{padding:16px}}

/* ==========================================================
   DIYGauge v2.6.2 — Trust Restore + Safe Polish
   Scoped only to the six trust/legal pages. Original v2.6
   markup is preserved; calculator, guide and SEO UI untouched.
   ========================================================== */
.trust-safe-polish{
  padding:54px 0 92px;
  background:
    radial-gradient(circle at 90% 5%,rgba(38,103,240,.055),transparent 25%),
    linear-gradient(180deg,#faf7f1 0%,#f8f8f6 45%,#fff 100%);
}
.trust-safe-polish .editorial-wrap{max-width:1180px}
.trust-safe-polish .editorial-wrap.narrow{max-width:1120px}
.trust-safe-polish .editorial-hero{
  padding:20px 0 34px;
  margin-bottom:28px;
  border-bottom:1px solid #ddd9d1;
}
.trust-safe-polish .editorial-hero .kicker{display:inline-flex;align-items:center;gap:9px}
.trust-safe-polish .editorial-hero .kicker:after{content:"";width:28px;height:2px;border-radius:99px;background:var(--amber)}
.trust-safe-polish .editorial-hero h1{
  max-width:900px;
  font-size:clamp(42px,4.7vw,62px);
  line-height:1.01;
  letter-spacing:-2.6px;
  margin-top:10px;
}
.trust-safe-polish .editorial-hero p{max-width:900px;font-size:14px;line-height:1.8;color:#566477}

/* Original Methodology/About two-column layout, just wider and lighter. */
.trust-safe-polish .editorial-grid{grid-template-columns:minmax(0,1fr) 310px;gap:28px}
.trust-safe-polish .editorial-main{
  border-color:#dfe4eb;
  border-radius:20px;
  padding:30px 32px;
  box-shadow:0 12px 32px rgba(25,39,61,.045);
}
.trust-safe-polish .editorial-main section{padding:3px 0 24px;margin-bottom:22px;border-bottom-color:#e9edf2}
.trust-safe-polish .editorial-main h2{font-size:21px;letter-spacing:-.45px}
.trust-safe-polish .editorial-main p{font-size:12.5px;line-height:1.82;color:#586779}
.trust-safe-polish .editorial-side{top:88px;gap:12px}

/* Light trust cards — no heavy black blocks. */
.trust-safe-polish .trust-card,
.trust-safe-polish .trust-card.soft{
  background:#fff;
  color:var(--ink);
  border:1px solid #dfe4eb;
  border-radius:18px;
  box-shadow:0 10px 26px rgba(25,39,61,.04);
  padding:20px;
}
.trust-safe-polish .trust-card:first-child{border-top:3px solid var(--blue)}
.trust-safe-polish .trust-card.soft{background:linear-gradient(135deg,#fff,#fffaf0)}
.trust-safe-polish .trust-card.soft:nth-child(2){border-top:3px solid var(--amber)}
.trust-safe-polish .trust-card>span,
.trust-safe-polish .trust-card.soft>span{color:#5278be;font-size:7.5px;letter-spacing:1.15px}
.trust-safe-polish .trust-card.soft>span{color:#a66b0d}
.trust-safe-polish .trust-card h3{color:var(--ink);font-size:18px;margin:7px 0 9px}
.trust-safe-polish .trust-card p,
.trust-safe-polish .trust-card.soft p{color:#667383;font-size:10.8px;line-height:1.7}
.trust-safe-polish .trust-card ul{gap:8px}
.trust-safe-polish .trust-card li{color:#627082;font-size:10.5px;padding-left:18px}
.trust-safe-polish .trust-card li:before{color:#168b51}

/* Standalone legal pages: convert the long document into a calm card grid
   without changing any source content or headings. */
.trust-safe-polish.legal-page .editorial-main{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  background:transparent;
  border:0;
  box-shadow:none;
  padding:0;
}
.trust-safe-polish.legal-page .editorial-main section{
  margin:0;
  padding:22px 23px;
  border:1px solid #dfe4eb;
  border-radius:17px;
  background:#fff;
  box-shadow:0 8px 24px rgba(25,39,61,.035);
}
.trust-safe-polish.legal-page .editorial-main section:nth-child(3n+2){border-top:3px solid rgba(38,103,240,.42)}
.trust-safe-polish.legal-page .editorial-main section:nth-child(3n){border-top:3px solid rgba(229,168,50,.55)}
.trust-safe-polish.legal-page .editorial-main h2{font-size:17px;margin-bottom:8px}
.trust-safe-polish.legal-page .editorial-main p{font-size:11.5px;line-height:1.76}

/* Contact stays compact but no longer floats as a tiny card in empty space. */
.trust-safe-polish .contact-panel{max-width:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;background:transparent;border:0;box-shadow:none;padding:0}
.trust-safe-polish .contact-panel section{margin:0;padding:23px;border:1px solid #dfe4eb;border-radius:17px;background:#fff;box-shadow:0 8px 24px rgba(25,39,61,.035)}
.trust-safe-polish .contact-panel section:nth-child(2){border-top:3px solid var(--blue)}
.trust-safe-polish .setup-notice{margin-top:10px;background:#fffaf0;border-color:#ead8b7}

@media(max-width:980px){
  .trust-safe-polish .editorial-grid{grid-template-columns:1fr}
  .trust-safe-polish .editorial-side{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}
  .trust-safe-polish .contact-panel{grid-template-columns:1fr}
}
@media(max-width:720px){
  .trust-safe-polish{padding:34px 0 70px}
  .trust-safe-polish .editorial-hero{padding-top:10px;margin-bottom:22px}
  .trust-safe-polish .editorial-hero h1{font-size:40px;letter-spacing:-1.9px}
  .trust-safe-polish .editorial-hero p{font-size:13px}
  .trust-safe-polish .editorial-main{padding:22px}
  .trust-safe-polish.legal-page .editorial-main{grid-template-columns:1fr;padding:0}
  .trust-safe-polish .editorial-side{grid-template-columns:1fr}
  .trust-safe-polish .contact-panel{padding:0}
}


/* ==========================================================
   DIYGauge v2.7 — Internal Linking + Smart Related Tools
   ========================================================== */
.related-tools-inline{margin:24px 0 38px;padding:24px;border:1px solid #dfe4ec;border-radius:22px;background:linear-gradient(135deg,#ffffff 0%,#f8faff 68%,#fffaf0 100%);box-shadow:0 12px 34px rgba(24,39,75,.045)}
.related-tools-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:17px}.related-tools-head h2{font:800 24px/1.12 var(--font-head);letter-spacing:-.7px;color:var(--ink);margin:6px 0 5px}.related-tools-head p{font-size:10.5px;line-height:1.65;color:#687587;margin:0;max-width:650px}.related-tools-head>a{font-size:9.5px;font-weight:900;color:var(--blue);white-space:nowrap;padding-bottom:4px}
.related-tools-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}.related-tool-card{display:grid;grid-template-columns:38px minmax(0,1fr) 20px;align-items:center;gap:12px;min-height:104px;padding:15px 14px;background:#fff;border:1px solid #e0e5ed;border-radius:15px;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.related-tool-card:hover{transform:translateY(-2px);border-color:#b9cdf9;box-shadow:0 10px 24px rgba(38,103,240,.08)}.related-tool-icon{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:#edf3ff;color:var(--blue)}.related-tool-icon svg{width:18px;height:18px}.related-tool-copy{min-width:0;display:flex;flex-direction:column}.related-tool-copy small{font-size:6.8px;font-weight:900;letter-spacing:.85px;text-transform:uppercase;color:#8290a3;margin-bottom:4px}.related-tool-copy strong{font:800 12.5px/1.24 var(--font-head);color:var(--ink);letter-spacing:-.15px}.related-tool-copy em{font-style:normal;font-size:8.6px;line-height:1.45;color:#778395;margin-top:4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.related-tool-arrow{color:#9aa8ba;display:grid;place-items:center}.related-tool-arrow svg{width:15px;height:15px}
.trust-internal-links{padding:0 0 72px;background:linear-gradient(180deg,#fff 0%,#faf7f1 100%)}.trust-internal-links .container{padding-top:34px;border-top:1px solid #e0ddd6}.trust-internal-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:16px}.trust-internal-head h2{font:800 24px/1.15 var(--font-head);letter-spacing:-.7px;color:var(--ink);margin:6px 0 0}.trust-primary-links{display:flex;gap:16px}.trust-primary-links a{font-size:9.5px;font-weight:900;color:var(--blue);white-space:nowrap}.trust-internal-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.trust-internal-grid>a{display:flex;flex-direction:column;gap:5px;padding:15px 16px;border:1px solid #e0e4e9;border-radius:14px;background:#fff;transition:.18s ease}.trust-internal-grid>a:hover{transform:translateY(-2px);border-color:#bed0f7;box-shadow:0 8px 22px rgba(25,39,61,.05)}.trust-internal-grid>a.active{border-color:#a9c4ff;background:#f3f7ff;box-shadow:inset 3px 0 0 var(--blue)}.trust-internal-grid strong{font:800 11.5px var(--font-head);color:var(--ink)}.trust-internal-grid span{font-size:8.8px;line-height:1.45;color:#758194}
@media(max-width:900px){.related-tools-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.trust-internal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.related-tools-inline{padding:18px;margin-top:18px}.related-tools-head{display:block}.related-tools-head>a{display:inline-block;margin-top:11px}.related-tools-grid{grid-template-columns:1fr}.related-tool-card{min-height:92px}.trust-internal-links{padding-bottom:54px}.trust-internal-head{display:block}.trust-primary-links{margin-top:12px}.trust-internal-grid{grid-template-columns:1fr}}

/* ==========================================================
   DIYGauge v2.8 — Homepage Featured Live Project View
   Interactive homepage demo using the production SVG renderer.
   ========================================================== */
.home-feature-section{
  position:relative;
  overflow:hidden;
  padding:78px 0;
  background:
    radial-gradient(circle at 92% 18%,rgba(37,99,235,.10),transparent 27%),
    radial-gradient(circle at 7% 84%,rgba(215,154,53,.08),transparent 23%),
    linear-gradient(180deg,#f7f4ee 0%,#edf1f6 100%);
  border-bottom:1px solid #d9d5cc;
}
.home-feature-section:before{
  content:"";position:absolute;right:-70px;top:38px;width:370px;height:370px;border-radius:50%;pointer-events:none;
  background-image:linear-gradient(rgba(37,99,235,.065) 1px,transparent 1px),linear-gradient(90deg,rgba(37,99,235,.065) 1px,transparent 1px);
  background-size:24px 24px;mask-image:radial-gradient(circle,#000 28%,transparent 72%);opacity:.78;
}
.home-feature-shell{position:relative;z-index:1;display:grid;grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr);gap:48px;align-items:center}
.home-feature-copy h2{font:800 clamp(38px,4vw,58px)/.98 var(--font-head);letter-spacing:-2.7px;color:var(--ink);margin:14px 0 18px;max-width:560px}
.home-feature-copy h2 em{font-style:normal;color:var(--blue);position:relative}
.home-feature-copy>p{font-size:14px;line-height:1.8;color:#5d6878;max-width:520px;margin:0 0 22px}
.home-feature-points{display:flex;flex-wrap:wrap;gap:9px 14px;margin:0 0 22px;color:#344054;font-size:10px;font-weight:800}
.home-feature-points span{display:inline-flex;align-items:center;gap:6px}.home-feature-points .icon{width:14px;height:14px;color:#1d9b59}
.home-feature-note{display:flex;gap:11px;align-items:flex-start;padding:13px 14px;margin:0 0 22px;border:1px solid #dfd5c5;border-left:3px solid var(--amber);border-radius:12px;background:rgba(255,253,249,.72);box-shadow:0 7px 20px rgba(49,40,27,.035)}
.home-feature-note strong{white-space:nowrap;font:800 10px var(--font-head);color:#6f4c18;text-transform:uppercase;letter-spacing:.5px}
.home-feature-note span{font-size:10px;line-height:1.55;color:#667085}
.home-feature-full-link{width:max-content;box-shadow:0 10px 24px rgba(37,99,235,.18)}

.home-demo{position:relative;padding:18px;border:1px solid #cfd8e5;border-radius:22px;background:rgba(255,255,255,.82);box-shadow:0 26px 70px rgba(30,45,68,.12),inset 0 1px 0 rgba(255,255,255,.95);backdrop-filter:blur(8px)}
.home-demo:before{content:"";position:absolute;left:20px;right:20px;top:0;height:3px;border-radius:0 0 8px 8px;background:linear-gradient(90deg,var(--blue) 0 80%,var(--amber) 80% 100%)}
.home-demo-top{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:4px 2px 15px}
.home-demo-top>div{display:flex;flex-direction:column;gap:3px}.home-demo-top>div>span{font-size:7.5px;letter-spacing:1.45px;font-weight:900;color:var(--blue)}
.home-demo-top strong{font:800 16px var(--font-head);color:var(--ink)}
.home-demo-live{display:inline-flex;align-items:center;gap:6px;padding:6px 9px;border:1px solid #d2e9d9;background:#f2fbf5;color:#2b7549;border-radius:999px;font-size:7px;font-weight:850;text-transform:uppercase;letter-spacing:.45px}
.home-demo-live i{width:6px;height:6px;border-radius:50%;background:#20a85d;box-shadow:0 0 0 3px rgba(32,168,93,.11)}
.home-demo-grid{display:grid;grid-template-columns:190px minmax(0,1fr);gap:15px;align-items:stretch}
.home-demo-controls{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-content:start;padding:15px;border:1px solid #e1ddd4;border-radius:16px;background:#fffdf9}
.home-demo-field{grid-column:1/-1}.home-demo-field.compact{grid-column:auto}.home-demo-field.full{grid-column:1/-1}
.home-demo-field label{display:block;margin:0 0 5px;font-size:8px;font-weight:800;color:#485568}
.home-demo-field>div{display:grid;grid-template-columns:1fr auto;align-items:center;overflow:hidden;border:1px solid #d8d2c8;border-radius:9px;background:#fff;transition:.15s ease}
.home-demo-field>div:focus-within{border-color:#8eaded;box-shadow:0 0 0 3px rgba(36,99,235,.07)}
.home-demo-field input{width:100%;min-width:0;border:0;outline:0;background:transparent;padding:10px 8px;font:800 12px var(--font-head);color:var(--ink)}
.home-demo-field>div span{height:100%;display:grid;place-items:center;min-width:34px;padding:0 7px;border-left:1px solid #e5dfd5;background:#f7f4ee;font-size:7px;font-weight:800;color:#697586}
.home-demo-helper{grid-column:1/-1;margin:3px 0 0;font-size:7.5px;line-height:1.5;color:#8590a0}
.home-demo-visual{min-width:0}.featured-project-view-card{height:auto;margin:0;padding:12px 12px 10px;border-radius:16px;box-shadow:none;background:#fff}
.featured-project-view-card .live-project-head{padding-bottom:9px}.featured-project-view-card .live-project-head strong{font-size:12px}.featured-project-view-card .live-project-status{font-size:6.5px;padding:5px 7px}
.featured-project-view-card .live-project-stage{min-height:205px}.featured-project-view-card .live-project-svg{min-height:205px;max-height:225px}
.home-demo-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:9px}
.home-demo-stats>div{padding:9px 10px;border:1px solid #e1e4e9;border-radius:11px;background:#fff;min-width:0}
.home-demo-stats span{display:block;font-size:6.5px;font-weight:800;text-transform:uppercase;letter-spacing:.45px;color:#8490a0;margin-bottom:3px}
.home-demo-stats strong{display:block;font:800 12px var(--font-head);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home-demo-stats>div:nth-child(2){border-color:#d4e1fa;background:#f7faff}.home-demo-stats>div:nth-child(2) strong{color:var(--blue)}
.home-demo-empty{min-height:205px;display:grid;place-items:center;text-align:center;padding:25px;color:#8792a2;font-size:10px;font-weight:700}

@media(max-width:980px){
  .home-feature-shell{grid-template-columns:1fr;gap:30px}.home-feature-copy{max-width:720px}.home-feature-copy>p{max-width:680px}.home-demo-grid{grid-template-columns:210px 1fr}
}
@media(max-width:720px){
  .home-feature-section{padding:56px 0}.home-feature-shell{gap:25px}.home-feature-copy h2{font-size:39px;letter-spacing:-2px}.home-feature-copy>p{font-size:12px}.home-feature-points{font-size:9px}
  .home-feature-note{display:block}.home-feature-note strong{display:block;margin-bottom:5px}.home-feature-full-link{width:100%;justify-content:center}
  .home-demo{padding:13px;border-radius:18px}.home-demo-grid{grid-template-columns:1fr}.home-demo-controls{grid-template-columns:1fr 1fr;padding:12px}.home-demo-field{grid-column:1/-1}.home-demo-field.compact{grid-column:auto}
  .home-demo-stats{grid-template-columns:1fr 1fr}.home-demo-stats>div:last-child{grid-column:1/-1}.featured-project-view-card .live-project-stage{min-height:190px}.featured-project-view-card .live-project-svg{min-height:190px;max-height:215px}
}

/* ==========================================================
   DIYGauge v2.9 — Calculator Content Uniqueness + Context Notes
   ========================================================== */
.tool-context-warning{margin:20px 0 4px;padding:16px 18px;border:1px solid #e6d7b9;border-radius:16px;background:linear-gradient(135deg,#fffaf0,#fffdf8);display:grid;grid-template-columns:34px minmax(0,1fr);gap:13px;align-items:start;box-shadow:0 8px 24px rgba(44,35,20,.035)}
.tool-context-warning-icon{width:34px;height:34px;border-radius:10px;background:#f4b84a;color:#2d230f;display:grid;place-items:center;font:900 16px var(--font-head)}
.tool-context-warning-copy>span{display:block;font-size:7px;font-weight:900;letter-spacing:1px;text-transform:uppercase;color:#9a6815;margin:1px 0 4px}.tool-context-warning-copy>strong{display:block;font:800 13px/1.3 var(--font-head);color:#2e2a23;margin-bottom:4px}.tool-context-warning-copy>p{margin:0;color:#756b5d;font-size:9.8px;line-height:1.62;max-width:980px}
.seo-decision-card{margin-top:18px;padding:20px 22px;border:1px solid #cfdcf2;border-radius:17px;background:linear-gradient(135deg,#f7faff,#eef4ff 72%,#fffaf2);display:grid;grid-template-columns:40px minmax(0,1fr);gap:14px;align-items:start}.seo-decision-mark{width:40px;height:40px;border-radius:12px;background:#e6efff;color:var(--blue);display:grid;place-items:center;font:900 18px var(--font-head)}.seo-decision-card small{display:block;color:var(--blue);font-size:7.5px;font-weight:900;letter-spacing:1.1px;margin:1px 0 5px}.seo-decision-card h3{font:800 18px/1.25 var(--font-head);color:var(--ink);letter-spacing:-.35px;margin:0 0 7px}.seo-decision-card p{margin:0;color:#536277;font-size:10.8px;line-height:1.72;max-width:900px}
.seo-mistakes-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.seo-mistake{display:flex;gap:10px;align-items:flex-start;padding:15px 16px;border:1px solid #e5e1d8;border-radius:14px;background:#fffdf9}.seo-mistake>span{width:22px;height:22px;flex:none;border-radius:50%;display:grid;place-items:center;background:#fff0e8;color:#b14e1f;font-size:11px;font-weight:900}.seo-mistake p{margin:0;color:#5c6675;font-size:10.5px;line-height:1.65}
@media(max-width:720px){.tool-context-warning{padding:14px;grid-template-columns:30px minmax(0,1fr)}.tool-context-warning-icon{width:30px;height:30px}.seo-decision-card{padding:17px}.seo-mistakes-grid{grid-template-columns:1fr}}

/* Phase 1 calculator consolidation */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.calculator-mode-switch{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:-12px 0 22px;padding:14px 16px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 6px 20px rgba(16,24,40,.035)}
.calculator-mode-switch>div{display:flex;flex-direction:column;gap:2px;min-width:0}.calculator-mode-switch>div>span{font-size:8px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;color:#98a2b3}.calculator-mode-switch>div>strong{font:700 13px var(--font-head);color:var(--ink)}.calculator-mode-switch>div>small{font-size:9px;line-height:1.45;color:#7b8796}.calculator-mode-switch label{flex:none}.calculator-mode-switch select{min-width:220px;max-width:330px;border:1px solid #dce2ea;border-radius:10px;background:#fff;color:var(--ink);padding:10px 34px 10px 12px;font-size:10px;font-weight:700;outline:none}.calculator-mode-switch select:focus{border-color:#8bb0f9;box-shadow:0 0 0 3px rgba(37,99,235,.08)}
@media(max-width:720px){.calculator-mode-switch{align-items:stretch;flex-direction:column;margin-top:-8px}.calculator-mode-switch label,.calculator-mode-switch select{width:100%;max-width:none}}