/* hearbyhq.com, 2026-09-23 additions: the full Conduit nav, the glass ask pill, product and industry page
 * templates, and the live motion panels. Numbers are Conduit's, measured live on www.conduit.ai on
 * 2026-09-23 (vault 02 Ventures/HearbyHQ/09 Evidence/2026-09-23-site-v3.md lists each probe). */

/* ----- nav, three menus ----- */
.dd-mid{width:710px}                                                   /* Industries and Resources panels, 710 wide */
.dd-grid-short{grid-template-columns:repeat(3,1fr)}
.dd-i.dd-s{height:auto;padding:8px 8px 10px}
.dd-split{display:grid;grid-template-columns:1fr 255px;gap:24px;padding:14px}
.dd-cols{display:grid;grid-template-columns:1fr 1fr;margin-top:6px}
.dd-cols ul{list-style:none;display:flex;flex-direction:column;gap:0;padding:0 10px}
.dd-cols ul+ul{border-left:1px solid var(--line)}
.dd-cols a{display:block;padding:6px 0;font:450 16px/20px var(--body);color:var(--ink-80);transition:color var(--d-fast) var(--e-std)}
.dd-cols a:hover{color:var(--ink)}
.dd-promo{border-radius:4px;background:var(--surface-alt);padding:12px 12px 14px;display:flex;flex-direction:column;gap:10px}
.dd-promo .dd-f{white-space:normal}
.dd-pp{font:400 14px/18px var(--body);color:var(--muted)}
.dd-promo .btn{margin-top:6px;width:100%}
.mm-h{padding:18px 20px 6px;font:450 12px/1.2 var(--body);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
@media (max-width:1100px){.links .nl[href="/company"]{display:none}}
@media (max-width:980px){.links .nl[href="/process"]{display:none}}

/* ----- glass ask pill, Conduit's widget (hai-glass-*), measured 320 x 48, bottom 31 ----- */
.pill-wrap{position:fixed;left:50%;bottom:31px;z-index:25;width:320px;margin-left:-160px;display:flex;flex-direction:column;align-items:center;gap:6px;transition:opacity var(--d-fast) var(--e-out),transform var(--d-fast) var(--e-out)}
.pill-wrap.away{opacity:0;transform:translateY(8px);pointer-events:none}
.pill{position:relative;width:320px;height:48px;display:flex;align-items:center;gap:9px;padding:8px 8px 8px 16px;border-radius:24px;background:rgba(30,27,23,.52);-webkit-backdrop-filter:blur(36px) saturate(1.4);backdrop-filter:blur(36px) saturate(1.4);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 0 1px rgba(30,27,23,.2),0 0 32px rgba(30,27,23,.14)}
.pill textarea{flex:1;min-width:0;height:20px;resize:none;border:0;outline:none;background:none;font:400 14px/20px var(--inter);color:#F7F6F6;overflow:hidden}
.pill textarea::placeholder{color:rgba(247,246,246,.72);transition:opacity .18s ease}
.pill textarea.ph-out::placeholder{opacity:0}
.pill-send{flex:none;width:32px;height:32px;border-radius:9999px;background:#F7F6F6;color:#1E1B17;display:flex;align-items:center;justify-content:center;transition:transform var(--d-fast) var(--e-out)}
.pill-send:active{transform:scale(.94)}
.pill-send svg{width:16px;height:16px}
.pill-note{font:400 10px/15px var(--inter);color:rgba(30,27,23,.72)}
@media (max-width:767px){.pill-wrap{bottom:16px}.pill-note{display:none}}

/* ----- hero meta row, in the slot Conduit uses for its G2 rating ----- */
.hero-meta{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 18px;margin-top:-4px;font:450 14px/1.2 var(--body);color:var(--ink-64)}
.hero-meta span{display:inline-flex;align-items:center;gap:6px}
.hero-meta svg{width:14px;height:14px}

/* ----- platform strip, in place of Conduit's logo wall (no client logos exist yet) ----- */
.strip{margin-top:48px;text-align:center}
.strip>p{font:400 14px/1.2 var(--body);color:var(--muted)}
.strip-row{margin-top:28px;display:grid;grid-template-columns:repeat(5,1fr);align-items:center}
.strip-row div{display:flex;align-items:center;justify-content:center;gap:10px;height:56px;color:var(--ink-64);font:450 18px/1 var(--body)}
.strip-row div+div{border-left:1px solid var(--line)}
.strip-row svg{width:22px;height:22px}

/* ----- live motion panels ----- */
.mo{position:relative;font-family:var(--inter);color:var(--n900);text-align:left}
.mo [data-t]{opacity:0;transform:translateY(6px);transition:opacity .35s var(--e-demo),transform .35s var(--e-demo),background-color .3s var(--e-std),color .3s var(--e-std),border-color .3s var(--e-std)}
.mo [data-t].on{opacity:1;transform:none}
.mo [data-t].pop{transform:scale(.94)}
.mo [data-t].pop.on{transform:none}
.mo [data-t].stay{opacity:1;transform:none}
.mo .caret::after{content:"";display:inline-block;width:1px;height:1em;margin-left:1px;vertical-align:-2px;background:var(--blue-700);animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.panel{background:var(--canvas);border:1px solid var(--n300);border-radius:var(--r-xl);overflow:hidden}
.panel-h{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 16px;border-bottom:1px solid var(--n300)}
.panel-h p{font:500 14px/16px var(--inter);color:var(--n700)}
.panel-h small{font:400 12px/14px var(--inter);color:var(--n600)}
.bdg{display:inline-flex;align-items:center;gap:4px;padding:1px 6px;border-radius:9999px;font:500 11px/16px var(--inter);background:var(--n200);color:var(--n700);white-space:nowrap}
.bdg.blue{background:#E6F4FF;color:#0072CC}
.bdg.green{background:#E7F8EE;color:#11813F}
.bdg.orange{background:#FFF1E5;color:#C24E00}
.bdg svg{width:11px;height:11px}
.dot{display:inline-block;width:6px;height:6px;border-radius:9999px;background:var(--n400)}
.dot.green{background:#22C55E}

/* research list */
.mr-row{display:flex;align-items:center;gap:12px;padding:10px 16px;border-bottom:1px solid var(--n200)}
.mr-row:last-child{border-bottom:0}
.mr-th{flex:none;width:28px;height:40px;border-radius:5px;background:linear-gradient(160deg,var(--a,#9BD4F5),var(--b,#F4B183));position:relative;overflow:hidden}
.mr-th::after{content:"";position:absolute;left:50%;top:50%;width:0;height:0;margin:-4px 0 0 -2px;border-left:6px solid rgba(255,255,255,.9);border-top:4px solid transparent;border-bottom:4px solid transparent}
.mr-tx{flex:1;min-width:0}
.mr-hook{font:500 12px/16px var(--inter);color:var(--n900);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mr-fmt{font:400 11px/14px var(--inter);color:var(--n600);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mr-x{flex:none;font:600 12px/14px var(--inter);color:var(--n900);font-variant-numeric:tabular-nums}
.mr-row{position:relative}
.mr-row>*:not(.mr-hl){position:relative;z-index:1}
.mr-hl{position:absolute;inset:0;background:#F5FAFF;box-shadow:inset 2px 0 0 var(--blue-700)}
.mo .mr-hl[data-t]{transform:none}
.mo-toast{position:absolute;left:50%;bottom:14px;transform:translate(-50%,6px)!important;display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:8px;background:var(--n900);color:#fff;font:500 12px/14px var(--inter);box-shadow:0 4px 16px rgba(0,0,0,.16);white-space:nowrap}
.mo-toast.on{transform:translate(-50%,0)!important}
.mo-toast svg{width:12px;height:12px}

/* script document */
.ms-sec{padding:10px 16px;border-bottom:1px solid var(--n200);display:flex;flex-direction:column;gap:5px}
.ms-sec:last-child{border-bottom:0}
.ms-k{font:500 11px/14px var(--inter);color:var(--n600);text-transform:none}
.ms-line{font:400 13px/19px var(--inter);color:var(--n900);min-height:19px}
.ms-dir{font:500 12px/17px var(--inter);color:var(--blue-700);min-height:17px}
.ms-status{position:relative;display:inline-grid}
.ms-status>*{grid-area:1/1}
.mo .ms-status .bdg[data-t]{transform:none}

/* edited short: phone with word-by-word captions, and a timeline */
.me{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;gap:18px}
.me-phone{position:relative;flex:none;width:186px;aspect-ratio:9/16;border-radius:22px;overflow:hidden;background:#1E1B17;border:5px solid #1E1B17;box-shadow:0 12px 32px rgba(30,27,23,.22)}
.me-feed{position:absolute;inset:0;background:var(--feed,url(/media/hero-bg.jpg)) center/cover;transform:scale(1.08);will-change:transform}
.mo.play .me-feed{animation:feed 9s ease-in-out infinite alternate}
@keyframes feed{from{transform:scale(1.08) translateX(-4%)}to{transform:scale(1.18) translateX(4%)}}
.me-feed::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.18),rgba(0,0,0,0) 30%,rgba(0,0,0,0) 60%,rgba(0,0,0,.35))}
.me-prog{position:absolute;left:10px;right:10px;top:10px;height:3px;border-radius:2px;background:rgba(255,255,255,.35);overflow:hidden}
.me-prog i{position:absolute;inset:0;background:#fff;transform-origin:left;transform:scaleX(0)}
.mo.play .me-prog i{animation:prog var(--dur,8s) linear forwards}
@keyframes prog{to{transform:scaleX(1)}}
.me-hook{position:absolute;left:12px;right:12px;top:30px;padding:6px 8px;border-radius:6px;background:rgba(255,255,255,.94);font:700 11px/14px var(--inter);color:#1E1B17;text-align:center}
.me-cap{position:absolute;left:10px;right:10px;top:58%;display:flex;flex-wrap:wrap;justify-content:center;gap:3px 4px}
.me-cap span{font:800 15px/19px var(--inter);color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.45);padding:0 3px;border-radius:4px}
.mo .me-cap span[data-t]{transform:translateY(4px) scale(.9)}
.mo .me-cap span[data-t].on{transform:none}
.me-cap span.hot{background:var(--blue-700)}
.me-rail{position:absolute;right:8px;bottom:44px;display:flex;flex-direction:column;gap:10px;color:#fff}
.me-rail i{display:block;width:22px;height:22px;border-radius:9999px;background:rgba(255,255,255,.28)}
.me-handle{position:absolute;left:10px;bottom:12px;right:40px;font:600 10px/13px var(--inter);color:#fff}
.me-handle em{display:block;font-style:normal;font-weight:400;opacity:.85}
.me-tl{flex:none;width:280px}
.me-tracks{position:relative;padding:12px 16px 14px;display:flex;flex-direction:column;gap:7px}
.me-tr{display:flex;align-items:center;gap:8px}
.me-tr b{flex:none;width:44px;font:500 10px/12px var(--inter);color:var(--n600)}
.me-tr div{flex:1;display:flex;gap:3px;height:16px}
.me-tr div i{display:block;height:100%;border-radius:3px;background:var(--c,#CFE8FF)}
.me-play{position:absolute;top:8px;bottom:8px;left:68px;width:2px;background:var(--blue-700);border-radius:1px}
.me-play::before{content:"";position:absolute;top:-3px;left:-3px;width:8px;height:8px;border-radius:9999px;background:var(--blue-700)}
.mo.play .me-play{animation:playhead var(--dur,8s) linear forwards}
@keyframes playhead{to{left:calc(100% - 18px)}}

/* calendar */
.mc-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:0;border-top:0}
.mc-grid>.mc-d{padding:6px 0;text-align:center;font:500 10px/12px var(--inter);color:var(--n600);border-bottom:1px solid var(--n200)}
.mc-cell{min-height:64px;padding:5px;border-right:1px solid var(--n200);border-bottom:1px solid var(--n200);display:flex;flex-direction:column;gap:4px}
.mc-cell:nth-child(7n){border-right:0}
.mc-n{font:500 10px/12px var(--inter);color:var(--n400)}
.mc-post{display:flex;align-items:center;gap:4px;padding:3px 5px;border-radius:5px;background:var(--n100);border:1px solid var(--n200);font:500 10px/12px var(--inter);color:var(--n700);white-space:nowrap;overflow:hidden}
.mc-post svg{flex:none;width:10px;height:10px}
.mc-post .dot{flex:none;margin-left:auto;width:5px;height:5px;transition:background-color .3s}
.mc-post.live .dot{background:#22C55E}

/* bar chart */
.mb{display:flex;align-items:flex-end;gap:10px;height:110px;padding:14px 16px 0}
.mb i{flex:1;display:block;height:var(--h);border-radius:4px 4px 0 0;background:#CFE8FF;transform-origin:bottom;transform:scaleY(0);transition:transform .7s var(--e-out)}
.mo .mb i[data-t]{opacity:1;transform:scaleY(0);transition:transform .7s var(--e-out)}
.mo .mb i[data-t].on{transform:scaleY(1)}
.mb i.top{background:var(--blue-700)}
.mb-axis{display:flex;gap:10px;padding:6px 16px 10px;border-bottom:1px solid var(--n200)}
.mb-axis span{flex:1;text-align:center;font:400 10px/12px var(--inter);color:var(--n600)}
.kv{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 16px;border-bottom:1px solid var(--n200);font:400 12px/14px var(--inter)}
.kv:last-child{border-bottom:0}
.kv span{color:var(--n600)}
.kv b{font-weight:500;color:var(--n900);text-align:right}

/* message thread */
.mt{display:flex;flex-direction:column;gap:8px;padding:14px}
.mt-m{max-width:78%;padding:8px 10px;border-radius:12px;font:400 12px/16px var(--inter)}
.mt-m small{display:block;margin-bottom:2px;font:500 10px/12px var(--inter);color:var(--n600)}
.mt-m.them{align-self:flex-start;background:var(--n100);color:var(--n900);border-top-left-radius:4px}
.mt-m.us{align-self:flex-end;background:var(--n900);color:#fff;border-top-right-radius:4px}
.mt-m.us small{color:rgba(255,255,255,.64)}
.mt-typing{align-self:flex-start;display:flex;gap:3px;padding:10px 12px;border-radius:12px;background:var(--n100)}
.mt-typing i{width:5px;height:5px;border-radius:9999px;background:var(--n400)}
.mt-typing.on i{animation:typing 1s infinite}
.mt-typing i:nth-child(2){animation-delay:.15s}.mt-typing i:nth-child(3){animation-delay:.3s}
@keyframes typing{50%{transform:translateY(-3px);background:var(--n600)}}

/* connected accounts */
.ma-row{display:flex;align-items:center;gap:10px;padding:11px 16px;border-bottom:1px solid var(--n200);font:500 13px/16px var(--inter);color:var(--n900)}
.ma-row:last-child{border-bottom:0}
.ma-row>svg{width:16px;height:16px;flex:none}
.ma-row .sp{flex:1}
.tg{position:relative;flex:none;width:28px;height:16px;border-radius:9999px;background:var(--n300);transition:background-color .3s var(--e-std)}
.tg::after{content:"";position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:9999px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.2);transition:transform .3s var(--e-out)}
.mo .tg[data-t]{opacity:1;transform:none}
.tg.on{background:var(--blue-700)}
.tg.on::after{transform:translateX(12px)}

/* hook chips and checklist */
.mh{display:flex;flex-direction:column;gap:8px;padding:14px}
.mh-c{display:flex;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--n200);border-radius:8px;background:#fff;font:500 12px/15px var(--inter);color:var(--n900)}
.mh-c b{margin-left:auto;font-weight:600;color:var(--n600);font-variant-numeric:tabular-nums}
.mk{display:flex;align-items:center;gap:10px;padding:9px 16px;border-bottom:1px solid var(--n200);font:400 12px/15px var(--inter);color:var(--n900)}
.mk:last-child{border-bottom:0}
.cb{position:relative;flex:none;width:14px;height:14px;border-radius:4px;border:1px solid var(--n400);background:#fff;transition:background-color .25s,border-color .25s}
.cb svg{position:absolute;inset:1px;width:10px;height:10px;color:#fff;opacity:0;transition:opacity .2s}
.mo .cb[data-t]{opacity:1;transform:none}
.cb.on{background:var(--blue-700);border-color:var(--blue-700)}
.cb.on svg{opacity:1}

/* channel hub, Conduit's "Answer across channels" graphic */
.hub{position:relative;width:100%;height:100%}
.hub-c{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:14px;background:#fff;border:1px solid var(--n300);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(30,27,23,.08);color:var(--ink)}
.hub-c svg{width:34px;height:34px}
.hub-n{position:absolute;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:10px;background:rgba(255,255,255,.92);border:1px solid var(--n300);display:flex;align-items:center;justify-content:center;color:var(--n700)}
.hub-n svg{width:18px;height:18px}
.hub svg.hub-l{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.hub-l line{stroke:rgba(255,255,255,.9);stroke-width:1.5;stroke-dasharray:4 5}
.hub.live .hub-l line{animation:dash 1.6s linear infinite}
@keyframes dash{to{stroke-dashoffset:-18}}

/* ----- home hero stage: three live panels on the bokeh ----- */
.stage{position:absolute;inset:0}
.stage .st-script{position:absolute;left:calc(50% - 470px);top:70px;width:300px}
.stage .st-phone{position:absolute;left:50%;top:44px;margin-left:-106px}
.stage .st-phone .me-phone{width:212px}
.stage .st-cal{position:absolute;left:calc(50% + 160px);top:96px;width:320px}
.stage .st-note{position:absolute;left:calc(50% + 160px);top:420px;width:320px}

/* card media: panels inside Conduit's product cards and grid tiles */
.cm{position:absolute;left:24px;right:24px;top:28px;bottom:-12px}
.cm-c{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.gm-p{position:absolute;left:40px;right:40px;top:92px;bottom:-20px}

/* ----- product page template, measured on conduit.ai/product/agents ----- */
.ph{position:relative;min-height:692px;padding-top:120px;text-align:center;overflow:hidden}
.ph::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--bg,url(/media/pricing-hero.jpg)) center top/cover no-repeat;-webkit-mask-image:linear-gradient(180deg,#000 45%,transparent);mask-image:linear-gradient(180deg,#000 45%,transparent)}
.ph .hero-col{gap:28px}
.ph-mark{width:40px;height:40px;color:var(--ink)}
.ph-mark svg{width:40px;height:40px}
.ph .t-eye{color:var(--ink-64)}
.ph .t-h1{max-width:660px}
.ph .t-xl{max-width:480px;color:var(--ink-64)}
.pillars{max-width:1160px;margin:88px auto 0;padding:0 20px;display:grid;grid-template-columns:repeat(3,1fr);gap:40px;text-align:left}
.pillar{border-left:1px solid var(--line);padding:0 0 0 18px;display:flex;flex-direction:column;gap:10px}
.pillar h3{font:450 18px/1.2 var(--body);color:var(--ink)}
.pillar p{font:400 14px/1.3 var(--body);color:var(--muted);max-width:280px}
.cen{margin-top:120px;text-align:center}
.cen .t-h2{max-width:560px;margin:0 auto}
.cen .t-lg{max-width:480px;margin:24px auto 0;color:var(--muted)}
.frows{margin-top:100px;display:flex;flex-direction:column;gap:120px}
.frow{display:grid;grid-template-columns:374px 650px;justify-content:space-between;align-items:center;gap:40px 136px}
.frow.flip{grid-template-columns:650px 374px}
.frow.flip .ft{order:2}
.ft{display:flex;flex-direction:column;align-items:flex-start;gap:20px}
.ft .t-eye{color:var(--muted)}
.ft h3{font:400 32px/1 var(--serif);letter-spacing:-.03em}
.ft p{font:400 16px/1.3 var(--body);color:var(--muted)}
.ft .btn{margin-top:4px}
.fmedia{display:flex;flex-direction:column;gap:5.5px}
.fm{position:relative;height:404px;border-radius:var(--r-md);overflow:hidden;background:var(--surface-alt)}
.fm-view{position:absolute;inset:0;opacity:0;transition:opacity var(--d-fast) var(--e-out);pointer-events:none}
.fm-view.on{opacity:1;pointer-events:auto}
.fm .cm{left:17%;right:17%;top:36px;bottom:-14px}              /* Conduit feature panels sit about two thirds of the card wide */
.irow .fm .cm{left:14%;right:14%}
.chips{display:grid;grid-template-columns:repeat(3,1fr);gap:5.5px}
.chip{display:flex;align-items:center;gap:10px;height:48px;padding:12px 16px;background:var(--surface);font:450 18px/18px var(--body);color:var(--ink-80);text-align:left;transition:background-color var(--d-fast) var(--e-std),color var(--d-fast) var(--e-std)}
.chip svg{width:18px;height:18px;flex:none;color:var(--ink-64)}
button.chip:hover{background:var(--surface-alt)}
button.chip[aria-pressed="true"]{background:var(--surface-alt);color:var(--ink)}
.chips-v{grid-template-columns:1fr;gap:6px}
.chips-v .chip{border-radius:var(--r-md);gap:14px;padding:0 16px}

/* industry page variant: text column holds the chips, media on the other side */
.irow{display:grid;grid-template-columns:413px 1fr;gap:64px 120px;align-items:center}
.irow.flip{grid-template-columns:1fr 413px}
.irow.flip .it{order:2}
.it{display:flex;flex-direction:column;gap:64px}
.it .ft{gap:20px}
.irow .fm{height:420px}
.ih{position:relative;min-height:520px;padding-top:110px;text-align:center;overflow:hidden}
.ih::before{content:"";position:absolute;left:50%;top:-760px;width:1800px;height:1800px;margin-left:-900px;z-index:-1;border-radius:50%;background:repeating-radial-gradient(circle at center,transparent 0 23px,var(--line) 23px 24px);-webkit-mask-image:radial-gradient(circle at center,#000 30%,transparent 62%);mask-image:radial-gradient(circle at center,#000 30%,transparent 62%);opacity:.8}
.ih .hero-col{gap:28px}
.ih .t-eye{color:var(--ink-64)}
.ih .t-xl{max-width:480px;color:var(--ink-64)}

/* use cases, conduit industry "Dive deeper": r10 p20 bg surface, title Season 18 */
.uc-g{margin-top:56px;display:flex;flex-direction:column;gap:48px}
.uc-g h3.t-h5l{margin-bottom:18px}
.ucs{display:grid;grid-template-columns:repeat(3,1fr);gap:9.96px}
.uc{border-radius:var(--r-lg);background:var(--surface);padding:20px;display:flex;flex-direction:column;gap:8px}
.uc h4{font:400 18px/1.2 var(--serif);letter-spacing:-.02em;color:var(--ink)}
.uc p{font:450 14px/1.2 var(--body);color:var(--muted)}

/* ----- research carousel, Conduit's customer row ----- */
.car{margin-top:64px}
.car-track{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 -20px;padding:0 20px}
.car-track::-webkit-scrollbar{display:none}
.car-c{flex:none;width:270px;scroll-snap-align:start;border-radius:var(--r-md);background:var(--surface);overflow:hidden;display:flex;flex-direction:column}
.car-img{position:relative;height:200px;overflow:hidden;background:var(--surface-alt)}
.car-img .me-phone{position:absolute;left:50%;top:18px;width:120px;margin-left:-60px;border-width:4px;border-radius:16px}
.car-img .me-hook{font-size:8px;line-height:11px;top:20px;left:8px;right:8px;padding:4px 5px}
.car-b{padding:14px 14px 16px;display:flex;flex-direction:column;gap:14px;flex:1}
.car-b p{font:400 14px/1.3 var(--body);color:var(--ink-80)}
.car-b small{margin-top:auto;font:450 11px/1.2 var(--body);letter-spacing:.06em;text-transform:uppercase;color:var(--muted-2)}
.car-nav{margin-top:18px;display:flex;gap:8px}
.car-nav button{width:32px;height:32px;border-radius:9999px;border:1px solid var(--ink-16);display:flex;align-items:center;justify-content:center;color:var(--ink-80);transition:background-color var(--d-fast) var(--e-std),opacity var(--d-fast)}
.car-nav button:hover{background:var(--ink-5)}
.car-nav button:disabled{opacity:.35;cursor:default}
.car-nav svg{width:14px;height:14px}
.car-foot{margin-top:40px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.car-foot p{max-width:420px;color:var(--muted)}

/* ----- trust trio, Conduit's security band ----- */
.trio{margin-top:80px;display:grid;grid-template-columns:repeat(3,1fr);gap:40px;text-align:center}
.trio-i{display:flex;flex-direction:column;align-items:center;gap:20px}
.seal{width:120px;height:120px;border-radius:9999px;background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 0 0 10px var(--surface),0 0 0 11px var(--line),0 8px 24px rgba(30,27,23,.08);color:var(--ink)}
.seal.seal-ink{background:var(--coal);color:#fff}
.seal svg{width:36px;height:36px}
.trio-i h3{margin-top:18px}
.trio-i p{max-width:300px;font:400 14px/1.3 var(--body);color:var(--muted)}
.cen-h{text-align:center}
.cen-h .t-h2{max-width:560px;margin:80px auto 0}

/* ----- process timeline ----- */
.tl{margin-top:80px;display:grid;grid-template-columns:repeat(4,1fr);gap:9.96px}
.tl-c{border-radius:var(--r-lg);background:var(--surface);padding:20px;display:flex;flex-direction:column;gap:14px;min-height:260px}
.tl-c .t-eye{color:var(--muted)}
.tl-c h3{font:400 24px/1.08 var(--serif);letter-spacing:-.03em}
.tl-c p{font:400 14px/1.3 var(--body);color:var(--muted)}
.tl-c ul{margin-top:auto;list-style:none;display:flex;flex-direction:column;gap:8px;padding-top:12px;border-top:1px solid var(--line)}
.tl-c li{display:flex;gap:8px;font:450 13px/1.3 var(--body);color:var(--ink-80)}
.tl-c li svg{flex:none;width:14px;height:14px;margin-top:2px;color:var(--ink-64)}
.split2{margin-top:80px;display:grid;grid-template-columns:1fr 1fr;gap:9.96px}
.split2>div{border-radius:var(--r-lg);padding:28px;display:flex;flex-direction:column;gap:18px}
.split2 .you{background:var(--surface)}
.split2 .us{background:var(--coal);color:#fff}
.split2 .us .t-eye{color:#FFFFFFA3}
.split2 ul{list-style:none;display:flex;flex-direction:column;gap:12px}
.split2 li{display:flex;gap:10px;font:400 16px/1.3 var(--body)}
.split2 li svg{flex:none;width:16px;height:16px;margin-top:3px}
.split2 .you li{color:var(--ink-80)}
.split2 .us li{color:#FFFFFFCC}

/* ----- prose page (method, company) ----- */
.prose{max-width:720px;margin:0 auto}
.prose h2{margin-top:72px;font:400 32px/1.05 var(--serif);letter-spacing:-.03em}
.prose h3{margin-top:36px;font:400 22px/1.1 var(--serif);letter-spacing:-.03em}
.prose p,.prose li{margin-top:16px;font:400 17px/1.55 var(--body);color:var(--ink-80)}
.prose ul{margin-top:16px;padding-left:22px;list-style:disc}
.prose li{margin-top:8px}
.prose li::marker{color:var(--ink-28)}
.prose strong{font-weight:600;color:var(--ink)}
.prose a{text-decoration:underline;text-underline-offset:4px}
.prose .fig{margin:40px -80px 0;position:relative;height:380px;border-radius:var(--r-lg);overflow:hidden;background:var(--surface-alt)}

/* ----- contact ----- */
.ct{margin-top:64px;display:grid;grid-template-columns:repeat(3,1fr);gap:9.96px}
.ct a{border-radius:var(--r-lg);background:var(--surface);padding:24px;display:flex;flex-direction:column;gap:14px;min-height:200px;transition:background-color var(--d-fast) var(--e-std)}
.ct a:hover{background:var(--surface-alt)}
.ct svg{width:24px;height:24px;color:var(--ink)}
.ct h3{margin-top:auto;font:400 24px/1.08 var(--serif);letter-spacing:-.03em}
.ct p{font:400 14px/1.3 var(--body);color:var(--muted)}

/* ----- book a call: Conduit book-demo split, right card on the bokeh ----- */
.ap-side{position:relative;border-radius:10px;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:28px}
.bk-card{position:relative;z-index:1;width:100%;max-width:340px;background:#fff;border:1px solid var(--n300);border-radius:var(--r-xl);padding:22px;font-family:var(--inter);box-shadow:0 12px 32px rgba(30,27,23,.12)}
.bk-card h2{font:400 22px/1.15 var(--serif);letter-spacing:-.03em;color:var(--ink)}
.bk-steps{margin-top:16px;display:flex;flex-direction:column;gap:12px}
.bk-step{display:flex;gap:10px}
.bk-step b{flex:none;width:22px;height:22px;border-radius:9999px;background:var(--n200);display:flex;align-items:center;justify-content:center;font:600 11px/1 var(--inter);color:var(--n700)}
.bk-step p{font:400 13px/18px var(--inter);color:var(--n700)}
.bk-step p strong{display:block;font-weight:600;color:var(--n900)}
.bk-list{margin-top:16px;padding:12px;border-radius:10px;background:var(--n100);display:flex;flex-direction:column;gap:8px}
.bk-list div{display:flex;align-items:center;gap:8px;font:400 12px/16px var(--inter);color:var(--n700)}
.bk-list svg{width:14px;height:14px;flex:none;color:var(--n600)}
.bk-list b{font-weight:600;color:var(--n900)}
.ap-prog{height:3px;border-radius:2px;background:var(--n200);margin-top:14px;overflow:hidden}
.ap-prog i{display:block;height:100%;width:33.3%;background:var(--blue-700);transition:width .3s var(--e-out)}

/* ----- responsive ----- */
@media (max-width:1200px){
  .frow,.frow.flip{grid-template-columns:1fr 1.4fr;gap:40px 64px}
  .frow.flip{grid-template-columns:1.4fr 1fr}
  .irow,.irow.flip{grid-template-columns:1fr 1.3fr;gap:40px 64px}
  .irow.flip{grid-template-columns:1.3fr 1fr}
  .stage .st-script{left:24px}
  .stage .st-cal,.stage .st-note{left:auto;right:24px}
}
@media (max-width:900px){
  .frow,.frow.flip,.irow,.irow.flip{grid-template-columns:1fr}
  .frow.flip .ft,.irow.flip .it{order:0}
  .pillars{grid-template-columns:1fr;gap:24px;margin-top:56px}
  .tl{grid-template-columns:1fr 1fr}
  .ucs,.ct{grid-template-columns:1fr 1fr}
  .trio{grid-template-columns:1fr;gap:56px}
  .stage .st-script,.stage .st-cal,.stage .st-note{display:none}
  .prose .fig{margin:40px 0 0}
}
@media (max-width:767px){
  .nav-hide-sm{display:none}
  .strip-row{grid-template-columns:repeat(3,1fr);row-gap:8px}
  .strip-row div:nth-child(4){border-left:0}
  .strip-row div{font-size:15px}
  .fm{height:340px}
  .chips{grid-template-columns:1fr}
  .tl,.ucs,.ct,.split2{grid-template-columns:1fr}
  .ph{min-height:0;padding:72px 0 0}
  .ih{min-height:0;padding-top:72px}
  .frows{gap:80px;margin-top:64px}
  .cen{margin-top:88px}
  .me-tl{display:none}
  .car-foot{flex-direction:column;align-items:flex-start}
  .dd-split{grid-template-columns:1fr}
}

/* ----- footer additions: talk block and the second link row (Conduit's footer SEO row) ----- */
.foot-talk{width:300px;flex:none;display:flex;flex-direction:column;gap:14px}
.foot-talk h3{font:450 12px/1.2 var(--body);letter-spacing:.06em;text-transform:uppercase;color:#FFFFFF8F}
.foot-talk p{font:400 14px/1.3 var(--body);color:#FFFFFFA3}
.foot-talk-a{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.foot-mail{font:400 14px/1.2 var(--body);color:#FFFFFFCC;transition:color var(--d-fast) var(--e-std)}
.foot-mail:hover{color:var(--canvas)}
.foot-seo{display:grid;grid-template-columns:repeat(4,1fr);gap:40px;padding-top:48px;border-top:1px solid #FFFFFF24}
@media (max-width:1000px){.foot-top{flex-wrap:wrap}.foot-talk{width:100%}}
@media (max-width:767px){.foot-seo{grid-template-columns:1fr 1fr;gap:32px 24px}}

/* ----- pitch deck (/deck/<token>): the site's own sections, one per screen ----- */
html:has(body.dk){scroll-snap-type:y proximity}
.dk .slide{min-height:100svh;scroll-snap-align:start;display:flex;flex-direction:column;justify-content:center;padding:96px 0 88px;margin:0}
.dk .slide.dark{margin:0}
.dk .slide .lbl{margin-bottom:0}
.dk .slide .cards3,.dk .slide .trio,.dk .slide .tiers{margin-top:48px}
.dk .dk-cover{padding-top:140px}
.dk .dk-cover .hero-col{display:flex;flex-direction:column;gap:24px;max-width:760px}
.dk-top{position:fixed;inset:0 0 auto 0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 28px;background:var(--head-bg);border-bottom:1px solid var(--head-line)}
.dk-top .logo svg{height:20px;display:block}
.dk-top .t-eye{color:var(--muted)}
.dk-four{margin-top:48px;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.dk-four .tile{cursor:default;background:#FFFFFF08}
.dk-four .tile h3{color:var(--canvas)}
.dk-light .tile{background:var(--surface);color:var(--ink)}
.dk-light .tile .ix,.dk-light .tile h3{color:var(--ink)}
.dk-light .tile .t-md{color:var(--muted)}
.dk-two{margin-top:48px;display:grid;grid-template-columns:1fr 1fr;gap:64px 24px}
.dk-tiers{grid-template-columns:repeat(3,1fr)}
.dk-nav{position:fixed;right:24px;bottom:24px;z-index:6;display:flex;align-items:center;gap:12px;padding:6px;background:var(--canvas);border:1px solid var(--n300);border-radius:var(--r-xl);font-family:var(--inter)}
.dk-nav .t-eye{min-width:52px;text-align:center;color:var(--n700)}
.dk-nav .ap-btn{flex:none}
@media (max-width:900px){.dk-four,.dk-tiers{grid-template-columns:1fr 1fr}.dk-two{grid-template-columns:1fr}.dk-top .t-eye{display:none}}
@media (max-width:560px){.dk-four,.dk-tiers{grid-template-columns:1fr}.dk .slide{min-height:auto;padding:72px 0 56px}.dk-nav{right:12px;bottom:12px}}
@media print{.dk-top,.dk-nav{display:none}.dk .slide{break-after:page;min-height:100vh}}
.dk .slide>.wrap{width:100%}
.dk .slide .cards3{margin-top:32px}
.dk .slide:has(.cards3){padding-top:84px;padding-bottom:40px}

/* ----- proposal (/p/<token>): legal hero, FAQ row, pricing tier, deck step tiles ----- */
.pp .pp-hero{padding-top:132px}
.pp .pp-sec{margin-top:104px}
.pp .pp-sec .faq-row{margin-top:40px}
.pp .pp-wait{margin-top:auto;display:inline-flex;align-items:center;gap:8px;font:450 12px/1.2 var(--body);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.pp .pp-wait::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--ink-28)}
.pp .faq-l a{color:var(--ink);text-decoration:underline;text-underline-offset:4px}
.pp .pp-last{margin-bottom:140px}
.pp .pp-steps{margin-top:40px}
.pp .pp-steps .tile{justify-content:flex-start}
.pp .pp-steps .tile .btn{margin-top:auto}
.pp .pp-steps .tile .t-md{flex:none}
.pp .pp-card{max-width:560px;width:100%}
.pp .btn-off{opacity:.45;pointer-events:none}

/* ----- service agreement (/agreement/<token>, and the PDF sent through Zoho Sign): Conduit legal page ----- */
.ag .ag-hero{padding-top:132px}
.ag .ag-status{margin-top:8px;font:450 12px/1.2 var(--body);letter-spacing:.06em;text-transform:uppercase;color:var(--red-500)}
.ag-sig{display:grid;grid-template-columns:1fr 1fr;gap:48px;margin-top:8px}
.ag-sig p{font:400 16px/28px var(--body);color:var(--ink-80)}
.ag-line{height:56px;border-bottom:1px solid var(--ink-28)}
@media (max-width:560px){.ag-sig{grid-template-columns:1fr}}
@media print{.ag-top{display:none}.ag .ag-hero{padding-top:40px}.legal-body{padding-bottom:0}.legal-body section{break-inside:avoid}@page{size:A4;margin:18mm 16mm}}
.ag-logo{display:none;height:22px;margin:0 auto}
@media print{.ag-logo{display:block}}
/* deck rhythm: one gap under every section rule, headlines on one line where they fit */
.dk .slide .lbl + *{margin-top:40px}
.dk .slide .trio{margin-top:64px}
.dk .slide .head .t-h2{max-width:none}
.dk .slide:has(.cards3) .lbl + *{margin-top:28px}