/* Lycia AI for law firms: the client's project at the front desk, then drafting, review and research behind it.
   Built on home-lycia.css and industries.css (the .in variables). The product mockups (.ox) follow the
   Lycia AI Office UI itself: Midnight theme tokens, DM Sans, radii and components as in the product. */
/* Inter and DM Sans served from lyciaai.com (SIL Open Font License, the same files Google Fonts serves), so first paint
   does not wait on two outside connections. Latin covers English and the Turkish ı; latin-ext adds ş, ğ and İ. */
@font-face{font-family:'DM Sans';font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/dm-sans-v17-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/dm-sans-v17-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/inter-v20-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 800;font-display:swap;src:url(/fonts/inter-v20-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

.lg .lx-lede{color:var(--in-muted)}
.lg .lx-compare-cta a{color:var(--in-ink)}
.lg-kicker{display:inline-flex;align-items:center;gap:8px;margin-bottom:16px;font-size:13.5px;font-weight:700;color:#4f46e5}
.lg-kicker::before{content:"";width:7px;height:7px;border-radius:50%;background:#6366f1}
.lg-sec{padding:120px 0;background:#fff;color:var(--in-ink)}
.lg-head{max-width:780px}
.lg-head .lx-h2{max-width:22ch}

/* ============ HERO ============ */
.lg-hero{padding:176px 0 88px}
.lg-crumbs ol{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:26px;font-size:13.5px;color:var(--in-muted)}
.lg-crumbs li+li::before{content:"/";margin-right:8px;color:#a3adb8}
.lg-crumbs a{color:#3b4652;text-decoration:none}
.lg-crumbs a:hover{text-decoration:underline;text-underline-offset:4px}
.lg-hero .in-btn-line{background:rgba(255,255,255,.55)}
.lg-demo{margin:104px 0 0}
.lg-app{margin:0}

/* ============ LYCIA AI OFFICE, AS IT LOOKS IN THE PRODUCT ============ */
.ox{--ox-bg:#f3f4f6;--ox-surface:#fff;--ox-border:#e5e7eb;--ox-text:#111827;--ox-muted:#6b7280;--ox-primary:#374151;--ox-soft:#eef0f3;--ox-side:#111827;--ox-side-text:#9ca3af;--ox-side-label:#6b7280;margin:0;min-width:0;font-family:'DM Sans',system-ui,-apple-system,sans-serif;color:var(--ox-text);text-align:left}
.ox .ic{flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ox i{font-style:normal}
.ox-frame{display:grid;grid-template-columns:232px minmax(0,1fr);border-radius:18px;overflow:hidden;background:var(--ox-bg);box-shadow:0 0 0 1px rgba(15,20,24,.08),0 32px 64px -36px rgba(15,20,24,.45)}
.ox-side{display:flex;flex-direction:column;background:var(--ox-side);padding-bottom:12px}
.ox-logo{display:flex;justify-content:center;padding:20px 16px 4px}
.ox-logo img{display:block;width:auto;height:32px}
.ox-brand{text-align:center;font-size:10.5px;font-weight:500;letter-spacing:.04em;color:var(--ox-side-text)}
.ox-nav{flex:1;padding:0 10px}
.ox-label{padding:16px 12px 6px;font-size:10.5px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--ox-side-label)}
.ox-item{display:flex;align-items:center;gap:10px;padding:7px 12px;border-radius:10px;font-size:13.5px;font-weight:500;color:var(--ox-side-text)}
.ox-item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ox-item.is-on{background:rgba(255,255,255,.1);color:#fff}
.ox-foot{margin:8px 10px 0;padding-top:8px;border-top:1px solid rgba(255,255,255,.1)}
.ox-user{display:flex;align-items:center;gap:10px;margin-top:6px;padding:0 6px;color:rgba(255,255,255,.7)}
.ox-user b{display:block;font-size:13px;font-weight:600;line-height:1.3;color:#fff}
.ox-user small{display:block;font-size:11px;color:var(--ox-side-text)}
.ox-main{min-width:0}
.ox-card{border-radius:16px;border:1px solid var(--ox-border);background:var(--ox-surface);box-shadow:0 1px 3px rgba(15,23,42,.05)}
.ox-proj{overflow:hidden;margin-bottom:20px}
.ox-proj-hero{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:16px;padding:22px 26px;background:linear-gradient(135deg,#111827,#374151);color:#fff}
.ox-proj-top{display:flex;align-items:center;gap:8px}
.ox-proj-top span{padding:2px 10px;border-radius:999px;background:rgba(255,255,255,.15);font-size:12px;font-weight:600}
.ox-proj-title{margin-top:8px;font-size:22px;font-weight:800;letter-spacing:-.025em;line-height:1.2}
.ox-proj-client{margin-top:4px;font-size:13.5px;font-weight:500;color:rgba(255,255,255,.78)}
.ox-proj-desc{margin-top:8px;max-width:520px;font-size:13.5px;line-height:1.6;color:rgba(255,255,255,.78)}
.ox-proj-btn{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:12px;background:#fff;color:var(--ox-primary);font-size:13.5px;font-weight:700;white-space:nowrap}
.ox-hint{padding:11px 26px;font-size:12px;line-height:1.5;color:var(--ox-muted)}
.ox-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;align-items:start}
.ox-stack{display:grid;gap:12px;min-width:0}
.ox-sh{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;text-transform:uppercase;letter-spacing:.025em;color:var(--ox-muted)}
.ox-sh-row{display:flex;align-items:center;gap:8px}
.ox-sh-row .ox-sh{margin-right:auto}
.ox-btn2{display:inline-flex;align-items:center;gap:6px;padding:6px 11px;border-radius:12px;border:1px solid var(--ox-border);background:var(--ox-surface);font-size:12px;font-weight:600;white-space:nowrap}
.ox-note{padding:15px 16px}
.ox-note-t{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;font-size:14px;font-weight:700}
.ox-note-t span{display:flex;gap:10px;padding-top:2px;color:var(--ox-muted)}
.ox-note > p:not(.ox-note-t){margin-top:6px;font-size:13px;line-height:1.6;color:var(--ox-muted)}
.ox-share{display:grid;gap:8px;margin-top:10px}
.ox-share li{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px;line-height:1.35}
.ox-rows > * + *{border-top:1px solid var(--ox-border)}
.ox-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:11px 16px}
.ox-fname{display:flex;align-items:center;gap:8px;min-width:0;font-size:13.5px;font-weight:500}
.ox-fname span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ox-fname .ic{color:var(--ox-muted)}
.ox-role{flex:none;font-size:12px;color:var(--ox-muted)}
.ox-pill{display:inline-flex;align-items:center;gap:4px;flex:none;padding:3px 9px;border-radius:999px;font-size:11.5px;font-weight:600;white-space:nowrap}
.ox-pill.is-green{background:#ecfdf5;color:#047857}
.ox-pill.is-amber{background:#fffbeb;color:#b45309}
.ox-pill.is-soft{background:var(--ox-soft);color:var(--ox-primary)}
.ox-pill.is-gray{background:#f3f4f6;color:#6b7280}
.ox-small{font-size:12px;line-height:1.6;color:var(--ox-muted)}

/* The hero demo: three product screens on one stage, played in order by legal.js. Without JS the projects screen shows. */
.ox-stage{position:relative;height:664px;overflow:hidden}
.ox-screen{position:absolute;inset:0;padding:24px 26px 26px;opacity:0;visibility:hidden;transform:translateY(10px);transition:opacity .45s ease,transform .45s ease,visibility 0s linear .45s}
.ox-frame[data-scene="projects"] .ox-s-projects,.ox-frame[data-scene="project"] .ox-s-project,.ox-frame[data-scene="chat"] .ox-s-chat{opacity:1;visibility:visible;transform:none;transition:opacity .45s ease,transform .45s ease,visibility 0s}
.ox-page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:20px}
.ox-page-title{display:flex;align-items:center;gap:10px;font-size:22px;font-weight:700;letter-spacing:-.025em}
.ox-page-title .ic{color:var(--ox-primary)}
.ox-page-sub{margin-top:4px;font-size:13.5px;color:var(--ox-muted)}
.ox-btn1{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:12px;background:var(--ox-primary);color:#fff;font-size:13.5px;font-weight:600;white-space:nowrap}
.ox-pgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.ox-pcard{display:flex;flex-direction:column;padding:18px;transition:transform .2s,border-color .2s,box-shadow .2s}
.ox-pcard.is-hover{transform:translateY(-2px);border-color:var(--ox-primary);box-shadow:0 8px 24px rgba(15,23,42,.1)}
.ox-pcard.is-pressed{transform:scale(.98)}
.ox-pcard-top{display:flex;align-items:flex-start;justify-content:space-between}
.ox-ibox{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:var(--ox-soft);color:var(--ox-primary)}
.ox-pcard-title{margin-top:14px;font-size:16px;font-weight:700}
.ox-pcard-client{margin-top:2px;font-size:12px;font-weight:600;color:var(--ox-primary)}
.ox-pcard-desc{flex:1;margin-top:6px;font-size:13px;line-height:1.55;color:var(--ox-muted)}
.ox-pcard-foot{display:flex;align-items:center;justify-content:space-between;margin-top:14px;font-size:12px;color:var(--ox-muted)}
.ox-pcard-foot span{display:inline-flex;align-items:center;gap:6px}
.ox-open{font-size:13px;font-weight:600;color:var(--ox-primary)}
.ox-pill.is-blue{background:#eff6ff;color:#1d4ed8}
.ox-proj-btn{transition:transform .15s}
.ox-proj-btn.is-pressed,.ox-send.is-pressed{transform:scale(.95)}
.ox-s-project .ox-proj{margin-bottom:18px}
.ox-s-chat{display:flex;flex-direction:column;padding:0}
.ox-s-chat .ox-chat-head{flex:none}
.ox-live{flex:1;display:flex;flex-direction:column;justify-content:flex-end;gap:14px;min-height:0;overflow:hidden;padding:18px 22px;-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 56px);mask-image:linear-gradient(to bottom,transparent 0,#000 56px)}
.ox-live > *{flex:none}
.ox-live .ox-step,.ox-live .ox-row{display:none}
.ox-live .ox-tools.is-in,.ox-live .ox-user-msg.is-in{display:block;animation:ox-in .4s cubic-bezier(.2,.8,.25,1)}
.ox-live .ox-ai.is-in{display:flex;animation:ox-in .4s cubic-bezier(.2,.8,.25,1)}
.ox-live .ox-row.is-in{display:flex;animation:ox-in .3s ease}
.ox-live .ox-user-msg.is-in{align-self:flex-end}
@keyframes ox-in{from{opacity:0;transform:translateY(8px)}}
.ox-spin{display:none;color:var(--ox-primary)}
.ox-row.is-running:not(.is-done) .ox-ok{display:none}
.ox-row.is-running:not(.is-done) .ox-spin{display:block;animation:ox-spin 1s linear infinite}
@keyframes ox-spin{to{transform:rotate(360deg)}}
.ox-l-done,.ox-row.is-done .ox-l-run{display:none}
.ox-row.is-done .ox-l-done{display:inline}
.ox-working{align-self:flex-start;align-items:center;gap:10px;padding:7px 13px;border-radius:999px;border:1px solid var(--ox-border);background:var(--ox-surface);box-shadow:0 1px 3px rgba(15,23,42,.05);font-size:13px;font-weight:500;color:var(--ox-muted)}
.ox-live .ox-working.is-in{display:inline-flex;animation:ox-in .3s ease}
.ox-dots{display:flex;gap:4px}
.ox-dots i{width:6px;height:6px;border-radius:50%;background:var(--ox-primary);animation:ox-dot 1.4s ease-in-out infinite}
.ox-dots i:nth-child(2){animation-delay:.16s}
.ox-dots i:nth-child(3){animation-delay:.32s}
@keyframes ox-dot{0%,70%,100%{transform:none;opacity:.35}35%{transform:translateY(-4px);opacity:1}}
.ox-clock{font-size:12px;font-variant-numeric:tabular-nums;opacity:.6}
.ox-composer{flex:none;padding:12px 22px 16px;border-top:1px solid var(--ox-border);background:var(--ox-surface)}
.ox-composer-box{display:flex;align-items:center;gap:8px;padding:6px;border-radius:16px;border:1px solid var(--ox-border);box-shadow:0 1px 2px rgba(0,0,0,.05);transition:border-color .2s}
.is-typing .ox-composer-box{border-color:var(--ox-primary)}
.ox-clip{display:inline-flex;padding:8px;color:var(--ox-muted)}
.ox-input{flex:1;display:flex;align-items:center;min-width:0;overflow:hidden;font-size:13.5px;line-height:20px;white-space:nowrap}
.ox-ph{flex:1;color:var(--ox-muted);opacity:.75}
.ox-caret{display:none;flex:none;width:2px;height:16px;margin-left:1px;background:var(--ox-primary);animation:ox-blink 1s steps(1) infinite}
.is-typing .ox-ph{display:none}
.is-typing .ox-caret{display:block}
@keyframes ox-blink{50%{opacity:0}}
.ox-send{display:inline-flex;padding:9px;border-radius:12px;background:var(--ox-primary);color:#fff;transition:transform .15s}
.ox-cursor{position:absolute;left:0;top:0;z-index:5;width:22px;height:22px;opacity:0;pointer-events:none;filter:drop-shadow(0 2px 3px rgba(0,0,0,.25));transition:transform .9s cubic-bezier(.45,0,.2,1),opacity .3s}
.ox-cursor.is-on{opacity:1}
.ox-cursor svg{display:block}
.ox-cursor::after{content:"";position:absolute;left:-7px;top:-7px;width:24px;height:24px;border-radius:50%;border:2px solid rgba(55,65,81,.55);opacity:0}
.ox-cursor.is-click::after{animation:ox-ripple .45s ease-out}
@keyframes ox-ripple{0%{opacity:.9;transform:scale(.4)}100%{opacity:0;transform:scale(1.6)}}
.lg-demo-ctl{display:flex;justify-content:flex-end;margin-top:12px}
.lg-demo-ctl button{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;border-radius:999px;border:1px solid rgba(15,20,24,.14);background:rgba(255,255,255,.6);color:#3b4652;font:600 12.5px/1.2 Inter,-apple-system,sans-serif;cursor:pointer;transition:border-color .2s}
.lg-demo-ctl button:hover{border-color:rgba(15,20,24,.35)}
.lg-demo-ctl button:focus-visible{outline:2px solid #b9c7ff;outline-offset:3px}
.lg-demo-ctl svg{fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.lg-demo-ctl .ox-ico-play{display:none;fill:currentColor;stroke:none}
.lg-demo-ctl [aria-pressed="true"] .ox-ico-pause{display:none}
.lg-demo-ctl [aria-pressed="true"] .ox-ico-play{display:block}
.lg-demo.is-still .lg-demo-ctl{display:none}
/* Chat with a teammate: the tool activity card, then the answer. */
.ox-chat{overflow:hidden;border-radius:18px;background:var(--ox-bg);box-shadow:0 0 0 1px rgba(15,20,24,.08),0 32px 64px -36px rgba(15,20,24,.45)}
.ox-chat-head{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--ox-border);background:var(--ox-surface)}
.ox-chat-head > div{min-width:0}
.ox-av{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:14px;background:var(--ox-soft);color:var(--ox-primary)}
.ox-chat-head b{display:block;font-size:14.5px;font-weight:700;line-height:1.25}
.ox-chat-head small{display:block;overflow:hidden;font-size:12px;color:var(--ox-muted);text-overflow:ellipsis;white-space:nowrap}
.ox-transcript{display:grid;gap:14px;padding:18px}
.ox-user-msg{justify-self:end;max-width:88%;padding:11px 15px;border-radius:16px 16px 6px 16px;background:var(--ox-primary);color:#fff;font-size:13.5px;line-height:1.6}
.ox-tools{overflow:hidden}
.ox-tools-head{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--ox-border);background:#f5f6f8;font-size:13.5px;font-weight:700}
.ox-tools-head i{display:grid;place-items:center;width:28px;height:28px;border-radius:10px;background:var(--ox-soft);color:var(--ox-primary)}
.ox-tool{display:flex;align-items:center;gap:10px;padding:9px 14px;font-size:13px}
.ox-tool + .ox-tool{border-top:1px solid var(--ox-border)}
.ox-tool > i{display:grid;place-items:center;flex:none;width:22px;height:22px;border-radius:50%;background:var(--ox-soft);color:var(--ox-primary)}
.ox-tool > span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ox-tool b{font-weight:600}
.ox-tool em{margin-left:8px;font-size:12px;font-style:normal;color:var(--ox-muted)}
.ox-ok{color:#059669}
.ox-ai{display:flex;align-items:flex-start;gap:10px;max-width:96%}
.ox-ai > i{display:grid;place-items:center;flex:none;width:30px;height:30px;margin-top:2px;border-radius:10px;background:var(--ox-soft);color:var(--ox-primary)}
.ox-bubble{min-width:0;padding:11px 15px;border-radius:6px 16px 16px 16px;font-size:13.5px;line-height:1.65}
.ox-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.ox-chip{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:999px;font-size:10.5px;font-weight:700;line-height:1.6}
.ox-chip.is-file{background:#ecfdf5;color:#047857}
.ox-chip.is-human{background:#f3f4f6;color:#4b5563}
.ox-chip.is-project{background:var(--ox-soft);color:var(--ox-primary)}
.ox-cite-h{margin-top:12px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--ox-muted)}
.ox-cites{display:grid;gap:6px;margin-top:6px}
.ox-cites li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;border-radius:10px;border:1px solid var(--ox-border)}
.ox-cites b{display:block;font-size:12.5px;font-weight:600;line-height:1.35}
.ox-cites small{display:block;font-size:11.5px;color:var(--ox-muted)}
.ox-cites .is-conflict{border-color:#fde68a;background:#fffbeb}
.lg-mask{letter-spacing:.06em;color:#9aa5b1}

/* ============ FRONT DESK ============ */
.lg-flow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:64px;align-items:center;margin-top:56px}
.lg-steps{counter-reset:lg-step}
.lg-steps li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:4px 18px;padding:22px 0;border-top:1px solid var(--in-line);counter-increment:lg-step}
.lg-steps li:last-child{border-bottom:1px solid var(--in-line)}
.lg-steps li::before{content:counter(lg-step);grid-row:span 2;display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--in-stage);color:#fff;font-size:16px;font-weight:700}
.lg-steps b{font-size:17px;font-weight:700;letter-spacing:-.01em;line-height:1.35}
.lg-steps p{font-size:15.5px;line-height:1.55;color:var(--in-muted)}
.lg-also{margin-top:72px;padding-top:48px;border-top:1px solid var(--in-line)}
.lg-also h3,.lg-more h3{font-size:22px;font-weight:750;letter-spacing:-.02em}
.lg-also .in-tasks{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 48px;margin-top:22px}
.lg-channels{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin-top:32px;font-size:14px}
.lg-channels b{margin-right:6px;font-weight:600;color:var(--in-muted)}
.lg-channels span{padding:6px 12px;border-radius:999px;border:1px solid var(--in-line);font-weight:500}

/* ============ BACK OFFICE ============ */
.lg-back{border-top:1px solid var(--in-line)}
.lg-back .lg-head{margin-bottom:24px}
.lg-more{padding-top:64px;border-top:1px solid var(--in-line)}
.lg-more-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:24px}
.lg-more-grid li{padding:22px;border-radius:16px;background:var(--in-sky)}
.lg-more-grid i{display:grid;place-items:center;width:40px;height:40px;margin-bottom:16px;border-radius:11px;background:#fff}
.lg-more-grid svg{width:19px;height:19px;fill:none;stroke:var(--in-ink);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.lg-more-grid b{display:block;font-size:16.5px;font-weight:700;letter-spacing:-.01em}
.lg-more-grid p{margin-top:6px;font-size:15px;line-height:1.5;color:var(--in-muted)}

/* ============ RESEARCH ============ */
.lg-research{position:relative;overflow:hidden;padding:120px 0;background:var(--in-stage);color:#fff}
.lg-research::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(rgba(255,255,255,.04) 1px,transparent 1px) 0 0/32px 32px}
.lg-research-grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:64px;align-items:center}
.lg-research .lg-kicker{color:#a5b4fc}
.lg-research .lg-kicker::before{background:#a5b4fc}
.lg-research .lx-h2{max-width:18ch;color:#fff}
.lg-research .lx-lede{color:rgba(255,255,255,.7)}
.lg-research-list{display:grid;gap:12px;margin-top:30px}
.lg-research-list li{display:grid;grid-template-columns:20px minmax(0,1fr);gap:12px;font-size:16px;line-height:1.45;color:rgba(255,255,255,.88)}
.lg-research-list li::before{content:"";width:20px;height:20px;margin-top:1px;border-radius:50%;background:rgba(165,180,252,.16) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2l2.2 2.2 4.8-4.8' fill='none' stroke='%23c7d2fe' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/18px no-repeat}
.lg-research .ox-chat{box-shadow:0 0 0 1px rgba(255,255,255,.08),0 40px 80px -40px rgba(0,0,0,.65)}
.lg-rs figcaption{margin-top:12px;font-family:Inter,-apple-system,sans-serif;font-size:12.5px;color:rgba(255,255,255,.55)}

/* ============ CONNECTIONS ============ */
.lg-connect{background:var(--in-sky)}
.lg-connect-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:72px;align-items:center}
.lg-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
.lg-chips li{padding:7px 13px;border-radius:999px;background:#fff;box-shadow:0 0 0 1px rgba(15,20,24,.08);font-size:14px;font-weight:500}
.lg-chips li:last-child{background:#eef2ff;color:#4338ca;box-shadow:0 0 0 1px rgba(99,102,241,.3)}
.lg-mcp{padding:32px;border-radius:20px;background:#fff;box-shadow:0 0 0 1px rgba(15,20,24,.06),0 24px 48px -32px rgba(15,20,24,.28)}
.lg-mcp-tag{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--in-muted)}
.lg-mcp-tag span{padding:3px 8px;border-radius:6px;background:var(--in-stage);color:#fff;font-size:11.5px;font-weight:800;letter-spacing:.04em}
.lg-mcp h3{margin-top:16px;font-size:24px;font-weight:800;letter-spacing:-.025em;line-height:1.2}
.lg-mcp > p{margin-top:12px;font-size:16px;line-height:1.6;color:var(--in-muted)}
.lg-mcp-flow{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;margin-top:26px}
.lg-mcp-flow li{padding:10px 12px;border-radius:10px;background:#f3f5f8;font-size:13px;font-weight:600;line-height:1.35;text-align:center}
.lg-mcp-flow .is-lycia{position:relative;display:flex;align-items:center;gap:7px;margin:0 24px;background:var(--in-stage);color:#fff;white-space:nowrap}
.lg-mcp-flow .is-lycia::before,.lg-mcp-flow .is-lycia::after{content:"";position:absolute;top:50%;width:24px;height:1.5px;background:#b9c2cc}
.lg-mcp-flow .is-lycia::before{right:100%}
.lg-mcp-flow .is-lycia::after{left:100%}

/* ============ FAQ AND RELATED ============ */
.lg-faq-sec{padding-bottom:56px;background:var(--in-sky)}
.lg-faq-grid{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:80px;align-items:start}
.lg-faq details{border-top:1px solid #d3dae3}
.lg-faq details:last-child{border-bottom:1px solid #d3dae3}
.lg-faq summary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 0;font-size:17.5px;font-weight:700;letter-spacing:-.01em;line-height:1.35;cursor:pointer;list-style:none}
.lg-faq summary::-webkit-details-marker{display:none}
.lg-faq summary::after{content:"";flex:none;width:24px;height:24px;border-radius:50%;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 3.5v9M3.5 8h9' fill='none' stroke='%230f1418' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E") center/12px no-repeat;box-shadow:0 0 0 1px #d3dae3;transition:transform .2s}
.lg-faq details[open] summary::after{transform:rotate(45deg)}
.lg-faq summary:focus-visible{outline:2px solid #b9c7ff;outline-offset:3px;border-radius:6px}
.lg-faq details p{max-width:64ch;padding:0 0 24px;font-size:16px;line-height:1.65;color:var(--in-muted)}
.lg-related{padding:24px 0 104px;background:var(--in-sky)}
.lg-related h2{font-size:15px;font-weight:700;color:var(--in-muted)}
.lg-related ul{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:16px}
.lg-related a{display:flex;flex-direction:column;gap:6px;height:100%;padding:18px 20px;border-radius:14px;background:#fff;color:var(--in-ink);text-decoration:none;box-shadow:0 0 0 1px rgba(15,20,24,.06);transition:box-shadow .2s,transform .2s}
.lg-related a:hover{transform:translateY(-2px);box-shadow:0 0 0 1px rgba(15,20,24,.1),0 18px 32px -22px rgba(15,20,24,.3)}
.lg-related b{font-size:15.5px;font-weight:700;line-height:1.35}
.lg-related span{font-size:13.5px;line-height:1.45;color:var(--in-muted)}

/* ============ RESPONSIVE ============ */
@media (max-width:1100px){
  .lg-more-grid,.lg-related ul{grid-template-columns:repeat(2,minmax(0,1fr))}
  .lg-flow,.lg-research-grid,.lg-connect-grid{gap:48px}
  .ox-frame{grid-template-columns:200px minmax(0,1fr)}
  .ox-screen{padding:20px}
  .ox-s-chat{padding:0}
  .ox-pcard-desc{font-size:12.5px}
}
@media (max-width:900px){
  .lg-hero{padding:156px 0 72px}
  .lg-flow,.lg-research-grid,.lg-connect-grid,.lg-faq-grid{grid-template-columns:minmax(0,1fr)}
  .lg-faq-grid{gap:28px}
  /* On small screens the page shows without the product sidebar. */
  .ox-frame{grid-template-columns:minmax(0,1fr)}
  .ox-side{display:none}
  .ox-pgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ox-pcard:nth-child(n+5){display:none}
}
@media (max-width:719px){
  .lg-hero{padding:132px 0 56px}
  .lg-crumbs ol{margin-bottom:20px}
  .lg-sec,.lg-research{padding:80px 0}
  .lg-demo{margin-top:56px}
  .ox-stage{height:600px}
  .ox-screen{padding:14px}
  .ox-s-chat{padding:0}
  .ox-pgrid{grid-template-columns:minmax(0,1fr);gap:10px}
  .ox-pcard:nth-child(n+4),.ox-pcard-desc,.ox-page-sub{display:none}
  .ox-pcard{padding:14px}
  .ox-pcard-title{margin-top:10px}
  .ox-pcard-foot{margin-top:10px}
  .ox-live{padding:12px}
  .ox-composer{padding:10px 12px 12px}
  .ox-page-head{margin-bottom:14px}
  .ox-frame,.ox-chat{border-radius:14px}
  .ox-cols{grid-template-columns:minmax(0,1fr)}
  .ox-proj-hero{padding:18px}
  .ox-hint{padding:10px 18px}
  .ox-transcript{padding:12px}
  .ox-chat-head{padding:12px 14px}
  .ox-tool{align-items:flex-start}
  .ox-tool > span{white-space:normal}
  .ox-tool em{display:block;margin-left:0}
  .ox-ai{max-width:100%}
  .lg-flow{margin-top:36px}
  .lg-also{margin-top:52px;padding-top:36px}
  .lg-also .in-tasks{grid-template-columns:minmax(0,1fr)}
  .lg .in-check li{grid-template-columns:18px minmax(0,1fr)}
  .lg .in-check span{grid-column:2}
  .lg-more{padding-top:48px}
  .lg-more-grid,.lg-related ul{grid-template-columns:minmax(0,1fr)}
  .lg-mcp{padding:24px 20px}
  .lg-mcp-flow{grid-template-columns:minmax(0,1fr);justify-items:stretch}
  .lg-mcp-flow .is-lycia{justify-content:center;margin:20px 0}
  .lg-mcp-flow .is-lycia::before,.lg-mcp-flow .is-lycia::after{top:auto;left:50%;right:auto;width:1.5px;height:20px}
  .lg-mcp-flow .is-lycia::before{bottom:100%}
  .lg-mcp-flow .is-lycia::after{top:100%}
  .lg-faq summary{font-size:16.5px;padding:18px 0}
  .lg-related{padding:16px 0 80px}
}
@media (prefers-reduced-motion:reduce){
  .lg-related a{transition:none}
  .lg-faq summary::after{transition:none}
}

/* ============ AGENCIES & CONSULTING (/industries/agencies): customer story, task board, progress bars ============ */
.ag-story{padding:104px 0;background:#f6f8fb;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
.ag-story-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:80px;align-items:center}
.ag-story-name{margin:20px 0 28px;line-height:0}
.ag-story-name img{width:auto;height:52px}
.ag-quote{margin:0}
.ag-quote p{max-width:36ch;font-size:clamp(21px,2.1vw,27px);font-weight:500;line-height:1.45;letter-spacing:-.02em;color:var(--text)}
.ag-quote .ag-quote-by{display:flex;flex-direction:column;gap:2px;max-width:none;margin-top:24px;font-size:14.5px;font-weight:400;line-height:1.5;letter-spacing:0}
.ag-quote-by b{font-weight:650}
.ag-quote-by span{color:var(--text-2)}
.ag-facts{border-top:1px solid #dfe5ec}
.ag-facts li{display:grid;gap:4px;padding:22px 0;border-bottom:1px solid #dfe5ec}
.ag-facts b{font-size:30px;font-weight:700;line-height:1.15;letter-spacing:-.03em}
.ag-facts span{font-size:15px;line-height:1.5;color:var(--text-2)}
/* The task board, from the product replica (app/tasks): three columns of cards with owner, project and date chips. */
.ag-board-sec .lg-research-grid{grid-template-columns:minmax(0,.86fr) minmax(0,1.24fr)}
.lg-research .ox-board{box-shadow:0 0 0 1px rgba(255,255,255,.08),0 40px 80px -40px rgba(0,0,0,.65)}
.ox-board{padding:22px;border-radius:18px}
.ox-board-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:18px}
.ox-board .ox-page-title{font-size:19px}
.ox-board .ox-btn1{padding:8px 12px;font-size:12.5px}
.ox-cols3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.ox-col{display:flex;flex-direction:column;gap:9px;padding:10px;border-radius:14px;background:rgba(236,239,240,.6)}
.ox-col-head{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:2px 4px 4px}
.ox-col-head span{display:flex;align-items:center;font-size:13px;font-weight:700}
.ox-col-head i{margin-left:6px;padding:1px 7px;border-radius:999px;background:#fff;font-size:11px;font-style:normal;font-weight:700;color:var(--ox-muted)}
/* The product shows a hint under each column title; the columns here are too narrow for it. */
.ox-col-head small{display:none}
.ox-task{padding:11px 12px;border-radius:12px}
.ox-task-title{font-size:13px;font-weight:600;line-height:1.35}
.ox-task-title.done{color:var(--ox-muted);text-decoration:line-through}
.ox-task-chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}
.ox-task-note{margin-top:7px;font-size:10.5px;font-weight:500;color:#7c3aed}
.tchip{display:inline-flex;align-items:center;gap:4px;padding:2px 7px;border-radius:999px;font-size:9.5px;font-weight:700;line-height:1.5}
.tchip.ai,.tchip.runat{background:#f5f3ff;color:#6d28d9}
.tchip.human,.tchip.due{background:#f3f4f6;color:#4b5563}
.tchip.project{background:var(--ox-soft);color:var(--ox-primary)}
.tchip.due.overdue{background:#fef2f2;color:#dc2626}
.tchip.remind{background:#fffbeb;color:#b45309}
.tchip.aidone{background:#ecfdf5;color:#047857}
/* A weekly client update: one bar per workstream. */
.ag-progress{display:grid;gap:11px;margin-top:14px;padding:14px 14px 13px;border-radius:10px;border:1px solid #e6eaef}
.ag-progress li{display:grid;grid-template-columns:88px minmax(0,1fr) 40px;gap:12px;align-items:center;font-size:13px}
.ag-progress span{font-weight:600}
.ag-progress i{position:relative;height:8px;border-radius:99px;background:#eef0f6;overflow:hidden}
.ag-progress i::before{content:"";position:absolute;inset:0 auto 0 0;width:var(--v);border-radius:inherit;background:var(--in-indigo)}
.ag-progress b{font-size:12px;font-weight:700;text-align:right;color:var(--in-muted)}
/* Two channel rows: where clients reach the project, and where the team works. */
.ag .lg-channels + .lg-channels{margin-top:14px}
@media (max-width:1100px){
  .ag-story-grid{gap:56px}
  .ag-board-sec .lg-research-grid{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:900px){
  .ag-story-grid{grid-template-columns:minmax(0,1fr);gap:40px}
}
@media (max-width:719px){
  .ag-story{padding:80px 0}
  .ag-story-name img{height:44px}
  .ox-board{padding:14px;border-radius:14px}
  .ox-board-head{margin-bottom:14px}
  /* Three columns do not fit a phone: they scroll sideways, a card and a half at a time. */
  .ox-cols3{grid-template-columns:repeat(3,78%);overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -14px;padding:0 14px 4px;scroll-padding:0 14px}
  .ox-col{scroll-snap-align:start}
  .ag .lg-channels b{flex-basis:100%;margin:0 0 2px}
}
