:root{--bg:#05060f;--panel:#0b1020;--panel2:#0f172a;--ink:#f4f7fb;--muted:#98a2b3;--line:rgba(255,255,255,.12);--accent:#00e5ff;--pink:#ff4074;--soft:#f3f6fb;--dark:#08111f}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:'DM Sans',system-ui,-apple-system,Segoe UI,sans-serif;background:var(--bg);color:var(--ink)}a{color:inherit}.site-nav{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:22px;padding:18px clamp(20px,5vw,72px);background:rgba(5,6,15,.86);backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-family:'Saira Condensed',sans-serif;font-weight:900;font-size:28px;letter-spacing:.01em}.brand-mark{width:34px;height:34px;border:2px solid var(--accent);border-radius:10px;display:grid;place-items:center;box-shadow:0 0 28px rgba(0,229,255,.22);transform:rotate(45deg)}.brand-mark span{transform:rotate(-45deg);font-size:17px;color:var(--accent)}.brand b{color:#fff}.brand em{font-style:normal;color:var(--accent)}.nav-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.nav-actions a{font-size:15px;text-decoration:none;padding:10px 16px;border-radius:999px;border:1px solid var(--line);color:#dbe4f0}.nav-actions a.primary{border-color:rgba(0,229,255,.55);background:rgba(0,229,255,.1);color:#fff}.page{min-height:100vh}.hero{position:relative;overflow:hidden;padding:86px clamp(20px,5vw,72px) 58px;background:radial-gradient(circle at 20% 10%,rgba(0,229,255,.18),transparent 34%),radial-gradient(circle at 80% 5%,rgba(255,64,116,.15),transparent 30%)}.hero-grid{max-width:1180px;margin:0 auto;display:grid;grid-template-columns:1.1fr .9fr;gap:42px;align-items:center}.kicker{display:inline-flex;align-items:center;gap:10px;text-transform:uppercase;letter-spacing:.18em;font-weight:800;color:var(--accent);font-size:13px}.hero h1,.page-title{font-family:'Saira Condensed',sans-serif;font-weight:900;line-height:.95;margin:18px 0;font-size:clamp(56px,10vw,128px);letter-spacing:-.03em}.hero p{font-size:clamp(18px,2.1vw,24px);line-height:1.55;color:#cbd5e1;max-width:720px}.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.btn{appearance:none;border:0;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;padding:15px 22px;font-weight:900;background:linear-gradient(135deg,var(--accent),#53f0ff);color:#021019;box-shadow:0 16px 45px rgba(0,229,255,.22)}.btn.ghost{background:transparent;color:#eaf4ff;border:1px solid var(--line);box-shadow:none}.hero-card{border:1px solid var(--line);border-radius:32px;background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.03));padding:24px;box-shadow:0 30px 100px rgba(0,0,0,.35)}.project-preview{display:grid;gap:13px}.preview-row{display:flex;align-items:center;gap:13px;border:1px solid var(--line);background:rgba(255,255,255,.04);border-radius:18px;padding:15px}.preview-row strong{display:block}.preview-row small{color:var(--muted)}.section{padding:52px clamp(20px,5vw,72px)}.section-inner{max-width:1180px;margin:0 auto}.section h2{font-family:'Saira Condensed',sans-serif;font-size:clamp(36px,6vw,70px);line-height:1;margin:0 0 16px}.muted{color:var(--muted);line-height:1.55}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:28px}.step,.card{border:1px solid var(--line);border-radius:24px;background:rgba(255,255,255,.045);padding:22px}.step-num{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:rgba(0,229,255,.13);color:var(--accent);font-weight:900;margin-bottom:12px}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.card h3,.step h3{margin:0 0 8px}.footer{padding:36px clamp(20px,5vw,72px);border-top:1px solid var(--line);color:var(--muted)}.light-shell{background:#eef2f7;color:#0b1020;min-height:100vh}.light-shell .site-nav{background:#fff;color:#0b1020}.light-shell .nav-actions a{color:#0b1020;border-color:#d8dee8}.light-shell .nav-actions a.primary{background:#071225;color:#fff;border-color:#071225}.form-wrap{max-width:860px;margin:0 auto;padding:56px 20px}.form-card{background:#fff;border:1px solid #dfe5ef;border-radius:32px;padding:clamp(24px,5vw,48px);box-shadow:0 24px 80px rgba(15,23,42,.08)}.form-card h1{font-family:'Saira Condensed',sans-serif;font-size:clamp(48px,9vw,90px);line-height:.95;margin:0 0 18px}.form-card p{font-size:19px;line-height:1.55;color:#667085}.field{display:block;width:100%;border:1px solid #d7deea;border-radius:20px;padding:18px 20px;font:inherit;font-size:18px;margin:12px 0;background:#fff;color:#0b1020}.status{margin-top:16px;font-weight:700}.status.err{color:#b42318}.status.ok{color:#027a48}.workspace{min-height:100vh;background:#f4f7fb;color:#101828}.workspace-layout{display:grid;grid-template-columns:270px 1fr;min-height:100vh}.sidebar{background:#071225;color:#eaf4ff;padding:24px;border-right:1px solid rgba(255,255,255,.1)}.side-brand{margin-bottom:32px}.side-link{display:flex;align-items:center;gap:10px;padding:13px 14px;border-radius:14px;color:#cbd5e1;text-decoration:none;margin:4px 0}.side-link.active,.side-link:hover{background:rgba(0,229,255,.12);color:#fff}.main{padding:32px clamp(18px,4vw,48px)}.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px;gap:16px}.topbar h1{font-family:'Saira Condensed',sans-serif;font-size:54px;line-height:1;margin:0}.workspace-card{background:#fff;border:1px solid #e2e8f0;border-radius:28px;padding:24px;box-shadow:0 14px 40px rgba(15,23,42,.05)}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:18px}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.project-card{display:flex;justify-content:space-between;gap:18px;align-items:center}.tag{display:inline-flex;border-radius:999px;padding:7px 12px;background:#eefbff;color:#036b7a;font-weight:900;font-size:13px}.progress{height:10px;background:#e5e7eb;border-radius:999px;overflow:hidden;margin-top:12px}.progress span{display:block;height:100%;background:linear-gradient(90deg,var(--accent),var(--pink));width:32%}.property-form{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.property-form textarea{grid-column:1/-1;min-height:110px}.output{white-space:pre-wrap;line-height:1.55}.output-block{border:1px solid #e5e7eb;border-radius:18px;padding:16px;margin-top:12px;background:#fbfdff}.hidden{display:none!important}@media(max-width:820px){.hero-grid,.workspace-layout,.grid-2,.grid-3,.cards,.steps{grid-template-columns:1fr}.site-nav{position:relative;align-items:flex-start}.nav-actions{justify-content:flex-start}.hero{padding-top:50px}.sidebar{position:relative}.workspace-layout{display:block}.property-form{grid-template-columns:1fr}.topbar{align-items:flex-start;flex-direction:column}.brand{font-size:24px}.nav-actions a{padding:9px 12px;font-size:14px}.section{padding:38px 20px}.hero h1,.page-title{font-size:62px}.hero-card{display:none}}

/* Dappiehub Engine V1 additions */
.dh-section{display:block}.compact-card h2{font-family:'Saira Condensed',sans-serif;font-size:58px;line-height:1;margin:10px 0}.empty-state{margin-top:12px}.project-row{display:flex;justify-content:space-between;align-items:center;gap:18px}.project-actions{display:flex;gap:10px;flex-wrap:wrap}.dark-ghost{color:#0b1020!important;border-color:#d6dbe6!important}.form-actions{grid-column:1/-1;display:flex;gap:12px;flex-wrap:wrap;align-items:center}.modal{position:fixed;inset:0;z-index:100;background:rgba(5,6,15,.72);backdrop-filter:blur(10px);display:flex;align-items:flex-start;justify-content:center;padding:28px 16px;overflow:auto}.modal-panel{position:relative;width:min(1180px,100%);background:#fff;color:#101828;border-radius:30px;padding:clamp(20px,4vw,34px);box-shadow:0 34px 120px rgba(0,0,0,.35)}.modal-panel h2{font-family:'Saira Condensed',sans-serif;font-size:clamp(42px,6vw,72px);line-height:.96;margin:12px 0}.modal-close{position:absolute;right:18px;top:16px;width:42px;height:42px;border-radius:999px;border:1px solid #dde3ee;background:#fff;font-size:28px;line-height:1;cursor:pointer}.project-modal-grid{display:grid;grid-template-columns:minmax(320px,.78fr) minmax(360px,1fr);gap:22px;align-items:start}.pack-view{max-height:72vh;overflow:auto;padding-right:6px}.pack-header{position:sticky;top:0;background:#fff;padding-bottom:10px;border-bottom:1px solid #e5e7eb;z-index:2}.pack-header h2{font-size:44px}.output-block h4{margin:14px 0 6px}.output-block ul{margin:10px 0 0 20px;line-height:1.6}.output-block pre{font-family:'DM Sans',system-ui,sans-serif;background:#f7fafc;border-radius:14px;padding:14px;overflow:auto}.sidebar .side-link{font-weight:800}.workspace-card h2{font-family:'Saira Condensed',sans-serif;font-size:42px;line-height:1;margin:8px 0}.property-form .field{margin:0}.property-form{margin-top:14px}.btn[disabled]{opacity:.58;cursor:not-allowed}@media(max-width:960px){.project-modal-grid{grid-template-columns:1fr}.pack-view{max-height:none}.project-row{align-items:flex-start;flex-direction:column}.modal{padding:12px}.modal-panel{border-radius:22px}}

.brand-wordmark{font-family:'Saira Condensed',sans-serif;font-weight:900;letter-spacing:.01em;color:#fff}.light-shell .brand-wordmark{color:#071225}.brand-wordmark em{font-style:normal;color:var(--accent)}

/* Sprint 2 brand/auth fixes */
.brand{min-height:54px}
.brand-logo{display:block;height:56px;width:56px;max-width:56px;object-fit:cover;border-radius:14px;background:#05060f}
.side-brand{display:flex;margin-bottom:32px}.side-logo{height:64px;max-width:64px}
.light-shell{background:radial-gradient(circle at 18% 0%,rgba(0,229,255,.16),transparent 34%),#05060f;color:#f4f7fb;min-height:100vh}
.light-shell .site-nav{background:rgba(5,6,15,.92)!important;color:#f4f7fb!important;border-bottom:1px solid rgba(255,255,255,.12)}
.light-shell .nav-actions a{color:#dbe4f0!important;border-color:rgba(255,255,255,.16)!important}.light-shell .nav-actions a.primary{background:rgba(0,229,255,.12)!important;color:#fff!important;border-color:rgba(0,229,255,.45)!important}
.light-shell .form-card{background:#fff;color:#0b1020}.light-shell .form-card .kicker{color:#036b7a}
.status{min-height:22px}.status.err{color:#b42318}.status.ok{color:#027a48}
@media(max-width:820px){.brand-logo{height:48px!important;width:48px!important;max-width:48px!important}.side-logo{height:56px;max-width:56px}.brand{min-height:48px}}


/* Mobile brand stability hotfix */
.site-nav{background:#05060f!important;color:#f4f7fb!important;min-height:76px;overflow:hidden}
.brand{flex:0 0 auto;max-width:220px;overflow:hidden}
.brand-lockup{display:inline-flex;align-items:center;gap:10px;text-decoration:none;line-height:1;white-space:nowrap;max-width:220px}
.brand-icon{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:radial-gradient(circle,rgba(0,229,255,.95),rgba(0,229,255,.28));box-shadow:0 0 28px rgba(0,229,255,.25);position:relative;flex:0 0 34px}
.brand-icon span{width:13px;height:13px;border-radius:999px;background:#00e5ff;box-shadow:0 -14px 0 -3px #00e5ff,0 14px 0 -3px #00e5ff,14px 0 0 -3px #70f4ff,-14px 0 0 -3px #70f4ff}
.brand-text{font-family:'Saira Condensed',system-ui,sans-serif;font-weight:900;font-size:31px;letter-spacing:-.02em;color:#fff}.brand-text b{color:#f4f7fb}.brand-text em{font-style:normal;color:#00e5ff}
.brand-logo{display:block!important;height:56px!important;width:56px!important;max-width:56px!important;object-fit:cover!important;border-radius:14px!important;background:#05060f!important;box-shadow:0 0 28px rgba(0,229,255,.14)!important}
.side-brand{max-width:220px}.sidebar .brand-text{font-size:34px}.sidebar .brand-icon{width:38px;height:38px;flex-basis:38px}
@media(max-width:820px){.site-nav{position:relative!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:10px!important;padding:14px 16px!important;min-height:70px!important}.brand{max-width:180px!important;min-height:40px!important}.brand-lockup{max-width:180px!important;gap:8px!important}.brand-text{font-size:28px!important}.brand-icon{width:30px!important;height:30px!important;flex-basis:30px!important}.nav-actions{gap:6px!important}.nav-actions a{font-size:13px!important;padding:8px 10px!important}.hero{padding-top:44px!important}}


/* Sprint 4.2.1 logo wordmark restore - use the real Dappiehub wordmark, not a cropped icon */
.site-nav{background:#05060f!important;color:#f4f7fb!important;min-height:86px!important;overflow:visible!important}
.brand{display:flex!important;align-items:center!important;min-height:54px!important;max-width:260px!important;overflow:visible!important}
.brand-logo{display:block!important;width:220px!important;height:auto!important;max-width:220px!important;object-fit:contain!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.side-brand .brand-logo,.sidebar .brand-logo{width:190px!important;max-width:190px!important;height:auto!important}
.light-shell .site-nav{background:#05060f!important;color:#f4f7fb!important}
@media(max-width:820px){.site-nav{min-height:76px!important;padding:12px 14px!important}.brand{max-width:170px!important;min-height:48px!important}.brand-logo{width:165px!important;max-width:165px!important;height:auto!important}.side-brand .brand-logo,.sidebar .brand-logo{width:165px!important;max-width:165px!important;height:auto!important}.nav-actions{gap:5px!important}.nav-actions a{font-size:12px!important;padding:8px 9px!important}}

/* Dappiehub V1.0 brand lock — never crop the wordmark */
.site-nav{overflow:visible!important;align-items:center!important;gap:18px!important}
.site-nav .brand{flex:0 0 auto!important;max-width:none!important;overflow:visible!important;min-width:0!important}
.site-nav .brand-logo{display:block!important;width:220px!important;max-width:220px!important;height:auto!important;object-fit:contain!important;object-position:left center!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
@media(max-width:820px){
  .site-nav{position:sticky!important;top:0!important;min-height:72px!important;padding:12px 16px!important;justify-content:space-between!important;flex-wrap:nowrap!important;overflow:visible!important}
  .site-nav .brand{width:auto!important;max-width:176px!important;overflow:visible!important;flex:0 0 auto!important}
  .site-nav .brand-logo{width:170px!important;max-width:170px!important;height:auto!important;object-fit:contain!important}
  .site-nav .nav-actions{flex:0 0 auto!important;gap:0!important;display:flex!important;flex-wrap:nowrap!important}
  .site-nav .nav-actions a{display:none!important}
  .site-nav .nav-actions a[href='/login/']{display:inline-flex!important;font-size:14px!important;padding:9px 13px!important;border-radius:999px!important}
  .hero{padding-top:48px!important}
}

/* ===== Dappiehub V1.0 Brand System — DappiehubLogo component =====
   The wordmark image is the only permitted logo rendering.
   Never cropped, never CSS text, always clickable, legible on mobile. */
.dh-logo-link{display:inline-flex;align-items:center;flex:0 1 auto;min-width:0;max-width:100%;text-decoration:none;line-height:0}
.dh-logo{display:block;width:190px;max-width:min(52vw,190px);height:auto;object-fit:contain}
.dh-logo-pad{background:linear-gradient(135deg,#05060f,#0a1426);border-radius:14px;padding:8px 14px;box-shadow:0 6px 22px rgba(2,8,23,.25)}
@media(max-width:480px){.dh-logo{width:158px}}

/* Public mobile header: logo left, Login right, hamburger for the rest. */
.dh-menu-btn{display:none}
@media(max-width:760px){
  .site-nav{flex-wrap:nowrap;gap:10px}
  .site-nav .nav-actions{gap:8px;flex-wrap:nowrap}
  .site-nav .nav-actions a{display:none;padding:9px 13px;font-size:14px}
  .site-nav .nav-actions a[href='/login/'],
  .site-nav .nav-actions a.primary{display:inline-flex}
  .dh-menu-btn{display:inline-flex;flex-direction:column;justify-content:center;gap:4px;width:42px;height:40px;border:1px solid var(--line);border-radius:12px;background:rgba(255,255,255,.05);cursor:pointer;align-items:center;padding:0;flex:0 0 auto}
  .dh-menu-btn span{display:block;width:17px;height:2px;border-radius:2px;background:#dbe4f0}
  .light-shell .dh-menu-btn{background:#f1f4f9}
  .light-shell .dh-menu-btn span{background:#0b1020}
  .site-nav.dh-menu-open .nav-actions{position:absolute;top:calc(100% + 1px);right:0;left:0;display:grid;gap:6px;padding:14px clamp(16px,5vw,28px) 18px;background:rgba(5,6,15,.97);border-bottom:1px solid var(--line)}
  .light-shell .site-nav.dh-menu-open .nav-actions{background:#fff;border-bottom:1px solid #e3e8f1}
  .site-nav.dh-menu-open .nav-actions a{display:flex;justify-content:center}
}

/* ===== Homepage V2 — "One workspace. Endless possibilities." =====
   Multi-vertical hub: Estate Agents (live) + Content Creators /
   Small Businesses / Digital Entrepreneurs (early access). Built on
   the existing dark/cyan token system — no new global colours except
   two extra family accents already used in the comparison data. */
:root{--amber:#f59e0b;--purple:#8b5cf6}

.grad{background:linear-gradient(120deg,var(--accent),var(--purple));-webkit-background-clip:text;background-clip:text;color:transparent}

.hero-center{max-width:820px;margin:0 auto;text-align:center}
.hero-center p{margin:14px auto 0}
.hero-center .cta-row{justify-content:center}

.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-weight:800;color:var(--accent);font-size:13px}
.section-head{max-width:760px;margin:0 auto 36px;text-align:center}
.section-head .eyebrow{justify-content:center;display:flex}
.section-head h2{margin:10px 0 14px}
.section-head p{font-size:18px;color:var(--muted);line-height:1.6;margin:0}

/* ---------- Vertical cards ---------- */
.vertical-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:8px}
.vertical-card{border:1px solid var(--line);border-radius:28px;background:rgba(255,255,255,.045);padding:26px;display:flex;flex-direction:column;gap:14px;position:relative;overflow:hidden;text-decoration:none}
.vertical-card:before{content:"";position:absolute;inset:0;background:linear-gradient(160deg,var(--v-accent,var(--accent)) 0%,transparent 38%);opacity:.10;pointer-events:none}
.vertical-icon{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;font-size:22px;background:rgba(255,255,255,.07);border:1px solid var(--line)}
.vertical-eyebrow{text-transform:uppercase;letter-spacing:.16em;font-size:12px;font-weight:800;color:var(--v-accent,var(--accent))}
.vertical-card h3{font-family:'Saira Condensed',sans-serif;font-weight:900;font-size:clamp(26px,3.4vw,34px);line-height:1.05;margin:4px 0 0;letter-spacing:-.02em;color:#fff}
.vertical-card p{color:#cbd5e1;line-height:1.6;margin:0;font-size:15px}
.vertical-visual{border-radius:18px;overflow:hidden;border:1px solid var(--line);background:rgba(255,255,255,.03);margin-top:auto}
.vertical-cta{font-weight:900;color:var(--v-accent,var(--accent));display:inline-flex;align-items:center;gap:6px;font-size:15px}

/* Estate Agents — live property page preview (matches public /p/ page styling) */
.v-live{background:linear-gradient(160deg,#0b1020,#05060f)}
.v-live-bar{display:flex;align-items:center;gap:8px;padding:11px 14px;border-bottom:1px solid var(--line);font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
.v-live-dot{width:8px;height:8px;border-radius:999px;background:var(--accent);box-shadow:0 0 0 4px rgba(0,229,255,.18)}
.v-live-body{padding:16px 14px 18px}
.v-live-kicker{text-transform:uppercase;letter-spacing:.16em;font-size:11px;color:var(--muted);font-weight:800}
.v-live-title{font-family:'Saira Condensed',sans-serif;font-size:22px;font-weight:900;color:#fff;margin:4px 0;letter-spacing:-.02em}
.v-live-price{color:var(--accent);font-weight:900;font-size:18px;margin-bottom:10px}
.v-live-tags{display:flex;gap:8px;flex-wrap:wrap}
.v-live-tags span{border:1px solid var(--line);border-radius:999px;padding:4px 10px;font-size:11px;color:#cbd5e1;font-weight:800}

/* Early-access verticals — abstract previews, never imply they're live */
.v-preview{padding:18px;position:relative}
.v-preview .chip-soon{position:absolute;top:14px;right:14px;background:rgba(255,255,255,.08);border:1px solid var(--line);color:var(--muted);font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;border-radius:999px;padding:5px 10px}
.v-preview-bars{display:grid;gap:8px;margin-top:6px;max-width:80%}
.v-preview-bars span{display:block;height:9px;border-radius:999px;background:rgba(255,255,255,.09)}
.v-preview-bars span:nth-child(1){width:100%}
.v-preview-bars span:nth-child(2){width:72%}
.v-preview-bars span:nth-child(3){width:84%}
.v-preview-blocks{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:14px}
.v-preview-blocks span{display:block;aspect-ratio:1;border-radius:10px;background:rgba(255,255,255,.07)}
.v-preview-hero{height:54px;border-radius:10px;background:linear-gradient(135deg,rgba(255,255,255,.1),rgba(255,255,255,.03));margin-top:6px}
.v-preview-cta{width:88px;height:26px;border-radius:999px;background:var(--v-accent,var(--accent));opacity:.35;margin-top:12px}
.v-preview-docs{display:grid;gap:8px;margin-top:6px}
.v-preview-docs span{display:flex;align-items:center;gap:10px;height:34px;border-radius:10px;background:rgba(255,255,255,.05);border:1px solid var(--line);padding:0 12px;color:#dbe4f0;font-size:12px;font-weight:800}

/* ---------- Workspace preview band ---------- */
.preview-band{margin-top:8px}
.wp-shell{border:1px solid var(--line);border-radius:28px;overflow:hidden;display:grid;grid-template-columns:208px 1fr;background:#0b1020;box-shadow:0 30px 100px rgba(0,0,0,.4);text-decoration:none}
.wp-sidebar{background:linear-gradient(180deg,#05060f,#0a1426 60%,#05060f);padding:22px 16px;display:flex;flex-direction:column;gap:6px}
.wp-sidebar img{width:120px;height:auto;margin:2px 6px 16px}
.wp-nav-item{display:flex;align-items:center;gap:10px;color:#aebbd1;font-weight:800;font-size:13px;padding:9px 10px;border-radius:10px}
.wp-nav-item.active{background:rgba(0,229,255,.14);color:#fff}
.wp-main{background:#f6f7fb;color:#0b1020;padding:26px}
.wp-main h3{font-family:'Saira Condensed',sans-serif;font-weight:900;font-size:30px;margin:0 0 4px;letter-spacing:-.03em}
.wp-main>p{margin:0 0 18px;color:#667085;font-weight:700;font-size:14px}
.wp-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.wp-card{background:#fff;border:1px solid #e6e9f2;border-radius:16px;overflow:hidden}
.wp-card-img{height:74px;background:linear-gradient(135deg,rgba(0,229,255,.22),rgba(139,92,246,.18));display:grid;place-items:center;font-size:26px}
.wp-card-soon{height:74px;display:grid;place-items:center;font-size:24px;background:#eef2f7}
.wp-card-body{padding:10px 12px}
.wp-card-body b{display:block;font-size:13px;color:#0b1020}
.wp-card-body small{color:#98a2b3;font-size:11px}

/* ---------- Final CTA band ---------- */
.cta-band{border-radius:32px;border:1px solid var(--line);padding:clamp(40px,8vw,72px) clamp(20px,6vw,80px);text-align:center;background:radial-gradient(circle at 50% 0%,rgba(0,229,255,.16),transparent 55%),rgba(255,255,255,.03)}
.cta-band .eyebrow{justify-content:center;display:flex;margin-bottom:10px}
.cta-band h2{margin:0 0 12px}
.cta-band p{color:var(--muted);font-size:18px;margin:0 0 26px}
.cta-band small{display:block;margin-top:16px;color:var(--muted)}

@media(max-width:860px){
  .vertical-grid{grid-template-columns:1fr}
  .wp-shell{grid-template-columns:1fr}
  .wp-sidebar{display:none}
  .wp-cards{grid-template-columns:1fr}
  .section-head p{font-size:16px}
}

/* ===== Tools comparison hub — /tools and /tools/:id =====
   Family colour pairs (from the existing comparison data) drive a
   subtle per-page accent via --fam1/--fam2, so each review still sits
   on the same dark/cyan brand but reads as part of its category. */

/* ---------- Tool review page ---------- */
.tool-hero{padding:56px clamp(20px,5vw,72px) 36px;position:relative;overflow:hidden}
.tool-hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 16% 0%,var(--fam1,var(--accent)) 0%,transparent 38%),radial-gradient(circle at 88% 8%,var(--fam2,var(--pink)) 0%,transparent 32%);opacity:.16;pointer-events:none}
.tool-hero-inner{position:relative;max-width:1180px;margin:0 auto}
.tool-breadcrumb{font-size:13px;color:var(--muted);margin-bottom:18px}
.tool-breadcrumb a{color:var(--muted);text-decoration:none}
.tool-breadcrumb a:hover{color:var(--accent)}
.tool-meta-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.tool-logo{width:56px;height:56px;border-radius:14px;object-fit:contain;background:rgba(255,255,255,.07);border:1px solid var(--line);padding:7px}
.tool-score{display:inline-flex;align-items:baseline;gap:5px;font-family:'Saira Condensed',sans-serif;font-weight:900;font-size:28px;color:var(--fam1,var(--accent))}
.tool-score small{font-size:13px;color:var(--muted);font-weight:700}
.tool-hero h1{margin:6px 0 12px}
.tool-tagline{font-size:clamp(18px,2.2vw,24px);color:#cbd5e1;max-width:760px;line-height:1.5;margin:0}
.tool-cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}

.tool-body{max-width:1180px;margin:0 auto;padding:0 clamp(20px,5vw,72px) 80px;display:grid;grid-template-columns:1fr 320px;gap:32px}
.tool-main{display:grid;gap:36px;min-width:0}
.tool-side{display:grid;gap:20px;align-self:start;position:sticky;top:90px}

.tool-section h2{font-family:'Saira Condensed',sans-serif;font-weight:900;font-size:clamp(26px,3.4vw,38px);margin:0 0 14px;letter-spacing:-.02em}
.tool-overview p{color:#cbd5e1;line-height:1.7;margin:0 0 14px}
.tool-verdict{border:1px solid var(--line);border-left:4px solid var(--fam1,var(--accent));border-radius:18px;padding:20px 22px;background:rgba(255,255,255,.04)}
.tool-verdict .tag{margin-bottom:8px}
.tool-verdict p{margin:8px 0 0;color:#cbd5e1;line-height:1.65}
.tool-verdict .best{margin-top:10px;font-weight:800;color:#fff}

.score-group{margin-bottom:22px}
.score-group h3{margin:0 0 12px;font-size:15px;color:var(--muted);text-transform:uppercase;letter-spacing:.1em;font-weight:800}
.score-bars{display:grid;gap:10px}
.score-bar-row{display:grid;grid-template-columns:148px 1fr 38px;gap:12px;align-items:center;font-size:13px;font-weight:800;color:#dbe4f0}
.score-bar-track{height:8px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}
.score-bar-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--fam1,var(--accent)),var(--fam2,var(--pink)))}
.score-bar-row span:last-child{color:var(--muted);text-align:right}

.tool-feature-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.tool-feature{border:1px solid var(--line);border-radius:18px;padding:16px;background:rgba(255,255,255,.04)}
.tool-feature .ic{font-size:22px;margin-bottom:8px;display:block}
.tool-feature h4{margin:0 0 4px;font-size:15px;color:#fff}
.tool-feature p{margin:0;color:var(--muted);font-size:13px;line-height:1.5}

.tool-pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.price-card{border:1px solid var(--line);border-radius:20px;padding:20px;background:rgba(255,255,255,.04);position:relative}
.price-card.feat{border-color:var(--fam1,var(--accent))}
.price-card .pbadge{position:absolute;top:-11px;right:16px;background:var(--fam1,var(--accent));color:#021019;font-size:11px;font-weight:900;padding:4px 10px;border-radius:999px}
.price-card h4{margin:0 0 4px;color:#fff}
.price-amount{font-family:'Saira Condensed',sans-serif;font-size:32px;font-weight:900;margin:6px 0;color:#fff}
.price-amount small{font-size:13px;color:var(--muted);font-weight:700}
.price-card ul{margin:12px 0 0;padding-left:18px;color:#cbd5e1;font-size:13px;line-height:1.7}

.pros-cons{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.pros-cons h3{margin:0 0 10px;font-size:15px;color:#fff}
.pros-cons ul{margin:0;padding-left:18px;line-height:1.8;font-size:14px;color:#cbd5e1}
.pros-cons .pros li::marker{color:#22c55e}
.pros-cons .cons li::marker{color:#ff4074}

.compare-table{width:100%;border-collapse:collapse;font-size:14px}
.compare-table th,.compare-table td{border-bottom:1px solid var(--line);padding:10px 8px;text-align:left;color:#dbe4f0}
.compare-table th{color:var(--muted);font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.06em}

.usecase-chips{display:flex;gap:8px;flex-wrap:wrap}
.usecase-chips span{border:1px solid var(--line);border-radius:999px;padding:8px 14px;font-size:13px;font-weight:800;color:#dbe4f0;background:rgba(255,255,255,.04)}

.facts-card{border:1px solid var(--line);border-radius:18px;padding:18px;background:rgba(255,255,255,.04)}
.facts-card h3{margin:0 0 12px;font-size:14px;color:var(--muted);text-transform:uppercase;letter-spacing:.1em;font-weight:800}
.facts-list{display:grid;gap:9px}
.facts-list .fact{display:flex;justify-content:space-between;gap:10px;font-size:13px;border-bottom:1px solid var(--line);padding-bottom:8px;color:#cbd5e1}
.facts-list .fact:last-child{border-bottom:0;padding-bottom:0}
.facts-list .fact b{color:#fff;text-align:right;font-weight:800}

.similar-card{border:1px solid var(--line);border-radius:16px;padding:12px;background:rgba(255,255,255,.04);text-decoration:none;color:inherit;display:flex;gap:10px;align-items:center}
.similar-card+.similar-card{margin-top:10px}
.similar-card img{width:30px;height:30px;border-radius:8px;object-fit:contain;background:rgba(255,255,255,.06);flex:0 0 30px}
.similar-card b{display:block;font-size:13px;color:#fff}
.similar-card small{color:var(--muted);font-size:12px}

.verified-note{color:var(--muted);font-size:13px;border-top:1px solid var(--line);padding-top:16px}
.verified-note a{color:var(--accent);text-decoration:none}

@media(max-width:900px){
  .tool-body{grid-template-columns:1fr}
  .tool-side{position:static}
  .tool-feature-grid,.tool-pricing-grid,.pros-cons{grid-template-columns:1fr}
  .score-bar-row{grid-template-columns:120px 1fr 34px}
}

/* ---------- /tools hub ---------- */
.th-hero{padding:64px clamp(20px,5vw,72px) 28px;text-align:center}
.th-hero h1{margin:14px 0}
.th-hero p{max-width:680px;margin:0 auto;font-size:18px;color:var(--muted);line-height:1.6}
.th-filters{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin:28px 0 0;max-width:980px;margin-left:auto;margin-right:auto}
.th-filter{border:1px solid var(--line);background:rgba(255,255,255,.04);color:#dbe4f0;border-radius:999px;padding:8px 16px;font:inherit;font-weight:800;font-size:13px;cursor:pointer}
.th-filter.active{background:var(--accent);color:#021019;border-color:var(--accent)}
.th-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.th-card{border:1px solid var(--line);border-radius:20px;padding:18px;background:rgba(255,255,255,.045);text-decoration:none;color:inherit;display:flex;flex-direction:column;gap:8px;position:relative;overflow:hidden}
.th-card:before{content:"";position:absolute;inset:0;background:linear-gradient(150deg,var(--fam1,var(--accent)) 0%,transparent 45%);opacity:.10;pointer-events:none}
.th-card-top{display:flex;align-items:center;justify-content:space-between;gap:10px;position:relative}
.th-emoji{font-size:26px}
.th-score{font-family:'Saira Condensed',sans-serif;font-weight:900;font-size:18px;color:var(--fam1,var(--accent))}
.th-card h3{margin:2px 0 0;font-size:18px;color:#fff;position:relative}
.th-family{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);font-weight:800;position:relative}
.th-card p{margin:0;color:#cbd5e1;font-size:13px;line-height:1.5;position:relative}
.th-radar{margin-top:64px}
.th-radar-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}
.th-radar-card{border:1px solid var(--line);border-radius:18px;padding:16px;background:rgba(255,255,255,.04)}
.th-radar-card h4{margin:0 0 4px;font-size:15px;color:#fff}
.th-radar-card p{margin:0 0 8px;color:var(--muted);font-size:13px;line-height:1.5}
.th-radar-card a{color:var(--accent);font-weight:800;font-size:13px;text-decoration:none}
.th-watch-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:18px}
.th-watch-card{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:14px;padding:11px 13px;background:rgba(255,255,255,.03);text-decoration:none;color:inherit}
.th-watch-card:hover{border-color:var(--accent)}
.th-watch-emoji{font-size:18px;flex:0 0 auto}
.th-watch-card b{display:block;font-size:13px;color:#fff}
.th-watch-card small{color:var(--muted);font-size:11px}

@media(max-width:900px){
  .th-grid,.th-radar-grid{grid-template-columns:1fr}
  .th-watch-grid{grid-template-columns:repeat(2,1fr)}
}

/* ===== Industries — /industries and /industries/:id =====
   Same --fam1/--fam2 accent pattern as /tools, with a distinct
   colour pair per industry for visual variety on the hub. */

/* ---------- industry page ---------- */
.ind-hero{padding:64px clamp(20px,5vw,72px) 40px;position:relative;overflow:hidden;text-align:center}
.ind-hero:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 0%,var(--fam1,var(--accent)) 0%,transparent 38%),radial-gradient(circle at 85% 10%,var(--fam2,var(--pink)) 0%,transparent 32%);opacity:.16;pointer-events:none}
.ind-hero-inner{position:relative;max-width:840px;margin:0 auto}
.ind-emoji-lg{font-size:54px;line-height:1;margin-bottom:8px}
.ind-hero h1{margin:6px 0 12px}
.ind-hero .tool-tagline{margin:0 auto;text-align:center}
.ind-hero .tool-cta-row{justify-content:center}

.ind-main{max-width:840px;margin:0 auto;padding:0 clamp(20px,5vw,72px) 70px}
.ind-main .tool-section{margin-bottom:36px}
.ind-main .tool-overview p{font-size:17px}

.ind-step{display:grid;grid-template-columns:44px 1fr;gap:18px;padding:22px 0;border-bottom:1px solid var(--line)}
.ind-step:last-child{border-bottom:0;padding-bottom:0}
.ind-step:first-child{padding-top:0}
.ind-step-num{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-family:'Saira Condensed',sans-serif;font-weight:900;font-size:18px;background:rgba(255,255,255,.06);border:1px solid var(--line);color:var(--fam1,var(--accent))}
.ind-step h3{margin:0 0 6px;font-size:19px;color:#fff;font-family:'Saira Condensed',sans-serif;letter-spacing:-.01em}
.ind-step p{margin:0 0 12px;color:#cbd5e1;line-height:1.6;font-size:15px}
.ind-tools{display:flex;gap:8px;flex-wrap:wrap}
.ind-tool-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:999px;padding:7px 13px;font-size:13px;font-weight:800;color:#dbe4f0;text-decoration:none;background:rgba(255,255,255,.04)}
.ind-tool-chip:hover{border-color:var(--fam1,var(--accent));color:var(--fam1,var(--accent))}

.ind-quote{border:1px solid var(--line);border-left:4px solid var(--fam1,var(--accent));border-radius:18px;padding:24px;background:rgba(255,255,255,.04);font-size:18px;line-height:1.6;color:#e2e8f0}
.ind-quote .q-text{font-style:italic}
.ind-quote .q-role{display:block;margin-top:14px;font-size:12px;font-style:normal;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.1em}

/* ---------- /industries hub ---------- */
.ind-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.ind-card{border:1px solid var(--line);border-radius:24px;padding:24px;background:rgba(255,255,255,.045);text-decoration:none;color:inherit;position:relative;overflow:hidden}
.ind-card:before{content:"";position:absolute;inset:0;background:linear-gradient(150deg,var(--fam1,var(--accent)) 0%,transparent 45%);opacity:.10;pointer-events:none}
.ind-card .ind-emoji{font-size:34px;margin-bottom:10px;position:relative}
.ind-card h3{margin:0 0 8px;font-size:23px;color:#fff;position:relative;font-family:'Saira Condensed',sans-serif;letter-spacing:-.01em}
.ind-card p{margin:0;color:#cbd5e1;font-size:14px;line-height:1.55;position:relative}
.ind-card .ind-cta{margin-top:14px;color:var(--fam1,var(--accent));font-weight:900;font-size:14px;position:relative;display:block}

@media(max-width:860px){
  .ind-grid{grid-template-columns:1fr}
  .ind-step{grid-template-columns:1fr;gap:8px}
}