/* === pro-refinement.css === */
/* DeviceDIY — professional refinement v2.0. Preserves approved layout and brand. */
:root{--bg:#F9FBFA;--ink:#101820;--muted:#52616A;--line:#E3EBE7;--blue:#079F7E;--pale:#EAF7F2;--green:#087A60;--panel:#fff;--shadow:0 10px 30px rgba(16,24,32,.045);--focus:#075E4D;--radius:18px}
html{scroll-behavior:smooth;scroll-padding-top:92px;-webkit-text-size-adjust:100%}
body{background:#F9FBFA;color:var(--ink);font-family:Inter,'Segoe UI Variable','Segoe UI',system-ui,-apple-system,Arial,sans-serif;font-size:15.5px;line-height:1.68;font-weight:400;letter-spacing:-.008em;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
::selection{background:#C7EEE1;color:#101820}
h1,h2,h3,h4{font-family:inherit;color:#101820;letter-spacing:-.034em;text-wrap:balance;font-weight:740}
p,li{overflow-wrap:break-word}
a,button,input,select,textarea{transition:border-color .16s ease,box-shadow .16s ease,background-color .16s ease,color .16s ease,transform .16s ease}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid #079F7E!important;outline-offset:3px!important}
.shell{width:min(1190px,calc(100% - 56px))}
.topbar{background:rgba(255,255,255,.97);border-bottom:1px solid #E8EEEA;box-shadow:0 2px 13px rgba(16,24,32,.026)}
.nav{min-height:78px;gap:24px}
.brand{font-size:22px;font-weight:770;letter-spacing:-.052em;gap:10px;color:#101820;white-space:nowrap}
.brand-logo-image{width:39px;height:39px;object-fit:contain}
.nav-right{font-size:13.5px;font-weight:590;gap:27px;color:#485A56;letter-spacing:-.01em}
.nav-right a{padding:8px 2px}.nav-right a:hover{color:#079F7E}
.nav-badge{background:#E9F7F1;color:#08765E;font-weight:690;border:1px solid #D2ECE1}
/* Homepage hero: original split composition retained */
.hero{padding-top:69px;padding-bottom:61px}
.hero-layout{gap:clamp(30px,4vw,72px)}
.hero-copy{text-align:left}
.eyebrow,.section-mini,.kicker{font-size:11px!important;font-weight:740!important;letter-spacing:.115em!important;text-transform:uppercase}
.eyebrow{background:#EAF7F2!important;color:#067B60!important;border-color:#D4EEE3!important;padding:8px 13px!important}
.hero h1{font-size:clamp(60px,7.2vw,104px);font-weight:790;letter-spacing:-.065em;line-height:1.02;margin:24px 0 18px;color:#101820}
.hero-copy>p,.hero p{font-size:clamp(21px,2.3vw,31px);line-height:1.31;letter-spacing:-.035em;font-weight:460;color:#52606A;max-width:600px}
.features{font-size:12.5px;letter-spacing:0;font-weight:620;color:#52675F;gap:9px}
.features span{line-height:1.3}
.hero-actions{margin-top:26px;gap:12px}
.hero-actions a{min-height:47px;padding:12px 19px;font-weight:690;font-size:13px;letter-spacing:-.005em;border-radius:11px;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.hero-actions a:first-child{background:#079F7E;color:#fff;border:1px solid #079F7E;box-shadow:0 5px 15px #079f7e23}
.hero-actions a:first-child:hover{background:#087F67;border-color:#087F67;box-shadow:0 8px 22px #079f7e26;transform:translateY(-1px)}
.hero-actions a:not(:first-child){background:#fff;color:#17312C;border:1px solid #D8E4DE}
.hero-actions a:not(:first-child):hover{border-color:#079F7E;background:#F3FAF7}
.hero-mini-grid{gap:15px}
.hero-mini-card{background:#fff;border:1px solid #E3EAE6;border-radius:17px;box-shadow:0 9px 26px rgba(16,24,32,.075);font-size:14px;font-weight:660;letter-spacing:-.025em;min-width:0}
.hero-mini-card:hover{border-color:#A8D8C6;box-shadow:0 12px 32px #10182014;transform:translateY(-2px)}
.hero-mini-card span{color:#16241F}
/* Tool discovery and cards */
.section-heading{margin-top:24px;margin-bottom:23px;align-items:center}
.section-heading h2,.home-feature h2,.home-explainer h2,.seo-home h2{font-size:clamp(25px,2.8vw,36px);line-height:1.18;letter-spacing:-.04em;font-weight:760}
.section-heading p{font-size:14px;line-height:1.6;margin-top:8px;color:#63716C}
.count{font-size:12px;font-weight:680;white-space:nowrap;color:#087F67;background:#E9F7F1;padding:7px 11px;border-radius:30px}
.cards{gap:16px;margin-bottom:72px}
.tool-card{min-height:214px;border:1px solid #E5EDE8;border-radius:18px;padding:23px 22px 21px;background:#fff;box-shadow:0 7px 26px rgba(13,52,36,.035)}
.tool-card:hover,.tool-card:focus-visible{border-color:#A4D7C5;box-shadow:0 16px 34px #10182013;transform:translateY(-3px)}
.iconbox{border-radius:13px;margin-bottom:20px}
.tool-title{font-size:16px;line-height:1.32;font-weight:740;letter-spacing:-.022em;color:#17231F}
.tool-desc{font-size:13.25px;line-height:1.59;color:#60716B;margin:8px 0 16px}
.card-bottom{font-size:12.5px;font-weight:740;color:#087D62;letter-spacing:0}
/* Featured/educational content */
.home-feature,.why{border:1px solid #D9ECE2;background:linear-gradient(120deg,#EDF8F3 0%,#F7FCF9 100%);border-radius:23px;padding:clamp(25px,3.6vw,44px);box-shadow:none;margin-bottom:66px}
.home-feature h2,.why h2{max-width:620px;font-weight:750}
.home-feature p,.why p{font-size:14.5px;line-height:1.73;color:#536861}
.home-explainer,.seo-home{margin-top:48px;margin-bottom:70px}
.proof-item{font-size:13.5px;line-height:1.7;border-radius:15px}
.proof-item b{font-size:14px;font-weight:720;color:#14231E}
.seo-home{max-width:min(1190px,calc(100% - 56px))}
.seo-home p,.seo-home li{font-size:14.5px;line-height:1.78;color:#53665D}
/* Dedicated test page: preserve two-column workspace */
.tester{padding-top:31px;padding-bottom:83px}
.back{font-size:13px;color:#087D62;font-weight:690;letter-spacing:-.012em;margin-bottom:13px}
.breadcrumbs{font-size:12px;color:#75837B;margin-bottom:20px}
.tester-head{gap:16px;margin-bottom:26px;align-items:flex-start}
.tester-head .iconbox{width:58px;height:58px;border-radius:15px;flex-shrink:0}
.tester-head h1{font-size:clamp(30px,3.2vw,43px);line-height:1.12;font-weight:770;letter-spacing:-.05em;margin:0 0 9px}
.tester-head p{max-width:760px;font-size:15px;line-height:1.7;color:#57675F;margin:0}
.workspace{gap:20px;align-items:start}
.stage,.instructions{padding:clamp(19px,2.5vw,31px);border-radius:19px;border:1px solid #E0EAE4;background:#fff;box-shadow:0 9px 32px #10182008}
.stage{min-height:370px}
.instructions h3{font-size:18px;font-weight:750;letter-spacing:-.03em;margin:0 0 16px}
.instructions ol{padding-left:22px;margin:0}
.instructions li{font-size:13.75px;line-height:1.69;color:#55685E;padding-left:4px;margin:0 0 12px}
.instructions li::marker{font-weight:760;color:#079F7E}
.hint{background:#EFF8F3;border:1px solid #DAEEE3;border-radius:12px;font-size:12.75px;line-height:1.6;color:#47685A;padding:14px}
.notice{font-size:12px;line-height:1.7;color:#77847D}
.actions{gap:10px;margin:21px 0 16px}
.btn,.hero-actions a,.home-feature a{font-family:inherit;letter-spacing:-.012em}
.btn{min-height:46px;border-radius:11px;padding:11px 17px;font-size:13.5px;font-weight:710;color:#20362F;border:1px solid #CDDDD4;background:#fff;box-shadow:0 1px 1px #10182009}
.btn:hover:not(:disabled){background:#F0F8F3;border-color:#9FCEB8;transform:translateY(-1px)}
.btn.primary{background:#079F7E;border-color:#079F7E;color:#fff;box-shadow:0 4px 12px #079f7e26}
.btn.primary:hover:not(:disabled){background:#087D64;border-color:#087D64;box-shadow:0 6px 15px #079f7e29}
.btn:active:not(:disabled){transform:translateY(0)}
.btn:disabled{opacity:.48;box-shadow:none;transform:none}
.field,select,input[type=text],input[type=number],input[type=range]{accent-color:#079F7E}
.field{background:#fff;min-height:45px;padding:10px 13px;border:1px solid #CADBD1;border-radius:11px;color:#12221B;font-size:14px}
.field:hover{border-color:#93BFA9}.field:focus{border-color:#079F7E;outline:3px solid #079f7e24}
.label{font-size:12.5px;font-weight:730;letter-spacing:.008em;margin:17px 0 7px;color:#263A30}
.small{font-size:12.75px;line-height:1.65;color:#6A7971}
.status{border-radius:12px;padding:14px 16px;min-height:52px;background:#F3F7F4;color:#4F6258;font-size:13.25px;line-height:1.59;border:1px solid #E4EEE7}
.status.good{background:#EAF8F0;color:#086047;border-color:#C5E9D6}
.status.bad{background:#FFF2F1;color:#A12E31;border-color:#F2D4D2}
.meter{height:13px;background:#E5F1EA}.meter div{background:linear-gradient(90deg,#65C4A7,#079F7E)}
.level{font-size:30px;font-weight:760;color:#087D62;letter-spacing:-.04em}
.preview{border-radius:13px;background:#101820}
.key-visual,.mouse-pad,.touch-pad{border-radius:15px;background:#F5FAF7;border-color:#BFD8CB}
.key-visual strong{font-weight:760;letter-spacing:-.04em}
.stat{background:#FBFDFB;border:1px solid #E3EEE6;border-radius:12px}
.stat b{font-weight:750;color:#16281F;letter-spacing:-.03em}
.check{border-color:#E5EEE8;border-radius:11px;background:#FCFEFD;padding:13px 14px;font-size:13px}
/* SEO content and answers */
.tool-detail{margin-top:56px}
.tool-detail h2{font-size:clamp(22px,2.4vw,30px);font-weight:750;letter-spacing:-.04em;line-height:1.25;margin-top:38px;margin-bottom:15px}
.tool-detail h3{font-size:16px;font-weight:730;line-height:1.42;letter-spacing:-.025em}
.tool-detail p,.tool-detail li,.privacy-page p,.privacy-page li{font-size:14.5px;line-height:1.79;color:#52635A}
.tool-detail li{margin-bottom:7px}
.answer-box,.premium-note{border:1px solid #D3E9DB;background:#F0F9F3;border-radius:16px;padding:clamp(18px,2.4vw,26px);box-shadow:none}
.answer-box strong,.premium-note strong{color:#08775C;font-size:13px;font-weight:760}
.content-grid{gap:15px}
.info-tile{background:#fff;border:1px solid #E4ECE5;border-radius:15px;padding:22px;box-shadow:0 4px 18px #10182006}
.info-tile h3{margin-top:0}
.faq-list{display:grid;gap:10px}
.faq-list details{border:1px solid #E0EAE3;background:#fff;border-radius:13px;padding:0;box-shadow:0 3px 13px #10182005;overflow:hidden}
.faq-list summary{cursor:pointer;font-size:14px;font-weight:690;letter-spacing:-.012em;padding:17px 20px;color:#1D3025;list-style-position:inside}
.faq-list details[open] summary{color:#08775C;background:#F5FAF7;border-bottom:1px solid #E4EEE7}
.faq-list details p{margin:0;padding:16px 20px 19px}
.related-links{gap:10px}.related-links a{border:1px solid #D7E8DF;color:#087D62;background:#fff;font-size:13px;font-weight:670;border-radius:11px;padding:12px 15px}
.related-links a:hover{background:#EFF8F2;border-color:#95CCB5}
.trust-caption{font-size:12.25px!important;color:#7C8A81!important;border-top:1px solid #E8EEE9;margin-top:35px;padding-top:19px}
/* Standalone pages: professional consistency */
.privacy-page{border:1px solid #E8EFEA;background:#fff;border-radius:20px;box-shadow:0 12px 40px #10182008}
.privacy-page h1{font-size:clamp(32px,4.3vw,52px);font-weight:770;line-height:1.12;letter-spacing:-.055em}
.privacy-page h2{font-size:clamp(21px,2.3vw,27px);line-height:1.3;font-weight:740;letter-spacing:-.036em;margin:34px 0 13px}
.privacy-page a{color:#087F64;text-underline-offset:3px}
.foot{border-top:1px solid #E6EDE8;background:#fff;padding-top:30px;padding-bottom:36px;font-size:12.5px;color:#6D7B72}
.foot a:hover{color:#087D62}
/* Mobile and keyboard support */
@media(max-width:900px){.shell{width:min(100% - 40px,1190px)}.hero{padding-top:48px;padding-bottom:45px}.workspace{gap:15px}.nav-right{gap:15px}.tool-card{min-height:205px}}
@media(max-width:640px){.shell{width:calc(100% - 34px)}.nav{min-height:68px;gap:10px}.brand{font-size:20px;letter-spacing:-.047em}.brand-logo-image{width:35px;height:35px}.hero{padding-top:40px;padding-bottom:40px}.hero-layout{gap:30px}.hero h1{font-size:clamp(47px,11.5vw,66px);letter-spacing:-.067em;margin:20px 0 15px}.hero-copy>p,.hero p{font-size:clamp(20px,5.3vw,25px);line-height:1.36}.hero-actions{gap:9px}.hero-actions a{padding:11px 14px;min-height:45px;font-size:12px}.hero-mini-grid{gap:10px}.hero-mini-card{border-radius:14px}.section-heading{margin-bottom:17px}.section-heading h2{font-size:26px}.cards{gap:11px;margin-bottom:45px}.tool-card{border-radius:15px;padding:17px;min-height:196px}.tool-title{font-size:14.5px}.tool-desc{font-size:12.5px;line-height:1.53}.card-bottom{font-size:12px}.iconbox{margin-bottom:14px}.tester{padding-top:21px}.tester-head{gap:12px;margin-bottom:19px}.tester-head h1{font-size:29px}.tester-head p{font-size:13.75px;line-height:1.62}.stage,.instructions{padding:18px;border-radius:16px}.stage{min-height:300px}.btn{min-height:45px;padding:10px 14px}.tool-detail{margin-top:42px}.tool-detail h2{font-size:23px;margin-top:30px}.privacy-page{border-radius:16px}.home-feature,.why{padding:24px;margin-bottom:45px}}
@media(max-width:380px){.shell{width:calc(100% - 28px)}.hero h1{font-size:45px}.hero-actions a{font-size:11.5px;padding:10px 12px}.tool-card{padding:14px}.tool-title{font-size:13.5px}.tool-desc{font-size:12px}.section-heading h2{font-size:24px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

/* DeviceDIY integrated editorial cross-links */
.guide-teaser{background:#f0faf5;border:1px solid #caeadb;border-radius:18px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 24px;margin:28px 0;color:#101820}.guide-teaser strong{font-size:17px;font-weight:780;letter-spacing:-.025em}.guide-teaser p{margin:5px 0 0;font-size:13px;line-height:1.6;color:#52695d;max-width:650px}.guide-teaser a{background:#079f7e;color:#fff;border-radius:10px;padding:12px 16px;font-weight:750;font-size:12px;white-space:nowrap}.guide-teaser a:hover{background:#06775f}.guide-teaser a:focus-visible{outline:3px solid #70d8bc;outline-offset:3px}@media(max-width:680px){.guide-teaser{display:block;padding:19px}.guide-teaser a{display:inline-block;white-space:normal;margin-top:15px}}


/* === color-refinement.css === */
/* DeviceDIY colour refinement — palette-only enhancement, no functional changes.
   Emerald brand | deep ink | fresh pastel accents | accessible interaction states. */
:root{--bg:#f8faf9;--ink:#10252b;--muted:#51646a;--line:#dce8e4;--blue:#078b71;--pale:#e8f7f0;--green:#08785f;--panel:#fff;--growth-green:#078b71;--growth-ink:#10252b;--growth-line:#dce8e4}
body{background:#f8faf9;color:#10252b}
.topbar,.sitehead{background:rgba(255,255,255,.98)}
.hero{background:radial-gradient(circle at 88% 17%,#e4f6ff 0,transparent 37%),radial-gradient(circle at 38% 100%,#e9faed 0,transparent 45%),linear-gradient(125deg,#fff,#f4fbf8)!important;border-color:#d9eae4!important}
.hero:after{background:linear-gradient(90deg,#079f7e,#40bad1,#8c83df)!important}
.hero .eyebrow,.eyebrow{background:#e5f6ef!important;color:#086b56!important;border-color:#c9e9dd!important}
.hero-mini-card:nth-child(4n+1){background:#e8f7f1;border-color:#ccebdd}
.hero-mini-card:nth-child(4n+2){background:#edf3ff;border-color:#d8e5ff}
.hero-mini-card:nth-child(4n+3){background:#fff3e8;border-color:#f7e3ce}
.hero-mini-card:nth-child(4n){background:#f3efff;border-color:#e4daf9}
.hero-mini-card i{background:#fff9;color:#49645f}
.tool-card:nth-child(4n+1){background:linear-gradient(155deg,#eaf9f3,#fff 78%);border-color:#d6eee2}
.tool-card:nth-child(4n+2){background:linear-gradient(155deg,#eff4ff,#fff 78%);border-color:#e0e9fb}
.tool-card:nth-child(4n+3){background:linear-gradient(155deg,#fff4ea,#fff 78%);border-color:#f4e6d9}
.tool-card:nth-child(4n){background:linear-gradient(155deg,#f6f0ff,#fff 78%);border-color:#eae1fa}
.tool-card:nth-child(4n+1) .iconbox{background:#d4f1e3;color:#076c55}
.tool-card:nth-child(4n+2) .iconbox{background:#dfeaff;color:#3152a3}
.tool-card:nth-child(4n+3) .iconbox{background:#ffe8d3;color:#a85a24}
.tool-card:nth-child(4n) .iconbox{background:#e8ddff;color:#7654a4}
.tool-card:hover,.tool-card:focus-visible,.hero-mini-card:hover,.hero-mini-card:focus-visible{border-color:#079f7e!important}
.why,.home-feature{background:linear-gradient(125deg,#e6f7f0 0%,#eff8ff 62%,#f7f1ff 100%)!important;border-color:#d4ece5!important}
.stage,.instructions,.growth-tool,.growth-content,.article-card,.content-card{border-color:#dce8e5}
.stage{background:linear-gradient(160deg,#fff 65%,#f6fbf9)}
.tester-head .iconbox{background:#ddf5e9;color:#08745c}
.growth-visual{background:linear-gradient(135deg,#e4f7ee,#eaf4ff,#f5eefe);border-color:#d9e8ec}
.growth-status,.growth-result,.growth-kpi,.growth-diagnostics{background:#f0faf5}
.growth-action,.btn.primary,.nav-cta{background:#078b71!important;border-color:#078b71!important;color:#fff!important}
.growth-action:hover,.btn.primary:hover,.nav-cta:hover{background:#066a56!important;border-color:#066a56!important}
.growth-action.secondary{background:#e8f6f0!important;color:#085f4e!important;border-color:#c7e5d8!important}
.growth-navlinks a{border-radius:12px}
/* Editorial pages share the same colour family without restructuring their layout. */
.sitehead{border-bottom-color:#dce9e4}
.hubhero{background:linear-gradient(120deg,#e9f9f2 0%,#eef5ff 72%,#f6f0ff 100%)!important;border-color:#d8ece3!important}
.hubcard:nth-child(4n+1){background:#f1faf5;border-color:#d7ede1}
.hubcard:nth-child(4n+2){background:#f2f6ff;border-color:#dfe7f8}
.hubcard:nth-child(4n+3){background:#fff6ef;border-color:#f4e6d7}
.hubcard:nth-child(4n){background:#f8f3ff;border-color:#eadff8}
.hubcard:hover{border-color:#079f7e}
.navbutton{background:#078b71!important;color:#fff!important}
/* Focus clarity and motion-reduced support. */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #078b71!important;outline-offset:3px!important}
@media(max-width:560px){.tool-card{background:#fff}.hero{background:linear-gradient(145deg,#fff,#eaf8f2)!important}}
@media(prefers-reduced-motion:reduce){.tool-card,.hero-mini-card{transition:none!important}}


/* === editorial-redesign.css === */
/* DeviceDIY — Bold editorial refresh inspired by saturated print-poster design.
   Dedicated last-in-cascade stylesheet; no functionality or existing test logic changed. */
:root{--bg:#f7f0e4!important;--ink:#1c2825!important;--muted:#52645c!important;--line:#2a3e36!important;--blue:#167c72!important;--green:#0e7767!important;--pale:#f5e6d1!important;--panel:#fffaf0!important;--shadow:5px 6px 0 #193f39!important;--growth-green:#0d7767!important;--growth-ink:#1c2825!important}
html{scroll-behavior:smooth}
body{background:#f7f0e4!important;color:#1c2825!important;font-family:ui-sans-serif,system-ui,-apple-system,'Segoe UI',Arial,sans-serif}
::selection{background:#ffb0a1;color:#142720}
h1,h2,h3,h4{color:#1c2825;letter-spacing:-.045em;font-weight:850}
.topbar,.sitehead{background:#fff8ea!important;border-bottom:2px solid #193f39!important;box-shadow:none!important;position:relative}
.topbar:before,.sitehead:before{content:'FREE TO USE  /  NO SIGNUP  /  PRIVATE BROWSER TESTS  /  DEVICEDIY';display:block;letter-spacing:.17em;font-size:10px;font-weight:850;color:#fff5e6;background:#172b26;line-height:27px;text-align:center}
.brand,.brand-accent{color:#152d28!important;font-weight:900!important}
.brand-mark{background:#e88b73!important;box-shadow:3px 3px 0 #193f39!important}
.nav-right a,.growth-navlinks a{color:#1c322a!important;font-weight:750!important}
.nav-cta,.navbutton,.btn.primary,.growth-action:not(.secondary){background:#e49a36!important;color:#182923!important;border:2px solid #192f29!important;box-shadow:3px 3px 0 #182f29!important;border-radius:5px!important;font-weight:850!important}
.nav-cta:hover,.btn.primary:hover,.growth-action:not(.secondary):hover{background:#ffc068!important;transform:translate(-1px,-1px)}
.hero{position:relative;isolation:isolate;margin-top:26px!important;margin-bottom:0!important;border:2px solid #243e36!important;border-radius:9px!important;overflow:hidden;background:#f8efdf!important;box-shadow:9px 10px 0 #204c43!important;padding:clamp(26px,5.2vw,70px)!important}
.hero:before{content:''!important;position:absolute!important;inset:0 0 0 54%!important;background:repeating-linear-gradient(0deg,transparent 0 29px,#d5bfa72b 30px 31px),repeating-linear-gradient(90deg,transparent 0 29px,#d5bfa72b 30px 31px)!important;opacity:1!important;mask-image:none!important;pointer-events:none}
.hero:after{content:''!important;position:absolute!important;bottom:0!important;left:0!important;right:0!important;height:12px!important;background:repeating-linear-gradient(90deg,#e9947f 0 20%,#e4a333 20% 40%,#2a796e 40% 60%,#e9947f 60% 80%,#f0d6a9 80% 100%)!important}
.hero-layout{display:grid!important;grid-template-columns:minmax(0,1.03fr) minmax(0,.97fr)!important;gap:clamp(24px,4vw,62px)!important;align-items:center}
.hero-copy{max-width:670px!important}
.hero .eyebrow,.eyebrow{display:inline-flex;background:#f4cd80!important;color:#172c25!important;border:2px solid #213b32!important;border-radius:3px!important;padding:8px 12px!important;font-size:10px!important;letter-spacing:.14em!important}
.hero h1{font-family:Georgia,'Times New Roman',serif!important;font-style:italic!important;font-size:clamp(65px,8vw,118px)!important;line-height:.95!important;letter-spacing:-.072em!important;color:#e47756!important;text-shadow:2px 3px 0 #173c35!important;margin:22px 0 23px!important}
.hero-copy>p,.hero p{font-size:clamp(21px,2.45vw,31px)!important;line-height:1.26!important;color:#1a3b32!important;font-weight:780!important;letter-spacing:-.04em!important}
.hero .features{display:flex!important;gap:8px!important;flex-wrap:wrap!important;justify-content:flex-start!important;margin-top:19px!important}
.hero .features span{background:#e8b2a1!important;border:1.5px solid #24463c!important;color:#15382e!important;border-radius:4px!important;font-weight:850!important;padding:7px 10px!important;font-size:11px!important}
.hero .features span:nth-child(2){background:#f5cb7a!important}.hero .features span:nth-child(3){background:#badac4!important}
.hero-actions{margin-top:27px!important;gap:10px!important;display:flex!important;flex-wrap:wrap!important}
.hero-actions a{border-radius:4px!important;min-height:51px!important;font-weight:850!important;letter-spacing:.01em!important;border:2px solid #1b4036!important;box-shadow:4px 4px 0 #214b40!important}
.hero-actions a:first-child{background:#207a6c!important;color:#fffdf3!important}
.hero-actions a:not(:first-child){background:#fff7ea!important;color:#1d4336!important}
.hero-mini-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:13px!important;transform:rotate(1deg)}
.hero-mini-card{background:#f0c979!important;color:#163e34!important;min-height:142px!important;border:2px solid #1a3e35!important;border-radius:4px!important;box-shadow:5px 6px 0 #1d4f43!important;display:flex!important;align-items:flex-start!important;flex-direction:column!important;padding:19px 16px!important;gap:8px!important;transition:transform .16s ease,box-shadow .16s ease!important}
.hero-mini-card:nth-child(4n+1){background:#ed987f!important}.hero-mini-card:nth-child(4n+2){background:#a1d4b8!important}.hero-mini-card:nth-child(4n+3){background:#f4bd65!important}.hero-mini-card:nth-child(4n){background:#e7b6a9!important}
.hero-mini-card svg{width:32px!important;height:32px!important;stroke:#193e35!important;color:#193e35!important}
.hero-mini-card span{font-size:17px!important;font-weight:900!important;color:#173d34!important;letter-spacing:-.03em!important}
.hero-mini-card i{display:none!important}
.hero-mini-card:hover{transform:translate(2px,2px) rotate(-1deg)!important;box-shadow:2px 3px 0 #1d4f43!important}
/* Big saturated tool-discovery section: distinctly different from the previous design. */
#tools{width:100%!important;max-width:none!important;margin:58px 0 0!important;padding:56px max(28px,calc((100% - 1190px)/2)) 66px!important;background:#287a6d!important;border-top:3px solid #153e34!important;border-bottom:3px solid #153e34!important}
#tools .section-heading{margin:0 0 26px!important}
#tools .section-heading h2{font-family:Georgia,'Times New Roman',serif!important;font-size:clamp(38px,4vw,58px)!important;font-style:italic!important;font-weight:900!important;color:#fff2d9!important;line-height:1.04!important;letter-spacing:-.045em!important}
#tools .section-heading p{color:#e0f0e7!important;font-size:15px!important}
#tools .count{background:#e7ab58!important;color:#193e34!important;border:2px solid #133a30!important;border-radius:3px!important;font-weight:900!important;padding:9px 14px!important}
#tools .cards{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:18px!important;margin:0!important}
.tool-card{min-height:270px!important;background:#efb561!important;border:2px solid #183d35!important;border-radius:4px!important;box-shadow:5px 6px 0 #153f36!important;padding:23px 20px 20px!important;display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:11px!important;transition:transform .18s ease,box-shadow .18s ease!important}
.tool-card:nth-child(4n+1){background:#f2a088!important}.tool-card:nth-child(4n+2){background:#acd3ba!important}.tool-card:nth-child(4n+3){background:#e6ae58!important}.tool-card:nth-child(4n){background:#f2cfc0!important}
.tool-card:hover,.tool-card:focus-visible{transform:translate(2px,2px)!important;box-shadow:2px 3px 0 #143e36!important;border-color:#163b33!important}
.tool-card .iconbox{background:#fff6e8!important;color:#1b5145!important;border:2px solid #225044!important;border-radius:4px!important;width:52px!important;height:52px!important;display:grid!important;place-items:center!important;box-shadow:2px 2px 0 #1d493e!important}
.tool-card .iconbox svg{stroke:#1a5044!important}
.tool-card .tool-title{font-size:19px!important;font-weight:900!important;line-height:1.13!important;letter-spacing:-.04em!important;color:#19392f!important}
.tool-card .tool-desc{font-size:13px!important;line-height:1.5!important;color:#27463a!important;font-weight:500!important}
.tool-card .card-bottom{margin-top:auto!important;font-size:12px!important;letter-spacing:.07em!important;text-transform:uppercase!important;font-weight:900!important;color:#173b32!important;border-bottom:2px solid #173b32!important}
.home-feature{background:#f2d9b1!important;border:2px solid #22483d!important;border-radius:6px!important;box-shadow:7px 8px 0 #214c40!important;margin-top:65px!important;margin-bottom:72px!important;padding:clamp(24px,4vw,55px)!important}
.home-feature h2{font-family:Georgia,'Times New Roman',serif!important;font-style:italic!important;font-weight:900!important;font-size:clamp(36px,4vw,58px)!important;line-height:1.08!important}
.home-feature .section-mini{color:#20766a!important}
.home-feature a{background:#e8947b!important;color:#153a31!important;border:2px solid #174236!important;border-radius:4px!important;box-shadow:3px 4px 0 #174236!important;padding:12px 16px!important;font-weight:850!important;display:inline-flex!important}
.device-visual{background:#173f36!important;border:3px solid #14382f!important;border-radius:5px!important;box-shadow:7px 7px 0 #e69a7e!important}
.why{background:#f0b29d!important;border:2px solid #244338!important;border-radius:5px!important;box-shadow:7px 8px 0 #1d4f43!important;margin-top:25px!important}
.why h2{font-family:Georgia,'Times New Roman',serif!important;font-style:italic!important;font-size:clamp(34px,3.8vw,52px)!important}
.why p,.why-list{color:#263d34!important}
.seo-home,.home-explainer{background:#fff7e8!important;border:2px solid #d8c5a7!important;border-radius:6px!important;padding:clamp(22px,4vw,42px)!important;margin-top:48px!important;margin-bottom:48px!important}
.home-explainer h2,.seo-home h2{color:#1a4f43!important}
.proof-item{background:#f4dbb3!important;border:1.5px solid #b39b75!important;border-radius:3px!important}
.faq-list details{border-color:#d5c1a5!important}
.foot{background:#193f36!important;color:#ffefda!important;border-top:3px solid #edac66!important}
.foot a,.foot p,.foot span{color:#ffefda!important}
/* All 11 test workspaces: warm paper, bolder navigation, and high-contrast interaction regions */
.tester,.q-wrap{margin-top:40px!important}
.tester-head,.q-top,.growth-hero{background:#f6d9b5!important;border:2px solid #285244!important;border-radius:6px!important;padding:clamp(20px,3vw,34px)!important}
.tester-head h1,.tester-head h2,.q-top h1,.growth-hero h1{font-family:Georgia,'Times New Roman',serif!important;font-weight:850!important;font-style:italic!important;color:#1e4c3f!important}
.stage,.instructions,.tool-detail,.q-card,.growth-tool,.growth-content,.growth-diagnostics,.content-card{background:#fffaf0!important;border:2px solid #c7b89c!important;border-radius:6px!important;box-shadow:4px 5px 0 #d9c6a8!important}
.tester-head .iconbox,.growth-tool-icon{background:#ebaa87!important;border:2px solid #285044!important;border-radius:5px!important}
.btn:not(.primary),.growth-action.secondary{border-radius:5px!important}
/* Editorial guides, how-it-works and standalone informational pages */
body:has(.sitehead){background:#f7f0e4!important}
.layout{color:#203b33}
.hubhero,.guidehero{background:#f1d5a8!important;border:2px solid #21483c!important;border-radius:6px!important;box-shadow:7px 7px 0 #205043!important;padding:clamp(25px,4vw,55px)!important}
.hubhero h1,.guidehero h1{font-family:Georgia,'Times New Roman',serif!important;font-weight:900!important;font-style:italic!important;color:#1b4f43!important;letter-spacing:-.055em!important}
.hubgrid{gap:17px!important}
.hubcard,.article-card{background:#f5b694!important;border:2px solid #194539!important;border-radius:5px!important;box-shadow:4px 5px 0 #245245!important}
.hubcard:nth-child(4n+2){background:#b5d8c1!important}.hubcard:nth-child(4n+3){background:#edc478!important}.hubcard:nth-child(4n){background:#edcbc3!important}
.answer,.endcta{background:#e7f0db!important;border:2px solid #b6ceb8!important;border-radius:5px!important}
/* Mobile and accessibility: retains original interactions and layout semantics. */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #c45536!important;outline-offset:3px!important}
@media(max-width:1050px){#tools .cards{grid-template-columns:repeat(3,minmax(0,1fr))!important}.hero h1{font-size:clamp(57px,7vw,92px)!important}}
@media(max-width:800px){.hero-layout{grid-template-columns:1fr!important}.hero{padding:35px 28px!important}.hero-mini-grid{transform:none;grid-template-columns:repeat(3,minmax(0,1fr))!important}.hero-mini-card{min-height:108px!important}.hero:before{inset:0!important;opacity:.18!important}#tools .cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:560px){.shell{width:calc(100% - 28px)!important}.hero{margin-top:16px!important;padding:25px 20px 32px!important;box-shadow:5px 6px 0 #204c43!important}.hero h1{font-size:clamp(52px,15vw,76px)!important;letter-spacing:-.075em!important}.hero-copy>p,.hero p{font-size:21px!important}.hero-mini-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}.hero-mini-card{min-height:105px!important;padding:13px!important;box-shadow:3px 4px 0 #1d4f43!important}.hero-mini-card span{font-size:14px!important}#tools{padding:35px 17px 45px!important;margin-top:42px!important}#tools .cards{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:11px!important}.tool-card{min-height:250px!important;padding:14px 12px!important;box-shadow:3px 4px 0 #153f36!important}.tool-card .tool-title{font-size:16px!important}.tool-card .tool-desc{font-size:12px!important}.tool-card .iconbox{width:43px!important;height:43px!important}#tools .count{font-size:10px!important}.home-feature,.why{box-shadow:4px 5px 0 #214c40!important}.topbar:before,.sitehead:before{font-size:8px;letter-spacing:.08em}.nav{min-height:65px!important}}
@media(max-width:365px){#tools .cards{grid-template-columns:1fr!important}.tool-card{min-height:190px!important}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}


/* === launch-polish.css === */

/* Launch polish: legible testing workspaces, FAQ answers, responsive checklist and navigation. */
.mobile-nav-panel{display:none!important}
.mobile-nav-panel.open{display:flex!important}
@media(min-width:761px){.mobile-nav-panel,.mobile-nav-panel.open{display:none!important}.mobile-nav-toggle{display:none!important}}
@media(max-width:760px){.mobile-nav-panel.open{display:flex!important;flex-direction:column!important;gap:6px!important;padding:14px 20px!important;background:#fff8ea!important;border-bottom:2px solid #193f39!important}.mobile-nav-panel.open a{display:block!important;padding:11px 12px!important;border:1px solid #dacbb5!important;border-radius:4px!important;color:#193d33!important;font-weight:750!important}}
.growth-checklist{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:13px!important;margin:22px 0!important}
.growth-check{display:flex!important;align-items:flex-start!important;gap:13px!important;min-width:0!important;background:#fff7e8!important;border:1.5px solid #c9bba2!important;border-radius:5px!important;padding:15px!important;cursor:pointer!important;line-height:1.5!important}
.growth-check input{flex:0 0 auto!important;width:20px!important;height:20px!important;margin:2px 0 0!important;accent-color:#137c69!important}
.growth-check span{min-width:0!important;display:block!important;overflow-wrap:anywhere!important}
.growth-check strong{display:block!important;font-size:15px!important;color:#194a3d!important;margin-bottom:4px!important}
.growth-check small{display:block!important;color:#4d574c!important;font-size:13px!important;line-height:1.55!important}
.growth-check:has(input:checked){background:#d8f0dd!important;border-color:#338774!important}
.faq-list details{background:#fff9ed!important;overflow:hidden!important;border:1.5px solid #c7b79b!important;border-radius:5px!important}
.faq-list summary{display:list-item!important;font-size:16px!important;font-weight:800!important;padding:18px 20px!important;color:#183d32!important;cursor:pointer!important}
.faq-list details[open] summary{background:#e5ede0!important;border-bottom:1px solid #b7c9af!important}
.faq-list details p{font-size:15px!important;line-height:1.7!important;color:#243b31!important;padding:18px 22px!important;margin:0!important}
.growth-kpi span{overflow-wrap:anywhere!important}
.growth-actions{display:flex!important;flex-wrap:wrap!important;gap:10px!important}
.growth-actions button{min-height:44px!important;white-space:normal!important}
.growth-controller #gpButtonList{display:flex!important;flex-wrap:wrap!important;gap:9px!important;margin:16px 0 22px!important}
.growth-controller #gpButtonList button{min-width:46px!important;padding:11px!important;opacity:1!important;color:#223c33!important;background:#ebdfce!important;border:1px solid #9d9b8a!important;border-radius:4px!important}
.growth-controller #gpButtonList button.active{background:#b1e5ba!important;border-color:#25775d!important;font-weight:800!important}
.growth-chart{max-width:100%!important;height:auto!important;display:block!important}
@media(max-width:760px){.growth-checklist{grid-template-columns:1fr!important}.growth-check{padding:14px!important}.growth-kpis{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))!important}}
@media print{.topbar,.sitehead,.foot,.growth-navlinks,.mobile-nav-toggle{display:none!important}.growth-check{break-inside:avoid!important}body{background:white!important}}


/* === sitewide-layout-fix.css === */
/* DeviceDIY shared sitewide layout repair — 2026-11-04. Loaded last on EVERY page. */
:root{--dd-deep:#172b26;--dd-green:#1d5648;--dd-cream:#fff8ea;--dd-gold:#e49a36}
*,*::before,*::after{box-sizing:border-box}
html{scroll-padding-top:100px}
body{margin:0;min-width:320px}
/* Never let an unstyled inner page fall back to inline logo/navigation. */
.topbar,.sitehead{position:relative!important;width:100%!important;z-index:50!important;background:var(--dd-cream)!important;border-bottom:2px solid var(--dd-deep)!important}
.topbar:before,.sitehead:before{display:block!important;box-sizing:border-box!important;padding:4px 16px!important;min-height:30px!important;line-height:22px!important;white-space:normal!important}
.shell{width:min(1190px,calc(100% - 48px))!important;margin-inline:auto!important}
.topbar .nav,.sitehead .headrow{display:flex!important;align-items:center!important;justify-content:space-between!important;flex-wrap:nowrap!important;gap:24px!important;min-height:86px!important;width:min(1190px,calc(100% - 48px))!important;margin-inline:auto!important;padding:10px 0!important}
.topbar .brand,.sitehead .identity{display:inline-flex!important;align-items:center!important;flex:0 0 auto!important;gap:10px!important;font-family:ui-sans-serif,system-ui,sans-serif!important;font-size:clamp(20px,2vw,25px)!important;line-height:1.15!important;letter-spacing:-.045em!important;font-weight:900!important;text-decoration:none!important;color:var(--dd-deep)!important;white-space:nowrap!important}
.topbar .brand img,.sitehead .identity img{display:block!important;width:40px!important;height:40px!important;object-fit:contain!important;flex:0 0 40px!important}
.topbar .brand-diy,.sitehead .identity b{color:#0b7e68!important}
.topbar .nav-right,.sitehead .headnav{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-end!important;gap:clamp(14px,2.3vw,30px)!important;flex-wrap:nowrap!important;margin-left:auto!important;font-size:14px!important;font-weight:750!important}
.topbar .nav-right>a:not(.nav-cta),.sitehead .headnav>a:not(.navbutton){display:inline-flex!important;align-items:center!important;min-height:44px!important;white-space:nowrap!important;color:var(--dd-deep)!important;text-decoration:none!important;padding:8px 0!important;border:0!important;background:transparent!important;box-shadow:none!important}
.topbar .nav-right>a:not(.nav-cta):hover,.sitehead .headnav>a:not(.navbutton):hover{color:#087e68!important;text-decoration:underline!important;text-underline-offset:5px!important}
.topbar .nav-cta,.sitehead .headnav .navbutton{display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;flex:0 0 auto!important;padding:12px 18px!important;min-height:45px!important;white-space:nowrap!important;border-radius:7px!important;background:var(--dd-gold)!important;border:2px solid var(--dd-deep)!important;box-shadow:3px 4px 0 var(--dd-deep)!important;color:var(--dd-deep)!important;font-size:14px!important;font-weight:850!important;text-decoration:none!important}
.topbar .nav-cta:hover,.sitehead .headnav .navbutton:hover{background:#ffbe61!important;transform:translate(1px,1px)!important;box-shadow:2px 3px 0 var(--dd-deep)!important}
.topbar .mobile-nav-toggle,.sitehead .mobile-menu{display:none!important;flex:0 0 auto!important;align-items:center!important;justify-content:center!important;min-width:46px!important;min-height:46px!important;background:#fff3dc!important;border:2px solid var(--dd-deep)!important;border-radius:7px!important;box-shadow:2px 3px 0 var(--dd-deep)!important;color:var(--dd-deep)!important;font-weight:800!important;font-size:19px!important;cursor:pointer!important}
.topbar .mobile-nav-panel,.sitehead .mobile-links{display:none!important}
/* Consistent gutters and navigation at bottom of ALL tool pages. */
.growth-layout{width:min(1190px,calc(100% - 48px))!important;max-width:1190px!important;margin-inline:auto!important;padding:40px 0 80px!important}
.growth-layout>.growth-toplink{display:inline-flex!important;margin-bottom:18px!important;font-weight:750!important;text-decoration:none!important}
.growth-navlinks{display:flex!important;flex-wrap:wrap!important;gap:10px!important;margin-top:30px!important}
.growth-navlinks a{display:inline-flex!important;align-items:center!important;padding:10px 15px!important;min-height:43px!important;text-decoration:none!important;border:1.5px solid #276252!important;border-radius:5px!important;background:#fdf4e4!important}
.foot,.sitefoot{background:var(--dd-deep)!important;color:#fff3de!important;border-top:3px solid #e9aa64!important}
.foot .foot-inner,.sitefoot .footrow{width:min(1190px,calc(100% - 48px))!important;min-height:90px!important;margin-inline:auto!important;padding:22px 0!important;display:flex!important;align-items:center!important;justify-content:space-between!important;flex-wrap:wrap!important;gap:16px 30px!important}
.foot .footer-links,.sitefoot .footrow>div{display:flex!important;align-items:center!important;flex-wrap:wrap!important;gap:8px 24px!important}
.foot a,.sitefoot a{color:#fff3de!important;text-decoration:none!important;margin:0!important}
.foot a:hover,.sitefoot a:hover{text-decoration:underline!important;text-underline-offset:4px!important}
.foot span,.sitefoot span{color:#fff3de!important}
@media(max-width:850px){
 .topbar .nav-right,.sitehead .headnav{display:none!important}
 .topbar .mobile-nav-toggle,.sitehead .mobile-menu{display:inline-flex!important;margin-left:auto!important}
 .topbar .mobile-nav-panel.open,.sitehead .mobile-links.open{display:flex!important;position:relative!important;width:min(1190px,calc(100% - 48px))!important;margin:0 auto 14px!important;padding:10px!important;flex-direction:column!important;align-items:stretch!important;gap:2px!important;background:#fff7e8!important;border:2px solid var(--dd-deep)!important;border-radius:7px!important}
 .topbar .mobile-nav-panel.open a,.sitehead .mobile-links.open a{display:block!important;min-height:46px!important;padding:12px 15px!important;color:var(--dd-deep)!important;text-decoration:none!important;font-weight:750!important;border:0!important;border-bottom:1px solid #decbb0!important}
 .topbar .mobile-nav-panel.open a:last-child,.sitehead .mobile-links.open a:last-child{border-bottom:0!important}
}
@media(max-width:560px){
 .topbar .nav,.sitehead .headrow{width:calc(100% - 30px)!important;min-height:72px!important;gap:12px!important}
 .topbar .brand,.sitehead .identity{font-size:21px!important;gap:8px!important}
 .topbar .brand img,.sitehead .identity img{width:36px!important;height:36px!important;flex-basis:36px!important}
 .topbar .mobile-nav-panel.open,.sitehead .mobile-links.open{width:calc(100% - 30px)!important}
 .topbar:before,.sitehead:before{font-size:8px!important;letter-spacing:.06em!important;line-height:1.4!important;min-height:auto!important;padding:7px 12px!important}
 .growth-layout{width:calc(100% - 30px)!important;padding:24px 0 55px!important}
 .foot .foot-inner,.sitefoot .footrow{width:calc(100% - 30px)!important;flex-direction:column!important;align-items:flex-start!important}
 .growth-navlinks a{font-size:12px!important}
}
@media print{.topbar,.sitehead,.foot,.sitefoot{display:none!important}}