:root{
    /* vivid gradient / modern SaaS palette */
    --bg:#F6F7FB;
    --surface:#FFFFFF;
    --ink:#0D0D1A;
    --primary:#6366F1;
    --primary-soft:#8B5CF6;
    --primary-deep:#4F46E5;
    --accent:#EC4899;
    --accent-deep:#DB2777;
    --cyan:#22D3EE;
    --muted:#6B7280;
    --line:#E6E8F0;
    --soft-tint:#F5F3FF;
    --primary-tint:#EEF2FF;
    --accent-tint:#F3E8FF;
    --grad:linear-gradient(120deg,#6366F1,#8B5CF6,#EC4899);
    --grad-soft:linear-gradient(120deg,#EEF2FF,#FAE8FF);
    --maxw:min(1600px, 92vw);
    --font-head:'Space Grotesk','Inter',system-ui,sans-serif;
    --font-body:'Inter',system-ui,-apple-system,sans-serif;
  }
  /* register --p so the score ring's conic-gradient can animate (degrades to a snap if unsupported) */
  @property --p{syntax:'<number>';inherits:false;initial-value:0}
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{
    background:var(--bg);
    color:var(--ink);
    font-family:var(--font-body);
    font-weight:400;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  a{color:inherit;text-decoration:none}
  .wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}

  .eyebrow{display:inline-block;font-family:var(--font-body);font-weight:800;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-deep);background:var(--accent-tint);padding:7px 15px;border-radius:6px}
  .eyebrow.on-dark{color:#f0d9a8;background:rgba(255,255,255,.1)}

  /* ---------- SCROLL PROGRESS ---------- */
  .progress{position:fixed;top:0;left:0;height:3px;width:0;background:var(--grad);z-index:200;transition:width .08s linear}

  /* ---------- BUTTONS ---------- */
  .btn{display:inline-flex;align-items:center;gap:8px;background:var(--grad);background-size:160% 160%;color:#fff;font-family:var(--font-body);font-weight:700;font-size:15px;padding:14px 26px;border-radius:999px;transition:.22s;border:0;cursor:pointer;box-shadow:0 10px 26px -8px rgba(99,102,241,.55)}
  .btn:hover{transform:translateY(-2px);box-shadow:0 16px 34px -8px rgba(236,72,153,.5);background-position:100% 0}
  .btn-ghost{background:#fff;color:var(--primary-deep);border:1.5px solid var(--line);box-shadow:0 6px 18px -10px rgba(13,13,26,.3)}
  .btn-ghost:hover{border-color:var(--primary);color:var(--primary-deep);background:var(--primary-tint)}

  /* ---------- STICKY GLASS NAV ---------- */
  header{position:sticky;top:0;z-index:100;background:rgba(246,247,251,.72);backdrop-filter:blur(16px) saturate(160%);border-bottom:1px solid rgba(230,232,240,.8)}
  .nav{display:flex;align-items:center;gap:24px;height:72px}
  .brand{display:flex;align-items:center;gap:10px;flex:none}
  .brand .dot{width:13px;height:13px;border-radius:4px;background:var(--grad);display:inline-block;box-shadow:0 4px 12px -2px rgba(99,102,241,.6)}
  .brand .mark{width:34px;height:34px;display:block;flex:none;filter:drop-shadow(0 4px 12px rgba(99,102,241,.5))}
  .brand .mk{font-family:var(--font-head);font-weight:700;font-size:22px;letter-spacing:-.03em;color:var(--ink)}
  .brand small{font-weight:700;font-size:10px;letter-spacing:.06em;color:var(--muted);text-transform:uppercase;display:block;margin-top:-2px}
  nav#nav{margin-left:auto;display:flex;align-items:center;gap:6px}
  nav#nav a{font-family:var(--font-body);font-weight:600;font-size:14.5px;color:var(--ink);padding:9px 13px;border-radius:9px;transition:.15s}
  nav#nav a:hover{color:var(--primary-deep);background:var(--primary-tint)}
  nav#nav a.nav-cta{background:var(--grad);color:#fff;padding:11px 20px;border-radius:999px;box-shadow:0 8px 20px -8px rgba(99,102,241,.6)}
  nav#nav a.nav-cta:hover{transform:translateY(-1px)}
  /* "Free" nav dropdown (holds The Lookout / Free SWOT / Free Tools) */
  .navdrop{position:relative;display:flex;align-items:center}
  .navdrop-btn{font-family:var(--font-body);font-weight:600;font-size:14.5px;color:var(--ink);padding:9px 13px;border-radius:9px;background:none;border:0;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:.15s}
  .navdrop-btn:hover,.navdrop.open .navdrop-btn,.navdrop.cur .navdrop-btn{color:var(--primary-deep);background:var(--primary-tint)}
  .navdrop-btn .caret{font-size:9px;line-height:1;transition:transform .2s}
  .navdrop.open .navdrop-btn .caret{transform:rotate(180deg)}
  .navdrop-menu{position:absolute;top:calc(100% + 10px);right:0;min-width:236px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 26px 54px -26px rgba(13,13,26,.32);padding:8px;display:none;flex-direction:column;gap:2px;z-index:120}
  .navdrop.open .navdrop-menu{display:flex;animation:pr-fade .18s ease}
  .navdrop-menu a{padding:10px 13px;border-radius:10px;display:block;transition:.13s}
  .navdrop-menu a:hover{background:var(--primary-tint)}
  .navdrop-menu .dl{display:block;font-family:var(--font-head);font-weight:700;font-size:15px;color:var(--ink);letter-spacing:-.01em}
  .navdrop-menu a:hover .dl{color:var(--primary-deep)}
  .navdrop-menu .ds{display:block;font-size:12px;font-weight:600;color:var(--muted);margin-top:1px}
  .navtoggle{display:none;margin-left:auto;background:none;border:0;cursor:pointer;flex-direction:column;gap:5px;padding:8px}
  .navtoggle span{width:24px;height:2.5px;background:var(--ink);border-radius:2px;transition:.2s}

  section{padding:58px 0}
  .sec-head{margin-bottom:24px}
  h2{font-family:var(--font-head);font-weight:700;font-size:clamp(30px,4.4vw,52px);letter-spacing:-.03em;line-height:1.05;color:var(--ink)}
  .lead{font-size:clamp(17px,2vw,21px);max-width:980px;color:var(--muted);font-weight:400;line-height:1.55}
  /* heading + lead sit side by side so the row fills the width instead of trailing off */
  .split{display:grid;grid-template-columns:1.1fr .9fr;gap:18px 48px;align-items:end}
  .split.top{align-items:start;grid-template-columns:.92fr 1.08fr}
  .split.top > :first-child h2{margin:0}
  .split .lead{margin-top:0}
  .split.top .lead + .lead{margin-top:16px}
  @media(max-width:860px){.split,.split.top{grid-template-columns:1fr;gap:18px}}

  /* ---------- TOOL PAGE LAYOUT (tool + supporting panel, fills the frame) ---------- */
  .tool-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.78fr);gap:48px;align-items:start}
  .tool-layout .lk-tool,.tool-layout .sw-tool,.tool-layout .pr-tool{max-width:none;width:100%;margin:0}
  .tool-side{position:sticky;top:96px;display:grid;gap:22px}
  .tool-side .ts-card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px 26px;box-shadow:0 24px 60px -32px rgba(31,28,84,.26)}
  .tool-side .ts-k{font-family:var(--font-head);font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-deep);margin-bottom:14px}
  .tool-side .ts-list{list-style:none;margin:0;padding:0;display:grid;gap:11px}
  .tool-side .ts-list li{position:relative;padding-left:28px;font-size:15px;line-height:1.45;color:var(--ink);font-weight:500}
  .tool-side .ts-list li::before{content:"";position:absolute;left:0;top:2px;width:18px;height:18px;border-radius:6px;background:var(--grad)}
  .tool-side .ts-list li::after{content:"";position:absolute;left:6px;top:6px;width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(42deg)}
  .tool-side .ts-card h4{font-family:var(--font-head);font-weight:700;font-size:19px;margin:0 0 8px;color:var(--ink)}
  .tool-side .ts-card p{font-size:14.5px;line-height:1.6;color:#4b5358;margin:0}
  .tool-side .ts-card.grad{background:var(--grad);border-color:transparent}
  .tool-side .ts-card.grad h4,.tool-side .ts-card.grad p{color:#fff}
  .tool-side .ts-card.grad p{color:rgba(255,255,255,.9)}
  .tool-side .ts-link{display:inline-block;margin-top:14px;font-weight:800;font-size:13px;letter-spacing:.03em;text-transform:uppercase;color:#fff;text-decoration:none;border-bottom:2px solid rgba(255,255,255,.6);padding-bottom:2px}
  @media(max-width:900px){.tool-layout{grid-template-columns:1fr;gap:28px}.tool-side{position:static}}

  /* ---------- HERO ---------- */
  .hero{position:relative;overflow:hidden;padding:96px 0 84px;display:flex;align-items:center}
  .hero .wrap{position:relative;z-index:2;width:100%;display:grid;grid-template-columns:1.04fr .96fr;gap:56px;align-items:center}
  .hero-copy{min-width:0}
  @media(max-width:940px){.hero{padding:80px 0 64px}.hero .wrap{grid-template-columns:1fr;gap:40px}}

  /* hero visual: a "lookout" scope that fills the right column. Pure CSS, no claims. */
  .hero-visual{position:relative;min-height:430px;display:flex;align-items:center;justify-content:center}
  .scope{position:relative;width:min(420px,92%);aspect-ratio:1;border-radius:50%;
    background:radial-gradient(circle at 50% 45%,rgba(255,255,255,.9),rgba(238,242,255,.65) 60%,rgba(243,232,255,.5));
    border:1px solid var(--line);box-shadow:0 40px 90px -50px rgba(79,70,229,.55),inset 0 0 0 1px rgba(255,255,255,.6)}
  .scope .ring{position:absolute;border-radius:50%;border:1.5px solid rgba(99,102,241,.22);top:50%;left:50%;transform:translate(-50%,-50%)}
  .scope .ring.r1{width:34%;height:34%}
  .scope .ring.r2{width:62%;height:62%;border-style:dashed;border-color:rgba(236,72,153,.25)}
  .scope .ring.r3{width:90%;height:90%;border-color:rgba(99,102,241,.16)}
  .scope .sweep{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,rgba(99,102,241,.18),transparent 28%);animation:scopespin 9s linear infinite}
  @keyframes scopespin{to{transform:rotate(360deg)}}
  .scope .pin{position:absolute;top:50%;left:50%;width:18px;height:18px;border-radius:50%;transform:translate(-50%,-50%);
    background:var(--grad);box-shadow:0 0 0 6px rgba(99,102,241,.18),0 0 0 14px rgba(99,102,241,.09)}
  @media(prefers-reduced-motion:reduce){.scope .sweep{animation:none}}
  /* floating fact chips around the scope - all are TRUE positioning lines, not metrics */
  .hero-chip{position:absolute;background:rgba(255,255,255,.92);backdrop-filter:blur(6px);border:1px solid var(--line);
    border-radius:12px;padding:11px 15px;box-shadow:0 16px 40px -22px rgba(13,13,26,.5);display:flex;gap:9px;align-items:center;
    font-weight:700;font-size:14px;color:var(--ink);white-space:nowrap}
  .hero-chip i{width:9px;height:9px;border-radius:50%;background:var(--accent);flex:none}
  .hero-chip.c1{top:6%;left:-4%}
  .hero-chip.c2{top:44%;right:-8%}
  .hero-chip.c2 i{background:var(--primary)}
  .hero-chip.c3{bottom:7%;left:6%}
  .hero-chip.c3 i{background:var(--primary-soft)}
  @media(max-width:940px){.hero-visual{min-height:360px}.hero-chip{font-size:13px}}
  @media(max-width:420px){.hero-chip.c1{left:0}.hero-chip.c2{right:0}}
  .blob{position:absolute;border-radius:50%;filter:blur(80px);opacity:.55;pointer-events:none;z-index:0;animation:float 18s ease-in-out infinite}
  .blob.b1{width:560px;height:560px;background:radial-gradient(circle,#8B5CF6,transparent 65%);top:-160px;right:-120px}
  .blob.b2{width:480px;height:480px;background:radial-gradient(circle,#EC4899,transparent 65%);bottom:-180px;left:-100px;animation-delay:-6s}
  .blob.b3{width:420px;height:420px;background:radial-gradient(circle,#22D3EE,transparent 65%);top:30%;left:38%;animation-delay:-11s;opacity:.4}
  @keyframes float{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(40px,-30px) scale(1.08)}66%{transform:translate(-30px,25px) scale(.95)}}
  .hero-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.7);backdrop-filter:blur(8px);border:1px solid var(--line);border-radius:999px;padding:7px 16px;font-size:13px;font-weight:600;color:var(--primary-deep);box-shadow:0 6px 18px -10px rgba(13,13,26,.25)}
  .hero-badge .pip{width:8px;height:8px;border-radius:50%;background:var(--grad)}
  .display{font-family:var(--font-head);font-weight:700;letter-spacing:-.035em;line-height:1.02;font-size:clamp(42px,7vw,86px);margin-top:24px;color:var(--ink)}
  .display .grad,.display .accent{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
  .hero-sub{max-width:660px;margin:26px 0 0;font-size:clamp(18px,2.2vw,23px);font-weight:400;line-height:1.5;color:#3A3A52}
  .hero-sub b{color:var(--primary-deep);font-weight:700}
  .hero-story{max-width:600px;margin:18px 0 0;font-size:16px;line-height:1.65;color:var(--muted)}
  .hero-cta{margin-top:34px;display:flex;gap:14px;flex-wrap:wrap}

  /* ---------- INTERIOR PAGE HEADER (every page except Home) ---------- */
  .pagehead{position:relative;overflow:hidden;padding:94px 0 60px}
  .pagehead .wrap{position:relative;z-index:2}
  .pagehead .blob{opacity:.4}
  .pagehead h1{font-family:var(--font-head);font-weight:700;letter-spacing:-.035em;line-height:1.04;font-size:clamp(38px,5.4vw,68px);margin-top:18px;color:var(--ink)}
  .pagehead h1 .grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
  .pagehead .sub{max-width:680px;margin:20px 0 0;font-size:clamp(17px,2vw,21px);line-height:1.55;color:#3A3A52}
  /* Two-column page header: copy left, true-facts aside card right. Fills the frame. */
  .pagehead .head-split{display:grid;grid-template-columns:1.08fr .92fr;gap:34px 56px;align-items:center}
  .pagehead .head-split .sub{max-width:560px}
  .head-aside{background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px 28px;box-shadow:0 24px 60px -28px rgba(31,28,84,.28)}
  .head-aside .ha-k{font-family:var(--font-head);font-weight:700;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-deep);margin-bottom:14px}
  .head-aside .ha-list{list-style:none;margin:0;padding:0;display:grid;gap:11px}
  .head-aside .ha-list li{position:relative;padding-left:28px;font-size:15.5px;line-height:1.4;color:var(--ink);font-weight:500}
  .head-aside .ha-list li::before{content:"";position:absolute;left:0;top:2px;width:18px;height:18px;border-radius:6px;background:var(--grad);box-shadow:0 4px 10px -3px rgba(99,102,241,.55)}
  .head-aside .ha-list li::after{content:"";position:absolute;left:6px;top:6px;width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(42deg)}
  .head-aside .ha-link{display:inline-block;margin-top:18px;font-weight:800;font-size:13px;letter-spacing:.03em;text-transform:uppercase;color:var(--accent-deep);text-decoration:none;border-bottom:2px solid currentColor;padding-bottom:2px}
  .head-aside.ha-cols .ha-list{grid-template-columns:1fr 1fr;gap:11px 22px}
  @media(max-width:880px){.pagehead .head-split{grid-template-columns:1fr;gap:26px;align-items:start}.pagehead .head-split .sub{max-width:680px}.head-aside.ha-cols .ha-list{grid-template-columns:1fr}}

  /* active nav link */
  nav#nav a[aria-current="page"]{color:var(--primary-deep);background:var(--primary-tint)}
  nav#nav a.nav-cta[aria-current="page"]{color:#fff;background:var(--grad)}

  /* ---------- SCROLL REVEAL ---------- */
  .js main > section:not(:where(.hero,.pagehead)),.js .builtfor,.js .trust{opacity:0;transform:translateY(28px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
  .js main > section:not(:where(.hero,.pagehead)).in,.js .builtfor.in,.js .trust.in{opacity:1;transform:none}
  @media(prefers-reduced-motion:reduce){.js main>section,.js .builtfor,.js .trust{opacity:1!important;transform:none!important}.blob{animation:none}}

  /* ---------- BUILT FOR STRIP ---------- */
  .builtfor{background:var(--accent-tint);border-bottom:1px solid var(--line)}
  .builtfor .wrap{display:flex;gap:14px;align-items:center;flex-wrap:wrap;padding-top:18px;padding-bottom:18px}
  .builtfor .bl{font-weight:800;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-deep);white-space:nowrap}
  .builtfor p{font-size:15.5px;color:var(--primary);font-weight:500}

  /* ---------- TRUST BAND ---------- */
  .trust{border-bottom:1px solid var(--line);background:var(--soft-tint)}
  .trust-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding:30px 0}
  .trust-grid div{padding:4px 18px;border-left:2px solid var(--accent)}
  .trust-grid .tl{font-family:var(--font-head);font-weight:600;font-size:18px;color:var(--primary)}
  .trust-grid p{margin-top:7px;font-size:14.5px;line-height:1.5;color:var(--ink);font-weight:500}

  /* ---------- DARK (marine) BAND ---------- */
  .shift{background:var(--primary);color:#fff;border:0}
  .shift .eyebrow{color:#f0d9a8;background:rgba(255,255,255,.1)}
  .shift h2{color:#fff}
  .shift .lead{color:#cfe0e5}
  .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:42px}
  .card{background:var(--primary-deep);border-radius:14px;padding:30px 26px}
  .card .ch{font-family:var(--font-head);font-weight:600;font-size:clamp(21px,2.5vw,27px);letter-spacing:-.01em;color:#f0c886;line-height:1.12}
  .card .cb{margin-top:13px;font-size:15.5px;color:#cfe0e5;line-height:1.55}

  /* ---------- PILLARS / SERVICES ---------- */
  .pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
  .pill{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:30px 28px;box-shadow:0 10px 30px -24px rgba(17,36,46,.5);transition:.18s}
  .pill:hover{transform:translateY(-3px);box-shadow:0 18px 40px -24px rgba(17,36,46,.55)}
  .pill .pn{font-weight:800;font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--accent-deep)}
  .pill h3{font-family:var(--font-head);font-weight:600;font-size:22px;margin:12px 0 9px;letter-spacing:-.01em;color:var(--ink)}
  .pill p{font-size:15.5px;color:#4b5358;line-height:1.6}
  .pill .tag{display:inline-block;margin-top:14px;font-weight:700;font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--primary);background:var(--primary-tint);padding:5px 11px;border-radius:6px}
  .pill.lead-pill{background:var(--accent-tint);border-color:#ecd5a6}

  /* ---------- DIFFERENT (vs) ---------- */
  .different{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:start}
  .vs{list-style:none}
  .vs li{padding:17px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:center}
  .vs li:first-child{border-top:1px solid var(--line)}
  .vs .them{color:var(--muted);font-size:16px}
  .vs .us{font-weight:600;font-size:16.5px;color:var(--primary)}
  .vs .us::before{content:"\2713  ";color:var(--accent-deep);font-weight:900}

  /* ---------- WORK / CLIENT CARDS ---------- */
  .clients{display:flex;gap:22px;flex-wrap:wrap;margin-top:14px}
  .client{flex:1 1 300px;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:30px;box-shadow:0 10px 30px -24px rgba(17,36,46,.5)}
  .client .ctype{font-weight:800;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--accent-deep)}
  .client h3{font-family:var(--font-head);font-weight:600;font-size:22px;margin:9px 0 8px;color:var(--ink)}
  .client p{font-size:15px;color:#4b5358;line-height:1.6}
  .pricelink{display:inline-block;margin-top:16px;color:var(--accent-deep);font-weight:800;font-size:13px;letter-spacing:.03em;text-transform:uppercase}
  .note{margin-top:26px;font-size:14.5px;color:var(--muted);border-left:3px solid var(--accent);padding-left:15px;max-width:720px;line-height:1.6}

  /* ---------- SERVICE AREA ---------- */
  .area-towns{font-family:var(--font-head);font-weight:500;font-size:clamp(20px,2.6vw,30px);color:var(--primary);line-height:1.5;max-width:940px;letter-spacing:-.01em}

  /* ---------- CONTACT CTA (band in the Talk panel) ---------- */
  .cta{background:var(--primary);color:#fff;border:0;text-align:center;padding:56px 0}
  .cta h2{color:#fff;font-family:var(--font-head);font-weight:700;font-size:clamp(30px,4.6vw,54px);letter-spacing:-.02em;line-height:1.05}
  .cta .accent{color:#f0c886}
  .cta p{max-width:580px;margin:18px auto 0;color:#cfe0e5;font-size:18px;font-weight:500}
  .cta .btn{margin-top:28px;background:var(--accent);border-color:var(--accent);color:#2a1c06;font-size:17px;padding:16px 32px}
  .cta .btn:hover{background:#fff;color:var(--primary-deep);border-color:#fff}

  /* ---------- FOOTER ---------- */
  footer{background:var(--bg);padding:56px 0 40px}
  .foot{border-top:1px solid var(--line);padding-top:40px}
  .foot-top{display:flex;justify-content:space-between;gap:48px;flex-wrap:wrap}
  .foot-brand{max-width:340px}
  .foot .fbrand{font-family:var(--font-head);font-weight:700;font-size:24px;color:var(--primary);display:flex;align-items:center;gap:11px}
  .foot .fmark{width:30px;height:30px;display:block;flex:none}
  .foot-brand .fmeta{margin-top:12px;font-size:14px;color:var(--muted);line-height:1.6;font-weight:500}
  .foot-mail{display:inline-block;margin-top:14px;font-weight:700;font-size:14px;color:var(--accent-deep)}
  .foot-mail:hover{text-decoration:underline}
  .foot-cols{display:flex;gap:56px;flex-wrap:wrap}
  .foot-col{display:flex;flex-direction:column;gap:10px}
  .foot-col .fh{font-weight:800;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);margin-bottom:4px}
  .foot-col a{font-size:14.5px;color:var(--muted);font-weight:500;transition:.14s}
  .foot-col a:hover{color:var(--primary-deep)}
  .foot-bot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-top:40px;padding-top:22px;border-top:1px solid var(--line);font-size:13px;color:var(--muted);font-weight:500}
  @media(max-width:640px){.foot-top{gap:32px}.foot-cols{gap:36px}}

  /* ---------- ROADMAP CALLOUT ---------- */
  .roadmap{margin-top:30px;border:1.5px dashed var(--accent);border-radius:12px;padding:22px 24px;background:var(--accent-tint);display:flex;gap:18px;align-items:baseline;flex-wrap:wrap}
  .roadmap .tag2{font-weight:800;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--accent-deep);white-space:nowrap}
  .roadmap p{font-size:16px;color:var(--primary);font-weight:500;line-height:1.5;flex:1 1 320px}

  /* ---------- THE LOOKOUT (interactive marketing scorecard) ----------
     Self-contained, namespaced lk-* so it can't collide with the rest of the page.
     HONESTY: it scores the VISITOR'S OWN answers (a self-assessment), stores nothing,
     and never fabricates data about them. The readout reflects back what they told us. */
  .lk-tool{background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 24px 60px -34px rgba(16,58,76,.6);max-width:780px;margin:36px auto 0;overflow:hidden;text-align:left}
  .lk-thead{background:var(--primary);color:#fff;padding:18px 26px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
  .lk-thead .tt{font-family:var(--font-head);font-weight:600;font-size:19px;letter-spacing:-.01em}
  .lk-thead .tg{font-weight:700;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:#a9c4cc}
  .lk-body{padding:24px 26px 26px}
  .lk-intro{font-size:14px;color:var(--muted);margin-bottom:18px;line-height:1.55}
  .lk-q{padding:16px 0;border-top:1px solid var(--line)}
  .lk-q:first-of-type{border-top:0;padding-top:4px}
  .lk-q .qt{font-weight:700;font-size:15.5px;color:var(--ink);margin-bottom:11px;display:block}
  .lk-opts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
  .lk-opt{position:relative}
  .lk-opt input{position:absolute;opacity:0;width:0;height:0}
  .lk-opt label{display:block;text-align:center;font-weight:700;font-size:14px;color:#4b5358;background:#f6f2e8;border:1.5px solid var(--line);border-radius:9px;padding:11px 8px;cursor:pointer;transition:.14s}
  .lk-opt label:hover{border-color:var(--accent)}
  .lk-opt input:checked+label{background:var(--primary);border-color:var(--primary);color:#fff}
  .lk-opt input:focus-visible+label{outline:3px solid rgba(201,138,43,.5);outline-offset:2px}
  .lk-run{width:100%;margin-top:20px;font-family:inherit;font-weight:800;font-size:17px;color:#2a1c06;background:var(--accent);border:0;border-radius:10px;padding:16px;cursor:pointer;transition:.16s}
  .lk-run:hover{background:var(--accent-deep);color:#fff}
  .lk-micro{margin-top:13px;font-size:12.5px;color:var(--muted);text-align:center;line-height:1.5}

  .lk-result{display:none}
  .lk-result.on{display:block}
  .lk-rhead{background:var(--primary-deep);color:#fff;padding:26px;text-align:center}
  .lk-score-ring{--p:0;width:128px;height:128px;border-radius:50%;margin:4px auto 14px;background:conic-gradient(var(--accent) calc(var(--p)*1%),rgba(255,255,255,.14) 0);display:flex;align-items:center;justify-content:center;transition:--p 1.1s cubic-bezier(.2,.7,.2,1)}
  .lk-score-ring .inner{width:96px;height:96px;border-radius:50%;background:var(--primary-deep);display:flex;flex-direction:column;align-items:center;justify-content:center}
  .lk-score-ring .num{font-family:var(--font-head);font-weight:700;font-size:34px;line-height:1;color:#fff}
  .lk-score-ring .den{font-size:12px;color:#a9c4cc;font-weight:700;margin-top:3px}
  .lk-band{font-family:var(--font-head);font-weight:600;font-size:clamp(20px,3vw,26px);letter-spacing:-.01em;line-height:1.18;max-width:520px;margin:0 auto}
  .lk-rin{padding:24px 26px 28px}
  .lk-start{background:var(--accent-tint);border:1px solid #ecd5a6;border-radius:12px;padding:20px 22px}
  .lk-start .st{font-weight:800;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--accent-deep)}
  .lk-start h3{font-family:var(--font-head);font-weight:600;font-size:20px;color:var(--ink);margin:7px 0 8px}
  .lk-start p{font-size:15.5px;color:#4b5358;line-height:1.6}
  .lk-break{margin-top:22px}
  .lk-break h4{font-weight:800;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
  .lk-row{display:grid;grid-template-columns:150px 1fr 34px;gap:12px;align-items:center;padding:9px 0}
  .lk-row .rl{font-weight:600;font-size:14px;color:var(--ink)}
  .lk-track{height:10px;border-radius:999px;background:#ece3d2;overflow:hidden}
  .lk-track>i{display:block;height:100%;width:0;border-radius:999px;background:linear-gradient(90deg,var(--accent),var(--accent-deep));transition:width 1s cubic-bezier(.2,.7,.2,1)}
  .lk-row .rv{font-weight:800;font-size:13px;color:var(--primary);text-align:right}
  .lk-cta{margin-top:24px;background:var(--soft-tint);border:1px solid var(--line);border-radius:12px;padding:22px;text-align:center}
  .lk-cta p{font-weight:700;color:var(--primary);font-size:16px;max-width:480px;margin:0 auto 4px}
  .lk-cta .small{font-weight:500;color:var(--muted);font-size:13px;margin-bottom:14px}
  .lk-cta a.go{display:inline-block;font-weight:800;font-size:16px;color:#fff;background:var(--primary);padding:14px 24px;border-radius:8px;transition:.16s}
  .lk-cta a.go:hover{background:var(--primary-deep)}
  .lk-restart{display:inline-block;margin-top:13px;font-weight:600;font-size:13.5px;color:var(--muted);background:none;border:0;cursor:pointer;text-decoration:underline;font-family:inherit}
  @media(max-width:560px){.lk-row{grid-template-columns:120px 1fr 30px}}
  @media(prefers-reduced-motion:reduce){.lk-track>i{transition:none}.lk-score-ring{transition:none}}

  /* ---------- THE SWOT BUILDER (email lead-magnet) ----------
     Namespaced sw-* so it can't collide. HONESTY: the SWOT is built ONLY from the
     visitor's own self-reported inputs. It never invents facts, metrics, or claims about
     their business. Threats are general and non-alarmist (no fake stats, no scarcity, no
     false urgency, per SCARF). Demo mode renders on screen and transmits/stores nothing;
     the email field is collected but NOT sent anywhere until Chuck's backend exists. */
  .sw-tool{background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 24px 60px -34px rgba(16,58,76,.6);max-width:860px;margin:34px auto 0;overflow:hidden;text-align:left}
  .sw-thead{background:var(--primary);color:#fff;padding:18px 26px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
  .sw-thead .tt{font-family:var(--font-head);font-weight:600;font-size:19px;letter-spacing:-.01em}
  .sw-thead .tg{font-weight:700;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:#a9c4cc}
  .sw-body{padding:24px 26px 26px}
  .sw-intro{font-size:14px;color:var(--muted);margin-bottom:18px;line-height:1.55}
  .sw-grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
  .sw-field{margin-bottom:15px}
  .sw-field label{display:block;font-weight:700;font-size:14px;color:var(--ink);margin-bottom:7px}
  .sw-field .opt{color:var(--muted);font-weight:500}
  .sw-field input[type=text],.sw-field input[type=email],.sw-field select{width:100%;font-family:inherit;font-size:15px;color:var(--ink);background:#f6f2e8;border:1.5px solid var(--line);border-radius:9px;padding:12px 13px;transition:.14s}
  .sw-field input:focus,.sw-field select:focus{outline:0;border-color:var(--accent);background:#fff}
  .sw-q{padding:14px 0;border-top:1px solid var(--line)}
  .sw-q .qt{font-weight:700;font-size:14.5px;color:var(--ink);margin-bottom:10px;display:block}
  .sw-opts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
  .sw-opt{position:relative}
  .sw-opt input{position:absolute;opacity:0;width:0;height:0}
  .sw-opt label{display:block;text-align:center;font-weight:700;font-size:14px;color:#4b5358;background:#f6f2e8;border:1.5px solid var(--line);border-radius:9px;padding:11px 8px;cursor:pointer;transition:.14s}
  .sw-opt label:hover{border-color:var(--accent)}
  .sw-opt input:checked+label{background:var(--primary);border-color:var(--primary);color:#fff}
  .sw-opt input:focus-visible+label{outline:3px solid rgba(201,138,43,.5);outline-offset:2px}
  .sw-email{margin-top:20px;padding-top:20px;border-top:2px solid var(--line)}
  .sw-consent{display:flex;gap:10px;align-items:flex-start;margin-top:13px;font-size:13px;line-height:1.5;color:var(--muted);cursor:pointer}
  .sw-consent input{margin-top:3px;flex:none;width:17px;height:17px;accent-color:var(--primary);cursor:pointer}
  .sw-run{width:100%;margin-top:16px;font-family:inherit;font-weight:800;font-size:17px;color:#2a1c06;background:var(--accent);border:0;border-radius:10px;padding:16px;cursor:pointer;transition:.16s}
  .sw-run:hover{background:var(--accent-deep);color:#fff}
  .sw-run:disabled{opacity:.7;cursor:default}
  .sw-run .spin{display:inline-block;width:15px;height:15px;margin-right:9px;vertical-align:-2px;border:2px solid rgba(42,28,6,.3);border-top-color:#2a1c06;border-radius:50%;animation:sw-rot .7s linear infinite}
  @keyframes sw-rot{to{transform:rotate(360deg)}}
  @media(prefers-reduced-motion:reduce){.sw-run .spin{animation:none}}
  .sw-micro{margin-top:13px;font-size:12.5px;color:var(--muted);text-align:center;line-height:1.5}
  .sw-err{margin-top:12px;font-size:13.5px;font-weight:700;color:#9a3b2a;text-align:center;display:none}
  .sw-err.on{display:block}

  .sw-result{display:none}
  .sw-result.on{display:block}
  .sw-rhead{background:var(--primary-deep);color:#fff;padding:26px;text-align:center}
  .sw-rhead .rk{font-weight:700;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:#a9c4cc}
  .sw-rhead h3{font-family:var(--font-head);font-weight:600;font-size:clamp(22px,3.4vw,30px);letter-spacing:-.01em;line-height:1.12;margin-top:8px;color:#fff}
  .sw-rin{padding:24px 26px 28px}
  .sw-sent{background:#e7f1ec;border:1px solid #bcdccd;color:#1f5a44;border-radius:10px;padding:13px 16px;font-size:14px;font-weight:600;margin-bottom:18px;line-height:1.5}
  .sw-quads{display:grid;grid-template-columns:1fr 1fr;gap:16px}
  .sw-quad{border:1px solid var(--line);border-radius:12px;padding:20px 22px;background:#fff}
  .sw-quad h4{font-family:var(--font-head);font-weight:700;font-size:13px;letter-spacing:.04em;text-transform:uppercase;margin-bottom:12px;display:flex;align-items:center;gap:9px}
  .sw-quad h4 .qd{width:9px;height:9px;border-radius:2px;transform:rotate(45deg);display:inline-block}
  .sw-quad.s h4{color:#1f7a5a} .sw-quad.s h4 .qd{background:#1f7a5a}
  .sw-quad.w h4{color:#a9711c} .sw-quad.w h4 .qd{background:#a9711c}
  .sw-quad.o h4{color:#103a4c} .sw-quad.o h4 .qd{background:#103a4c}
  .sw-quad.t h4{color:#9a3b2a} .sw-quad.t h4 .qd{background:#9a3b2a}
  .sw-quad ul{list-style:none}
  .sw-quad li{font-size:14.5px;line-height:1.55;color:#4b5358;padding:7px 0 7px 20px;position:relative}
  .sw-quad li::before{content:"";position:absolute;left:2px;top:13px;width:6px;height:6px;border-radius:50%;background:var(--accent)}
  .sw-rec{margin-top:22px;background:var(--accent-tint);border:1px solid #ecd5a6;border-radius:12px;padding:22px 24px}
  .sw-rec .rt{font-weight:800;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--accent-deep)}
  .sw-rec h4{font-family:var(--font-head);font-weight:600;font-size:20px;color:var(--ink);margin:7px 0 8px}
  .sw-rec p{font-size:15.5px;color:#4b5358;line-height:1.6}
  .sw-cta{margin-top:22px;background:var(--soft-tint);border:1px solid var(--line);border-radius:12px;padding:22px;text-align:center}
  .sw-cta p{font-weight:700;color:var(--primary);font-size:16px;max-width:520px;margin:0 auto 4px}
  .sw-cta .small{font-weight:500;color:var(--muted);font-size:13px;margin-bottom:14px}
  .sw-cta a.go{display:inline-block;font-weight:800;font-size:16px;color:#fff;background:var(--primary);padding:14px 24px;border-radius:8px;transition:.16s}
  .sw-cta a.go:hover{background:var(--primary-deep)}
  .sw-restart{display:inline-block;margin-top:13px;font-weight:600;font-size:13.5px;color:var(--muted);background:none;border:0;cursor:pointer;text-decoration:underline;font-family:inherit}
  @media(max-width:680px){.sw-grid2{grid-template-columns:1fr}.sw-quads{grid-template-columns:1fr}.sw-opts{grid-template-columns:1fr}}

  /* ---------- FAQ (native details, accessible, zero-JS) ---------- */
  .faq-list{max-width:900px;border-top:1px solid var(--line)}
  .faq-list details{border-bottom:1px solid var(--line)}
  .faq-list summary{list-style:none;cursor:pointer;padding:22px 2px;display:flex;justify-content:space-between;gap:22px;align-items:baseline;font-family:var(--font-head);font-weight:600;font-size:clamp(17px,2.1vw,21px);letter-spacing:-.01em;color:var(--ink)}
  .faq-list summary::-webkit-details-marker{display:none}
  .faq-list summary:hover{color:var(--accent-deep)}
  .faq-list .q-ico{flex:none;font-weight:800;font-size:24px;line-height:1;color:var(--accent-deep);transition:transform .2s ease}
  .faq-list details[open] summary .q-ico{transform:rotate(45deg)}
  .faq-list .faq-a{padding:0 2px 24px;max-width:790px;font-size:16.5px;line-height:1.65;color:#4b5358}
  .faq-list .faq-a a{color:var(--accent-deep);font-weight:700;text-decoration:underline}
  @media(prefers-reduced-motion:reduce){.faq-list .q-ico{transition:none}}

  @media(max-width:860px){
    .trust-grid{grid-template-columns:1fr 1fr}
    .cards{grid-template-columns:1fr}
    .pillars{grid-template-columns:1fr}
    .different{grid-template-columns:1fr;gap:34px}
    .vs li{grid-template-columns:1fr;gap:4px}
    .vs .them{font-size:14px}
    .lk-opts{grid-template-columns:1fr}
  }
  @media(max-width:680px){.pillars{grid-template-columns:1fr}}

  /* =====================================================================
     v2  VIVID GRADIENT / MODERN SAAS RE-SKIN
     Re-skins the band + card + tool styles above onto the bright palette.
     Tool markup + JS untouched; only color/shape/shadow is overridden.
     ===================================================================== */

  .eyebrow{color:var(--primary-deep);background:var(--primary-tint);border-radius:999px}
  .eyebrow.on-dark{color:#fff;background:rgba(255,255,255,.16)}

  /* built-for strip */
  .builtfor{background:var(--grad-soft);border-bottom:0}
  .builtfor .bl{color:var(--accent-deep)}
  .builtfor p{color:#3A3A52}

  /* trust band -> glass cards on soft tint */
  .trust{background:#fff;border-bottom:1px solid var(--line)}
  .trust-grid div{border-left:0;background:var(--soft-tint);border:1px solid var(--line);border-radius:16px;padding:22px}
  .trust-grid .tl{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;font-size:20px}
  .trust-grid p{color:#3A3A52;font-weight:400}

  /* dark band -> gradient panel */
  .shift{background:linear-gradient(135deg,#1E1B4B,#4F46E5 55%,#7C3AED);color:#fff;position:relative;overflow:hidden}
  .shift h2{color:#fff}
  .shift .lead{color:rgba(255,255,255,.82)}
  .cards{margin-top:42px}
  .card{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);backdrop-filter:blur(6px);border-radius:18px}
  .card .ch{color:#fff;background:linear-gradient(120deg,#C4B5FD,#F9A8D4);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
  .card .cb{color:rgba(255,255,255,.8)}

  /* service pillars -> glass cards */
  .pill{border-radius:20px;box-shadow:0 20px 50px -34px rgba(99,102,241,.45);border:1px solid var(--line)}
  .pill:hover{transform:translateY(-4px);box-shadow:0 30px 60px -32px rgba(139,92,246,.5);border-color:transparent}
  .pill .pn{color:var(--accent-deep)}
  .pill .tag{color:var(--primary-deep);background:var(--primary-tint);border-radius:999px}
  .pill.lead-pill{background:var(--grad-soft);border-color:#E9D5FF}

  /* different / vs */
  .vs .us{color:var(--primary-deep)}
  .vs .us::before{color:var(--accent-deep)}

  /* client cards */
  .client{border-radius:20px;box-shadow:0 20px 50px -34px rgba(99,102,241,.4)}
  .client .ctype{color:var(--accent-deep)}
  .pricelink{color:var(--accent-deep)}
  .note{border-left-color:var(--primary);color:var(--muted)}

  .area-towns{color:var(--primary-deep)}

  /* roadmap callout */
  .roadmap{border:1.5px dashed var(--primary);background:var(--grad-soft);border-radius:16px}
  .roadmap .tag2{color:var(--accent-deep)}
  .roadmap p{color:var(--primary-deep)}

  /* contact CTA -> dark gradient rounded card, two-column band that fills the frame */
  .cta{background:transparent;padding:0}
  .cta .wrap{background:linear-gradient(135deg,#4F46E5,#7C3AED 50%,#EC4899);border-radius:28px;padding:56px 56px;text-align:left;box-shadow:0 40px 90px -40px rgba(124,58,237,.6);position:relative;overflow:hidden;display:grid;grid-template-columns:1fr auto;column-gap:56px;align-items:center}
  .cta .eyebrow{grid-column:1;justify-self:start}
  .cta h2{color:#fff;grid-column:1;max-width:18ch}
  .cta .accent{color:#fff;text-decoration-color:rgba(255,255,255,.5)}
  .cta p{color:rgba(255,255,255,.88);grid-column:1;max-width:52ch;margin:16px 0 0}
  .cta .btn{background:#fff;color:var(--primary-deep);box-shadow:0 12px 30px -10px rgba(0,0,0,.3);grid-column:2;grid-row:1 / -1;align-self:center;justify-self:end;margin:0;white-space:nowrap}
  .cta .btn:hover{background:#fff;color:var(--accent-deep);transform:translateY(-2px)}
  @media(max-width:760px){.cta .wrap{grid-template-columns:1fr;row-gap:8px;text-align:left}.cta .btn{grid-column:1;grid-row:auto;justify-self:start;margin-top:24px}}

  /* footer */
  .foot .fbrand{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}

  /* ---- LOOKOUT tool re-skin ---- */
  .lk-tool,.sw-tool{border-radius:22px;box-shadow:0 36px 80px -44px rgba(99,102,241,.6);border:1px solid var(--line)}
  .lk-thead,.sw-thead{background:var(--grad);color:#fff}
  .lk-thead .tg,.sw-thead .tg{color:rgba(255,255,255,.82)}
  .lk-opt label,.sw-opt label{background:#fff;border-radius:11px;color:#4b5358}
  .lk-opt label:hover,.sw-opt label:hover{border-color:var(--primary)}
  .lk-opt input:checked+label,.sw-opt input:checked+label{background:var(--grad);border-color:transparent;color:#fff}
  .lk-opt input:focus-visible+label,.sw-opt input:focus-visible+label,.tab:focus-visible{outline:3px solid rgba(99,102,241,.5);outline-offset:2px}
  .lk-run,.sw-run{background:var(--grad);color:#fff;border-radius:12px;box-shadow:0 12px 26px -10px rgba(99,102,241,.55)}
  .lk-run:hover,.sw-run:hover{color:#fff;filter:brightness(1.06)}
  .lk-rhead,.sw-rhead{background:linear-gradient(135deg,#1E1B4B,#4F46E5 60%,#7C3AED)}
  .lk-rhead .tg,.sw-rhead .rk{color:rgba(255,255,255,.7)}
  .lk-score-ring{background:conic-gradient(var(--accent) calc(var(--p)*1%),rgba(255,255,255,.16) 0)}
  .lk-score-ring .inner{background:#241F52}
  .lk-score-ring .den{color:rgba(255,255,255,.7)}
  .lk-start,.sw-rec{background:var(--grad-soft);border-color:#E9D5FF;border-radius:14px}
  .lk-start .st,.sw-rec .rt{color:var(--accent-deep)}
  .lk-track{background:#EEE9FB}
  .lk-track>i{background:var(--grad)}
  .lk-row .rv{color:var(--primary-deep)}
  .lk-cta,.sw-cta{background:var(--soft-tint);border-radius:14px}
  .lk-cta p,.sw-cta p{color:var(--primary-deep)}
  .lk-cta a.go,.sw-cta a.go{background:var(--grad);border-radius:999px;box-shadow:0 10px 24px -10px rgba(99,102,241,.55)}
  .lk-cta a.go:hover,.sw-cta a.go:hover{filter:brightness(1.06)}
  .sw-field input[type=text],.sw-field input[type=email],.sw-field select{background:#fff;border-radius:11px}
  .sw-field input:focus,.sw-field select:focus{border-color:var(--primary)}
  .sw-consent input{accent-color:var(--primary)}
  .sw-quad{border-radius:14px}
  .sw-quad li::before{background:var(--primary)}

  /* faq */
  .faq-list summary:hover{color:var(--primary-deep)}
  .faq-list .q-ico{color:var(--accent-deep)}
  .faq-list .faq-a a{color:var(--accent-deep)}

  /* ---- mobile nav ---- */
  @media(max-width:860px){
    .navtoggle{display:flex}
    nav#nav{position:fixed;top:72px;left:0;right:0;flex-direction:column;align-items:stretch;gap:4px;background:rgba(246,247,251,.97);backdrop-filter:blur(16px);padding:14px 20px 22px;border-bottom:1px solid var(--line);transform:translateY(-130%);transition:transform .3s cubic-bezier(.2,.7,.2,1);box-shadow:0 24px 50px -24px rgba(13,13,26,.25)}
    nav#nav.open{transform:translateY(0)}
    nav#nav a{padding:13px 14px;font-size:16px}
    nav#nav a.nav-cta{text-align:center;margin-top:6px}
    .navdrop{display:block;width:100%}
    .navdrop-btn{width:100%;justify-content:space-between;padding:13px 14px;font-size:16px}
    .navdrop-menu{position:static;display:none;min-width:0;border:0;box-shadow:none;background:none;padding:0 0 4px 10px;border-left:2px solid var(--line);margin:2px 0 4px 6px}
    .navdrop.open .navdrop-menu{display:flex}
    .navdrop-menu a{padding:11px 12px}
    .navtoggle.open span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
    .navtoggle.open span:nth-child(2){opacity:0}
    .navtoggle.open span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
    .cta .wrap{padding:46px 24px}
  }
  @media(prefers-reduced-motion:reduce){nav#nav{transition:none}}

  /* ============ PRESENCE INSTRUMENTS (tools.html: Sounding / Wake / Spyglass) ============
     Reuses the .sw-* tool shell + gradient re-skin. These add the tab bar, per-tool panels,
     score readouts, honest checklist with status chips, and the competitor scoreboard. */
  .pr-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:18px 26px 0;background:#fff}
  .pr-tab{display:flex;flex-direction:column;gap:2px;text-align:left;font-family:inherit;background:#fff;border:1.5px solid var(--line);border-radius:12px;padding:12px 14px;cursor:pointer;transition:.15s}
  .pr-tab .tl{font-family:var(--font-head);font-weight:700;font-size:15.5px;letter-spacing:-.01em;color:var(--ink)}
  .pr-tab .td{font-weight:700;font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted)}
  .pr-tab:hover{border-color:var(--primary)}
  .pr-tab.on{background:var(--grad-soft);border-color:transparent;box-shadow:inset 0 0 0 1.5px var(--primary-soft)}
  .pr-tab.on .td{color:var(--accent-deep)}
  .pr-tab:focus-visible{outline:3px solid rgba(99,102,241,.5);outline-offset:2px}

  /* honeypot: visually + AT hidden; only bots fill it (server drops those). Not display:none
     so headless bots still see/fill it. */
  .pr-hp{position:absolute!important;left:-9999px!important;top:auto;width:1px;height:1px;overflow:hidden}
  .pr-panel{display:none}
  .pr-panel.on{display:block;animation:pr-fade .25s ease}
  @keyframes pr-fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
  @media(prefers-reduced-motion:reduce){.pr-panel.on{animation:none}}
  .pr-note{font-size:13.5px;line-height:1.55;color:var(--muted);background:var(--primary-tint);border-radius:10px;padding:11px 14px;margin:4px 0 6px}
  .pr-opts4{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
  .pr-comp{margin-top:6px}

  /* score readout (Sounding / Wake) */
  .pr-score{text-align:center;margin-bottom:6px}
  .pr-bignum{font-family:var(--font-head);font-weight:700;line-height:1;font-size:64px;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
  .pr-bignum small{font-family:var(--font-body);font-weight:700;font-size:20px;color:var(--muted);-webkit-text-fill-color:var(--muted)}
  .pr-conf{font-size:13px;font-weight:600;color:var(--muted);margin-top:8px;line-height:1.5;max-width:520px;margin-left:auto;margin-right:auto}

  /* honest checklist with status chips */
  .pr-checklist{margin-top:20px;border-top:1px solid var(--line)}
  .pr-ck-row{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:12px 2px;border-bottom:1px solid var(--line)}
  .pr-ck-label{font-weight:700;font-size:14.5px;color:var(--ink)}
  .pr-ck-note{font-size:12.5px;color:var(--muted);margin-top:3px;line-height:1.5}
  .pr-ck-chip{flex:none}
  .pr-chip{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.02em;color:#fff;border-radius:7px;padding:3px 10px;white-space:nowrap}
  .pr-chip.pr-pass{background:#1f7a5a}
  .pr-chip.pr-gap{background:#8a5a12}
  .pr-chip.pr-unknown{background:#6E7A80}

  /* competitor scoreboard (Spyglass) */
  .pr-scoreboard{margin-top:14px}
  .pr-sb-rows{border-top:1px solid var(--line)}
  .pr-sb-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 14px;border-bottom:1px solid var(--line);border-radius:10px}
  .pr-sb-row.me{background:var(--grad-soft)}
  .pr-sb-name{font-weight:700;font-size:15px;color:var(--ink)}
  .pr-sb-score{font-family:var(--font-head);font-weight:800;font-size:18px;color:var(--primary-deep);white-space:nowrap}
  .pr-basis{font-size:12.5px;color:var(--muted);line-height:1.55;margin:12px 2px 0}
  .pr-gaps{margin-top:14px;font-size:14.5px;line-height:1.55;color:#4b5358;background:var(--accent-tint);border:1px solid #ecd5a6;border-radius:12px;padding:14px 16px}

  /* the read + first three moves */
  .pr-moves-h{font-weight:800;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--primary-deep);margin-bottom:8px}
  .pr-moves{margin:0;padding-left:20px}
  .pr-moves li{font-size:15px;line-height:1.55;color:#4b5358;padding:5px 0;margin-bottom:2px}

  @media(max-width:680px){
    .pr-tabs{grid-template-columns:1fr;padding:16px 20px 0}
    .pr-tab{flex-direction:row;align-items:baseline;gap:8px}
    .pr-opts4{grid-template-columns:1fr 1fr}
    .pr-bignum{font-size:52px}
  }

  /* ===== content tabs (Data Solutions + SWOT Analysis deep pages) =====
     Reuses the .pr-tabs/.pr-tab/.pr-panel visual language; these classes
     style the rich CONTENT inside each panel. Echoes the existing card +
     grad-checkmark patterns so nothing new is invented visually. */
  .ct-lead{font-size:16px;line-height:1.62;color:#4b5358;margin:2px 0 22px;max-width:62ch}
  .ct-lead b{color:var(--ink);font-weight:700}
  .ct-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
  .ct-card{background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:21px 22px}
  .ct-card .cn{font-weight:800;font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--accent-deep)}
  .ct-card h4{font-family:var(--font-head);font-weight:700;font-size:18px;margin:9px 0 7px;letter-spacing:-.01em;color:var(--ink)}
  .ct-card p{font-size:14.5px;line-height:1.56;color:#4b5358;margin:0}
  .ct-points{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:11px}
  .ct-points li{position:relative;padding-left:28px;font-size:15px;line-height:1.5;color:var(--ink);font-weight:500}
  .ct-points li::before{content:"";position:absolute;left:0;top:2px;width:18px;height:18px;border-radius:6px;background:var(--grad)}
  .ct-points li::after{content:"";position:absolute;left:6px;top:6px;width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(42deg)}
  .ct-points li b{font-weight:700;color:var(--ink)}
  .ct-note{font-size:13.5px;line-height:1.6;color:var(--muted);background:var(--primary-tint);border-radius:12px;padding:13px 16px;margin:20px 0 0}
  .ct-note b{color:var(--primary-deep);font-weight:700}
  .ct-quad{display:inline-flex;align-items:center;gap:9px;margin-bottom:14px}
  .ct-quad .dot{width:13px;height:13px;border-radius:4px;flex:none}
  .ct-quad.s .dot{background:#22A06B}.ct-quad.w .dot{background:var(--accent-deep)}
  .ct-quad.o .dot{background:var(--primary)}.ct-quad.t .dot{background:#E0852B}
  .ct-quad .ql{font-family:var(--font-head);font-weight:700;font-size:13px;letter-spacing:.05em;text-transform:uppercase;color:var(--ink)}