/* Mega menu: opens under the Product item (click, Enter, Space, or hover on large screens). Real links in the page, keyboard friendly. */
.nav .wrap{position:relative}
.menu .mi{display:inline-flex;align-items:center;gap:5px;font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.menu .mi .chev{transition:transform .2s var(--ease)}
.menu .mi[aria-expanded=true] .chev{transform:rotate(180deg)}
.menu a:focus-visible,.menu .mi:focus-visible,.navtoggle:focus-visible{outline:2px solid var(--orange);outline-offset:4px;border-radius:6px}
.navtoggle{display:none;width:36px;height:36px;align-items:center;justify-content:center;border:0;border-radius:10px;background:var(--fill);color:var(--ink);cursor:pointer}
.mega{position:absolute;left:var(--gut);right:var(--gut);top:68px;z-index:60;background:var(--card);border:1px solid var(--line);border-radius:var(--r-card);padding:22px;box-shadow:0 30px 70px -28px rgba(0,0,0,.5)}
.mega:not([hidden]){animation:mgin .18s var(--ease)}
@keyframes mgin{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.mobile-links{display:none;list-style:none}
.mobile-theme{display:none}
.mg{display:grid;grid-template-columns:1.25fr 1.25fr 1fr .95fr;gap:22px}
.mgh{display:inline-block;margin:0 0 8px 8px;font:600 13.5px/1.3 var(--head);color:var(--ink)}
.mgh:hover{text-decoration:underline;text-underline-offset:3px}
.mc ul{list-style:none}
.ml{display:flex;gap:11px;padding:8px;border-radius:12px;color:inherit}
.ml:hover,.ml:focus-visible{background:var(--inset)}
.ic{flex:none;width:30px;height:30px;border-radius:9px;background:var(--fill);color:var(--ink);display:flex;align-items:center;justify-content:center}
.mt b{display:block;font:500 14px/1.3 var(--head);letter-spacing:-.005em;color:var(--ink)}
.mt>span{display:block;margin-top:2px;font-size:12.5px;line-height:1.35;color:var(--text)}
.mb{display:inline-block;margin-left:8px;padding:1px 8px;border-radius:var(--r-pill);background:var(--orange-tint);color:var(--orange-ink);font:600 10.5px/1.5 var(--body);vertical-align:1px}
.mind a{display:block;padding:7px 8px;border-radius:9px;font-size:13.5px;line-height:1.3;color:var(--text)}
.mind a:hover,.mind a:focus-visible{background:var(--inset);color:var(--ink)}
.mcard{display:flex;flex-direction:column;gap:8px;align-self:stretch;padding:18px;border-radius:14px;background:var(--cons-bg);color:var(--cons-fg)}
.mct{font:600 17px/1.2 var(--head);letter-spacing:-.01em}
.mcp{font-size:13px;line-height:1.45;color:var(--cons-mute)}
.mcb{display:inline-flex;align-items:center;justify-content:center;margin-top:auto;height:40px;padding:0 16px;border-radius:12px;background:var(--cons-btn-bg);color:var(--cons-btn-fg);font:600 13.5px var(--body)}
.mcb:hover{background:color-mix(in srgb,var(--cons-btn-bg) 88%,#808080)}
.mcl{font-size:13px;color:var(--cons-link);text-decoration:underline;text-underline-offset:3px}
.mega a:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
.mcard a:focus-visible{outline-color:var(--cons-fg)}
@media (max-width:820px){
  .navtoggle{display:flex}
  .mega{top:68px;max-height:calc(100dvh - 92px);overflow:auto;padding:16px}
  .mobile-links{display:flex;flex-wrap:wrap;gap:6px 18px;padding:2px 8px 14px;margin-bottom:12px;border-bottom:1px solid var(--line)}
  .mobile-links a{font:500 15px var(--head);color:var(--ink)}
  .mg{grid-template-columns:1fr;gap:18px}
  .mcard{padding:16px}
}
@media (max-width:820px){.navr .menu{display:none}}
@media (max-width:560px){.mobile-theme{display:block;margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}.mobile-theme .theme{display:flex;width:max-content}.navbar img{flex:none}}
@media (prefers-reduced-motion:reduce){.mega:not([hidden]){animation:none}.menu .mi .chev{transition:none}}

/* ---------- product dropdown: a bento of the product features, sized by importance ---------- */
.mega-product{padding:14px}
.pgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(3,118px);gap:10px}
.tile{position:relative;overflow:hidden;display:block;border-radius:14px;background:var(--inset);padding:14px 16px;color:inherit}
.tile:hover,.tile:focus-visible{background:var(--fill)}
.tt b{display:block;font:500 14.5px/1.2 var(--head);letter-spacing:-.01em;color:var(--ink)}
.tt>span{display:block;margin-top:4px;font-size:12px;line-height:1.4;color:var(--text)}
.t-dist{grid-column:1/3;grid-row:1/3}.t-appr{grid-column:3/5;grid-row:1}.t-audit{grid-column:3;grid-row:2/4}
.t-esign{grid-column:4;grid-row:2}.t-ver{grid-column:1;grid-row:3}.t-ext{grid-column:2;grid-row:3}.t-pub{grid-column:4;grid-row:3}
.t-dist .tt{max-width:420px}.t-dist .tt b{font-size:20px}.t-dist .tt>span{font-size:13.5px;margin-top:6px}
.t-appr .tt{max-width:52%}.t-appr .tt b,.t-audit .tt b{font-size:16px}.t-appr .tt>span,.t-audit .tt>span{font-size:12.5px}
.tvis{position:absolute}
.mp{left:14px;right:14px;bottom:14px;display:flex;flex-direction:column;gap:6px;padding:8px;border-radius:11px;background:var(--card)}
.seg2{display:grid;grid-template-columns:repeat(3,1fr);padding:3px;border-radius:9px;background:var(--fill);font-size:11px}
.seg2 s{text-decoration:none;text-align:center;line-height:22px;color:var(--muted)}
.seg2 s.on{border-radius:7px;background:var(--card);color:var(--ink);font-weight:600;box-shadow:0 1px 2px rgba(0,0,0,.18)}
.pr{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:500;color:var(--ink)}
.pr .av{width:20px;height:20px;font-size:8px}
.pr span{flex:1}
.pr em{font-style:normal;padding:2px 9px;border-radius:10px;background:var(--ok-bg);color:var(--ok-fg);font-size:10.5px}
.steps{right:16px;top:50%;transform:translateY(-50%);display:flex;gap:12px}
.steps span{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:10.5px;color:var(--muted)}
.steps i{width:22px;height:22px;border-radius:50%;background:var(--ok-bg);color:var(--ok-fg);display:flex;align-items:center;justify-content:center}
.exp{right:16px;top:50%;transform:translateY(-50%);display:flex;align-items:center;gap:6px}
.exp .fm{padding:4px 9px;border-radius:7px;border:1px solid var(--line2);background:var(--card);font:500 11px var(--mono);color:var(--ink)}
.exp .ok{padding:4px 10px;border-radius:10px;background:var(--ok-bg);color:var(--ok-fg);font-size:11px;font-weight:500}
.chips{left:16px;right:12px;bottom:12px;display:flex;flex-wrap:wrap;gap:5px}
.chips span{padding:3px 9px;border-radius:8px;background:var(--card);font:500 10.5px var(--mono);color:var(--ink)}
.chips .cur{background:var(--orange-tint);color:var(--orange-ink)}
.chips .url{font-size:10px}
.t-esign{background:var(--orange)}
.t-esign:hover,.t-esign:focus-visible{background:color-mix(in srgb,var(--orange) 86%,#000)}
.t-esign .tt b,.t-esign .tt>span{color:#0a0a0a}
.t-esign .mb{background:#0a0a0a;color:#fff}
.sig{left:16px;bottom:8px}
.sig span{font:400 28px/1 "Mrs Saint Delafield",cursive;color:#0a0a0a}
.pall{margin-top:10px;text-align:right;font-size:13px}
.pall a{color:var(--ink);border-bottom:1px solid var(--line2)}
.pall a:hover{border-bottom-color:var(--ink)}
.tile:focus-visible{outline:2px solid var(--orange);outline-offset:-2px}
/* solutions dropdown */
.mg3{grid-template-columns:1fr 1.35fr .95fr}
.mega-sol{padding:22px}
@media (min-width:821px){.mega-mob{display:none!important}}
@media (max-width:820px){.mega-product,.mega-sol{display:none!important}}

.aud{display:flex;gap:5px}.aud span{padding:2px 9px;border-radius:8px;background:var(--orange-tint);color:var(--orange-ink);font:500 10.5px var(--mono)}

/* the audit tile is tall: its picture sits at the bottom */
.t-audit .exp{left:16px;right:16px;top:auto;bottom:16px;transform:none;flex-wrap:wrap}

/* product tiles alternate dark and white; orange is kept for e-sign only (dark tiles are black in light mode and light in dark mode) */
.tile.wh{background:var(--card);box-shadow:inset 0 0 0 1px var(--line)}
.tile.wh:hover,.tile.wh:focus-visible{background:var(--inset)}
.tile.dk{background:var(--ink)}
.tile.dk:hover,.tile.dk:focus-visible{background:color-mix(in srgb,var(--ink) 92%,var(--card))}
.tile.dk .tt b{color:var(--card)}
.tile.dk .tt>span{color:color-mix(in srgb,var(--card) 72%,transparent)}
.tile.dk .mp{background:color-mix(in srgb,var(--ink) 86%,var(--card))}
.tile.dk .seg2{background:color-mix(in srgb,var(--ink) 72%,var(--card))}
.tile.dk .seg2 s{color:color-mix(in srgb,var(--card) 55%,transparent)}
.tile.dk .seg2 s.on{background:var(--card);color:var(--ink)}
.tile.dk .pr{color:var(--card)}
.tile.dk .aud span{background:color-mix(in srgb,var(--orange) 24%,color-mix(in srgb,var(--ink) 86%,var(--card)));color:var(--orange)}
.tile.dk .exp .fm,.tile.dk .chips span{background:color-mix(in srgb,var(--ink) 80%,var(--card));border-color:transparent;color:var(--card)}
.tile.dk .chips .cur{background:color-mix(in srgb,var(--orange) 30%,color-mix(in srgb,var(--ink) 86%,var(--card)));color:var(--card)}
.tile.dk .exp .ok{background:color-mix(in srgb,#22c55e 38%,color-mix(in srgb,var(--ink) 86%,var(--card)));color:var(--card)}
.tile.dk:focus-visible{outline-color:var(--orange)}



/* ---------- solutions dropdown: three categories, their list, and (for departments) three photographs ---------- */
.mega-sol{padding:20px 22px 16px}
.sgrid{display:grid;grid-template-columns:170px 280px minmax(0,1fr);gap:26px;align-items:start;min-height:270px}
.scat{display:flex;flex-direction:column;gap:2px}
.scb{text-align:left;padding:10px 12px;border:0;border-radius:10px;background:none;font:500 17px/1.2 var(--head);letter-spacing:-.01em;color:var(--muted);cursor:pointer}
.scb:hover,.scb[aria-selected=true]{color:var(--ink)}
.scb[aria-selected=true]{background:var(--inset)}
.scb:focus-visible{outline:2px solid var(--orange);outline-offset:-2px}
.slp{list-style:none}
.slp a{display:block;padding:7px 10px;border-radius:9px;font:500 15.5px/1.25 var(--head);letter-spacing:-.01em;color:var(--ink)}
.slp a:hover,.slp a:focus-visible{background:var(--inset)}
.slp a:focus-visible{outline:2px solid var(--orange);outline-offset:-2px}
.simgs{display:flex;gap:8px;justify-content:flex-end}
.simgs[hidden]{display:none}
.simgs:not([hidden]){animation:mgin .2s var(--ease)}
.si{display:block;width:160px;height:270px;object-fit:cover;border-radius:14px}
@media (prefers-reduced-motion:reduce){.simgs:not([hidden]){animation:none}}

/* for consultants: an orange box inside the menu */
.scons{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:12px;padding:8px 10px 8px 18px;border-radius:14px;background:var(--orange);color:#0a0a0a}
.sct b{display:block;font:600 15px/1.2 var(--head);letter-spacing:-.01em}
.sct span{display:block;margin-top:1px;font-size:12.5px;color:rgba(10,10,10,.8)}
.sca{display:flex;align-items:center;gap:16px;flex:none}
.scb2{display:inline-flex;align-items:center;height:34px;padding:0 16px;border-radius:12px;background:#0a0a0a;color:#fff;font:600 13.5px var(--body)}
.scb2:hover{background:#262626}
.scl{font-size:13.5px;font-weight:500;color:#0a0a0a;border-bottom:1px solid #0a0a0a}
.scons a:focus-visible{outline:2px solid #0a0a0a;outline-offset:3px}
@media (max-width:820px){.scons{display:none}}

/* ---- 2026-10-16 review ---- */
/* people: one quiet tint, no pastels */
.mega .av{background:var(--fill)!important;color:var(--ink)!important}
.tile.dk .pr .av{background:color-mix(in srgb,var(--card) 18%,var(--ink))!important;color:var(--card)!important}
/* tags look like the product page: outlined, with a dot, in the body font */
.aud span,.tile.dk .aud span{display:inline-flex;align-items:center;gap:6px;padding:2px 9px;border-radius:999px;background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--line2);font:500 11px var(--body)}
.aud span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--muted)}
.tile.dk .aud span{color:var(--card);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--card) 30%,transparent)}
.tile.dk .aud span::before{background:color-mix(in srgb,var(--card) 60%,transparent)}
/* the tall audit tile: a product picture fills the space between the words and the export chips */
.t-audit .aimg{left:16px;right:16px;top:96px;bottom:50px;overflow:hidden;border-radius:10px;box-shadow:0 0 0 1px var(--line)}
.t-audit .aimg img{display:block;width:100%;height:100%;object-fit:cover;object-position:top left}
.t-audit .exp{bottom:14px}
.mega-product{padding-bottom:14px}

/* solutions: tabs, the list, and posts from Insights for that tab */
.sgrid{grid-template-columns:170px minmax(0,1fr) 330px;gap:24px;min-height:0}
.slp.sld a{padding:9px 10px}
.slp.sld b{display:block;font:500 15.5px/1.25 var(--head);letter-spacing:-.01em;color:var(--ink)}
.slp.sld span{display:block;margin-top:3px;font:400 13px/1.4 var(--body);letter-spacing:0;color:var(--text)}
.spost[hidden]{display:none}
.spost:not([hidden]){animation:mgin .2s var(--ease)}
.sph{margin:0 0 8px;font:500 13px/1.2 var(--head);color:var(--text)}
.spf{display:block;border-radius:12px;overflow:hidden}
.spa{container-type:inline-size;display:block;aspect-ratio:1200/630;background:#0a0a0a;color:#fff;font-family:var(--head)}
.spa-l{position:absolute;left:6cqw;top:6cqw;height:4cqw}.spa-l img{display:block;height:100%;width:auto}
.spa-c{position:absolute;left:6cqw;top:16.5cqw;font:600 3.6cqw/1 var(--head);white-space:nowrap}
.spa-t{position:absolute;left:6cqw;right:7cqw;top:22.5cqw;font:600 6.4cqw/1.1 var(--head);letter-spacing:-.03em;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.spa-a{position:absolute;left:6cqw;bottom:6cqw;display:flex;align-items:center;gap:2.4cqw;font:500 3.6cqw/1 var(--head);white-space:nowrap}
.spa-a i{display:grid;place-items:center;width:6.6cqw;height:6.6cqw;border-radius:50%;background:var(--orange);color:#0a0a0a;font:600 2.7cqw/1 var(--head);font-style:normal}
.spa-a em{font-style:normal;color:rgba(255,255,255,.6)}
.spl{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 2px;border-bottom:1px solid var(--line);font:500 13.5px/1.3 var(--head);letter-spacing:-.005em;color:var(--ink)}
.spl span{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.spl svg,.spm svg{flex:none;color:var(--muted)}
.spl:hover svg{color:var(--ink)}
.spm{display:inline-flex;align-items:center;gap:6px;margin-top:10px;font-size:13px;font-weight:500;color:var(--ink)}
.spf:focus-visible,.spl:focus-visible,.spm:focus-visible{outline:2px solid var(--orange);outline-offset:2px;border-radius:8px}

/* consultants: the same orange box everywhere, menu included */
.mcard{background:var(--orange);color:#0a0a0a}
.mcard .mcp{color:rgba(10,10,10,.78)}
.mcard .mcb{background:#0a0a0a;color:#fff}.mcard .mcb:hover{background:#262626}
.mcard .mcl{color:#0a0a0a}
.mcard a:focus-visible{outline-color:#0a0a0a}

/* phone menu: every section is one line that opens */
.mac{border-bottom:1px solid var(--line)}
.mac summary{list-style:none;display:flex;align-items:center;justify-content:space-between;padding:13px 8px;font:500 16px/1.2 var(--head);color:var(--ink);cursor:pointer}
.mac summary::-webkit-details-marker{display:none}
.mac summary:focus-visible{outline:2px solid var(--orange);outline-offset:-2px;border-radius:8px}
.mac .mch{color:var(--muted);transition:transform .2s var(--ease)}
.mac[open] .mch{transform:rotate(180deg)}
.mac .mind{padding:0 0 10px}
.mac .mind a{font-size:14.5px;padding:8px 8px 8px 16px}
.mob1{list-style:none;margin:0 0 4px}
.mob1 a{display:block;padding:13px 8px;border-bottom:1px solid var(--line);font:500 16px/1.2 var(--head);color:var(--ink)}
.mob1 a:focus-visible{outline:2px solid var(--orange);outline-offset:-2px;border-radius:8px}
@media (max-width:820px){.mg{gap:0}.mega-mob .mcard{margin-top:14px}}
@media (prefers-reduced-motion:reduce){.mac .mch,.spost:not([hidden]){transition:none;animation:none}}
.spa-t{font-size:5.8cqw;-webkit-line-clamp:3;bottom:16cqw}
.spa-t.s{font-size:5cqw}
.spl span{-webkit-line-clamp:2}
.mac .mind,.mac ul{list-style:none;margin:0;padding-left:0}
.spa-t{bottom:auto;top:21cqw}.spa-c{top:15cqw}
.spa-t.s{font-size:4.7cqw;line-height:1.1}
/* spacing: list sized to its words, posts aligned to the top of the list, even gaps */
.sgrid{grid-template-columns:170px minmax(0,1fr) 340px;gap:32px;align-items:start}
.slp li{display:flex}
.slp a{display:inline-block;padding:7px 12px}
.slp.sld a{display:block;max-width:420px}
.spost{display:flex;flex-direction:column}
.spl{padding:11px 2px}
.spl:first-of-type{margin-top:6px}
.spm{margin-top:12px;padding:2px 2px}
.spa-a em{margin-left:0}
.sgrid{min-height:330px}
/* every dropdown is the same height: Solutions is as tall as its longest list (Industry), Product matches it */
@media (min-width:821px){
  .sgrid{grid-template-columns:170px max-content minmax(0,1fr);gap:36px;height:268px;min-height:0}
  .slp.sld{max-width:360px}
  /* posts: a wider, shorter card fills the space, the title lines fit one line each */
  .spost{height:268px}
  .spf{flex:1;min-height:0;display:flex}
  .spa{container-type:normal;flex:1;aspect-ratio:auto;height:100%}
  .spa-l{left:20px;top:18px;height:14px}
  .spa-c{left:20px;top:46px;font-size:12.5px}
  .spa-t,.spa-t.s{left:20px;right:22px;top:66px;font-size:19px;line-height:1.15;-webkit-line-clamp:2}
  .spa-a{left:20px;bottom:16px;gap:9px;font-size:12.5px}
  .spa-a i{width:24px;height:24px;font-size:9.5px}
  .spl{padding:8px 2px}.spl:first-of-type{margin-top:4px}
  .spl span{-webkit-line-clamp:1}
  .spm{margin-top:8px}
  .mega-product{padding:14px}
  .pgrid{grid-template-rows:repeat(3,107px)}
  .t-audit .aimg{top:88px;bottom:46px}
}
@media (min-width:821px){
  .sgrid{grid-template-columns:170px 290px minmax(0,1fr)}
  .slp.sld a{padding:6px 10px}
  .slp.sld span{font-size:12.5px;margin-top:2px}
  .t-audit .aimg{top:112px;bottom:48px}
  .t-audit .tt>span{font-size:12px}
  .t-esign .tt>span{max-width:92%}
  .sig{bottom:4px}.sig span{font-size:22px}
}
/* product panel: a faint dot pattern behind the tiles, so each tile stands out */
.mega-product{background-color:var(--inset);background-image:radial-gradient(circle,var(--dot) 1.1px,transparent 1.5px);background-size:14px 14px;background-position:7px 7px}
.mega-product .tile.wh{background:var(--card);box-shadow:0 0 0 1px var(--line),0 8px 18px -14px rgba(0,0,0,.25)}
.mega-product .tile.wh:hover,.mega-product .tile.wh:focus-visible{background:color-mix(in srgb,var(--card) 92%,var(--ink))}
/* finer dot grid: smaller, softer dots that fade out toward the bottom, so the panel reads as texture, not noise */
.mega-product{position:absolute;background-image:none}
.mega-product::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background-image:radial-gradient(circle,color-mix(in srgb,var(--ink) 22%,transparent) .8px,transparent 1.2px);background-size:11px 11px;-webkit-mask-image:radial-gradient(120% 90% at 50% 0,#000 20%,transparent 85%);mask-image:radial-gradient(120% 90% at 50% 0,#000 20%,transparent 85%)}
.mega-product .pgrid{position:relative}
/* By Standard tab: no featured-post column; the list sits in four columns across the space of columns 2 and 3 */
.slp-std li{display:block;break-inside:avoid}
@media (min-width:821px){
  .slist:has(.slp-std:not([hidden])){grid-column:2/-1}
  .slp-std:not([hidden]){column-count:4;column-gap:8px}
  .slp-std a{display:block;padding:4px 8px;font-size:14px;line-height:1.3}
}
/* compare strip under the Product tiles (Sid 2026-10-22) */
.pcmp{margin-top:10px;display:flex;align-items:center;gap:14px;padding:13px 16px;border-radius:14px;background:var(--card);box-shadow:0 0 0 1px var(--line);color:var(--text);text-decoration:none;font-size:13.5px;line-height:1.4}
.pcmp b{font:600 14px/1.3 var(--head);color:var(--ink);flex:none}
.pcmp span{flex:1;min-width:0}
.pcmp svg{flex:none;color:var(--ink);transition:transform .2s var(--ease)}
.pcmp:hover,.pcmp:focus-visible{background:color-mix(in srgb,var(--card) 92%,var(--ink))}
.pcmp:hover svg{transform:translateX(3px)}
.pcmp:focus-visible{outline:2px solid var(--orange);outline-offset:2px}
.slp .slall a{font-weight:600;color:var(--ink)}