/* LEGALYZE.PRO — Conversation Intelligence prototype (Stitch system) */

/* ───────── Prototype hero ───────── */
.ci-hero{position:relative;padding:clamp(4.5rem,9vw,7rem) 0 clamp(3rem,6vw,4.5rem);background:var(--sc-lowest);border-bottom:1px solid var(--hairline);overflow:hidden;}
.ci-hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(to right,rgba(74,74,78,.05) 1px,transparent 1px),linear-gradient(to bottom,rgba(74,74,78,.05) 1px,transparent 1px);background-size:40px 40px;mask-image:radial-gradient(ellipse at 50% 0%,black 35%,transparent 80%);-webkit-mask-image:radial-gradient(ellipse at 50% 0%,black 35%,transparent 80%);pointer-events:none;}
.ci-hero-inner{position:relative;max-width:56rem;margin:0 auto;text-align:center;}
.ci-hero h1{font-family:var(--font-display);font-size:clamp(2.2rem,5vw,3.4rem);font-weight:700;line-height:1.08;letter-spacing:-.02em;color:var(--primary);margin:1.2rem 0 1.3rem;}
.ci-hero .lede{font-size:1.08rem;line-height:1.65;color:var(--on-surface-variant);max-width:42rem;margin:0 auto 2rem;}

/* ───────── Demo lab ───────── */
.lab{padding:clamp(3rem,6vw,5rem) 0;background:var(--surface);}
.lab-grid{display:grid;grid-template-columns:380px minmax(0,1fr);gap:2rem;align-items:start;}
@media(max-width:1020px){.lab-grid{grid-template-columns:1fr;}}

/* Scenario tabs */
.scn-tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:1.5rem;}
.scn-tab{font-family:var(--font-label);font-size:.7rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;padding:.55rem 1rem;border-radius:var(--r-full);border:1px solid var(--outline-variant);background:var(--sc-lowest);color:var(--secondary);cursor:pointer;transition:all .2s ease;}
.scn-tab:hover{border-color:var(--primary);color:var(--primary);}
.scn-tab.active{background:var(--primary);border-color:var(--primary);color:var(--on-primary);font-weight:700;}

/* ───────── Phone ───────── */
.phone{width:360px;max-width:100%;margin:0 auto;background:#0d0f11;border-radius:2.6rem;padding:10px;box-shadow:0 30px 80px rgba(24,29,27,.28),0 0 0 1px rgba(110,122,118,.2);}
.phone-screen{background:var(--surface);border-radius:2.1rem;overflow:hidden;height:560px;display:flex;flex-direction:column;position:relative;}
.phone-top{padding:.9rem 1.1rem .6rem;background:var(--sc-lowest);border-bottom:1px solid var(--hairline);display:flex;align-items:center;gap:.7rem;}
.phone-contact{width:32px;height:32px;border-radius:50%;background:var(--secondary-container);color:var(--on-secondary-container);display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:700;font-size:.85rem;flex-shrink:0;}
.phone-contact-name{font-family:var(--font-display);font-size:.85rem;font-weight:600;color:var(--on-surface);}
.phone-contact-sub{font-family:var(--font-label);font-size:.62rem;letter-spacing:.06em;color:var(--outline);text-transform:uppercase;}
.phone-canvas{flex:1;overflow-y:auto;padding:1rem .8rem;display:flex;flex-direction:column;gap:.55rem;scroll-behavior:smooth;}
.msg{max-width:82%;padding:.6rem .85rem;border-radius:1rem;font-size:.83rem;line-height:1.45;opacity:0;transform:translateY(8px);transition:opacity .4s ease,transform .4s ease;}
.msg.show{opacity:1;transform:none;}
.msg-agent{align-self:flex-start;background:var(--sc-lowest);border:1px solid rgba(189,201,197,.5);border-bottom-left-radius:.3rem;color:var(--on-surface);}
.msg-user{align-self:flex-end;background:var(--primary);color:var(--on-primary);border-bottom-right-radius:.3rem;}
.msg-meta{display:block;font-family:var(--font-label);font-size:.58rem;letter-spacing:.05em;color:var(--outline);margin-top:.25rem;text-transform:uppercase;}
.msg-user .msg-meta{color:rgba(255,255,255,.65);}
.msg.evidence-flash{outline:2px solid var(--tertiary);outline-offset:2px;}
.phone-foot{padding:.7rem .9rem;background:var(--sc-lowest);border-top:1px solid var(--hairline);display:flex;align-items:center;gap:.6rem;}
.phone-input{flex:1;border:1px solid var(--outline-variant);border-radius:var(--r-full);padding:.5rem .9rem;font-size:.75rem;color:var(--outline);background:var(--surface);}
.typing{display:inline-flex;gap:3px;align-items:center;padding:.6rem .85rem;}
.typing i{width:5px;height:5px;border-radius:50%;background:var(--outline);opacity:.4;animation:ci-blink 1s infinite;}
.typing i:nth-child(2){animation-delay:.15s;} .typing i:nth-child(3){animation-delay:.3s;}
@keyframes ci-blink{0%,100%{opacity:.25;}50%{opacity:.9;}}

/* Phone contextual intelligence card (concept overlay) */
.phone-alert{position:absolute;left:.7rem;right:.7rem;bottom:3.4rem;background:var(--sc-lowest);border:1px solid rgba(138,76,41,.4);border-left:3px solid var(--tertiary);border-radius:.8rem;padding:.7rem .9rem;font-size:.72rem;line-height:1.45;color:var(--on-surface);box-shadow:0 12px 32px rgba(24,29,27,.18);opacity:0;transform:translateY(10px);transition:opacity .5s ease,transform .5s ease;pointer-events:none;}
.phone-alert.show{opacity:1;transform:none;}
.phone-alert .pa-title{font-family:var(--font-label);font-size:.6rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--tertiary);display:flex;align-items:center;gap:.35rem;margin-bottom:.2rem;}

/* Lab controls */
.lab-controls{display:flex;gap:.6rem;margin-top:1rem;flex-wrap:wrap;}

/* ───────── Intelligence panel ───────── */
.ip{background:var(--sc-lowest);border:1px solid rgba(189,201,197,.45);border-radius:var(--r);overflow:hidden;}
.ip-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.1rem 1.4rem;border-bottom:1px solid var(--hairline);background:rgba(246,250,248,.6);}
.ip-head h3{font-family:var(--font-display);font-size:1.05rem;font-weight:600;color:var(--primary);}
.ip-counters{display:grid;grid-template-columns:repeat(6,1fr);gap:1px;background:var(--hairline);border-bottom:1px solid var(--hairline);}
.ip-counter{background:var(--sc-lowest);padding:.9rem .5rem;text-align:center;cursor:pointer;transition:background .2s ease;border:0;font-family:inherit;}
.ip-counter:hover{background:var(--sc-high);}
.ip-counter .n{font-family:var(--font-display);font-size:1.35rem;font-weight:600;color:var(--primary);display:block;line-height:1;}
.ip-counter .l{font-family:var(--font-label);font-size:.55rem;letter-spacing:.08em;text-transform:uppercase;color:var(--outline);display:block;margin-top:.25rem;}
.ip-body{padding:1.2rem 1.4rem 1.4rem;max-height:560px;overflow-y:auto;}
.ip-section{margin-bottom:1.4rem;}
.ip-section > h4{font-family:var(--font-label);font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--secondary);margin-bottom:.7rem;display:flex;align-items:center;gap:.5rem;}
.ip-empty{font-size:.8rem;color:var(--outline);font-style:italic;}

/* Finding cards */
.finding{width:100%;text-align:left;background:var(--surface);border:1px solid rgba(189,201,197,.5);border-radius:.8rem;padding:.8rem .95rem;margin-bottom:.6rem;cursor:pointer;transition:border-color .2s ease,box-shadow .2s ease;display:block;font-family:var(--font-body);}
.finding:hover{border-color:var(--primary);box-shadow:var(--ambient);}
.finding .f-top{display:flex;align-items:center;gap:.5rem;margin-bottom:.3rem;flex-wrap:wrap;}
.finding .f-title{font-size:.85rem;font-weight:600;color:var(--primary);flex:1;min-width:0;}
.finding .f-sub{font-size:.76rem;color:var(--on-surface-variant);line-height:1.5;}
.finding .f-ev{font-family:var(--font-label);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--tertiary);margin-top:.35rem;display:inline-flex;align-items:center;gap:.3rem;}
.term-row{display:flex;justify-content:space-between;gap:.8rem;padding:.5rem 0;border-bottom:1px solid var(--hairline);font-size:.84rem;}
.term-row:last-child{border-bottom:0;}
.term-row .k{color:var(--on-surface-variant);}
.term-row .v{font-weight:600;color:var(--primary);text-align:right;}
.commit-row{display:flex;gap:.6rem;padding:.5rem 0;border-bottom:1px solid var(--hairline);font-size:.84rem;align-items:flex-start;}
.commit-row:last-child{border-bottom:0;}
.commit-row .who{font-family:var(--font-label);font-size:.6rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:.15rem .5rem;border-radius:var(--r-full);flex-shrink:0;margin-top:.1rem;}
.who-user{background:rgba(0,104,90,.12);color:var(--primary);}
.who-them{background:rgba(138,76,41,.12);color:var(--tertiary);}
.missing-row{display:flex;align-items:center;gap:.55rem;padding:.45rem 0;font-size:.84rem;color:var(--on-surface-variant);}
.missing-row .material-symbols-outlined{font-size:16px;color:var(--tertiary);flex-shrink:0;}
.missing-row.ok .material-symbols-outlined{color:var(--primary-deep);}

/* Timeline */
.ci-timeline{position:relative;border-left:1px solid rgba(110,122,118,.35);margin-left:.4rem;padding-left:1.3rem;display:flex;flex-direction:column;gap:1rem;}
.ci-tl-item{position:relative;font-size:.84rem;}
.ci-tl-item::before{content:"";position:absolute;left:calc(-1.3rem - 5px);top:.3rem;width:10px;height:10px;border-radius:50%;background:var(--primary);border:2px solid var(--sc-lowest);}
.ci-tl-item.tl-change::before{background:var(--tertiary);}
.ci-tl-item .when{font-family:var(--font-label);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;color:var(--outline);display:block;margin-bottom:.1rem;}
.ci-tl-item .what{color:var(--on-surface);}
.ci-tl-item .what strong{color:var(--primary);}

/* Question buttons + answers */
.ci-questions{display:flex;gap:.6rem;flex-wrap:wrap;margin:1.2rem 0;}
.q-btn{font-family:var(--font-label);font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:.7rem 1.1rem;border-radius:.6rem;border:1px solid var(--primary);background:var(--sc-lowest);color:var(--primary);cursor:pointer;transition:all .2s ease;}
.q-btn:hover{background:var(--primary);color:var(--on-primary);}
.q-answer{background:var(--sc-low);border:1px solid rgba(189,201,197,.5);border-radius:.8rem;padding:1.2rem 1.3rem;margin-top:1rem;}
.q-answer h4{font-family:var(--font-display);font-size:1rem;font-weight:600;color:var(--primary);margin-bottom:.8rem;}
.q-answer ul{list-style:none;display:flex;flex-direction:column;gap:.45rem;}
.q-answer li{font-size:.86rem;color:var(--on-surface);padding-left:1.2rem;position:relative;line-height:1.5;}
.q-answer li::before{content:"";position:absolute;left:0;top:.45em;width:6px;height:6px;border-radius:50%;background:var(--primary);}
.q-answer li.warn::before{background:var(--tertiary);}
.q-answer .qa-col{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;}
@media(max-width:700px){.qa-col{grid-template-columns:1fr;}.ip-counters{grid-template-columns:repeat(3,1fr);}}

/* Evidence modal */
.ev-modal{position:fixed;inset:0;z-index:300;background:rgba(24,29,27,.55);display:flex;align-items:center;justify-content:center;padding:1.25rem;opacity:0;pointer-events:none;transition:opacity .25s ease;}
.ev-modal.open{opacity:1;pointer-events:auto;}
.ev-modal-card{background:var(--sc-lowest);border-radius:var(--r);max-width:620px;width:100%;max-height:85vh;overflow-y:auto;padding:1.6rem 1.7rem;box-shadow:0 40px 100px rgba(0,0,0,.35);transform:translateY(10px);transition:transform .25s ease;}
.ev-modal.open .ev-modal-card{transform:none;}
.ev-modal .em-close{position:sticky;top:0;float:right;background:var(--sc);border:0;border-radius:50%;width:34px;height:34px;cursor:pointer;color:var(--on-surface-variant);}
.ev-modal .em-kind{font-family:var(--font-label);font-size:.62rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--tertiary);display:block;margin-bottom:.4rem;}
.ev-modal h3{font-family:var(--font-display);font-size:1.25rem;font-weight:600;color:var(--primary);margin-bottom:.7rem;padding-right:2.5rem;}
.ev-modal .em-why{font-size:.9rem;color:var(--on-surface-variant);line-height:1.65;margin-bottom:1.1rem;}
.ev-msg{border:1px solid rgba(189,201,197,.5);border-left:3px solid var(--tertiary);border-radius:.6rem;background:var(--surface);padding:.8rem 1rem;margin-bottom:.7rem;}
.ev-msg .em-tag{font-family:var(--font-label);font-size:.6rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--outline);display:block;margin-bottom:.25rem;}
.ev-msg q{font-style:italic;font-size:.88rem;color:var(--on-surface);quotes:"“" "”";}
.ev-modal .em-action{font-size:.86rem;color:var(--on-surface);border-top:1px solid var(--hairline);padding-top:1rem;margin-top:.4rem;}
.ev-modal .em-action strong{color:var(--primary);}

/* Pipeline */
.pipe-lz{display:flex;align-items:stretch;gap:.5rem;flex-wrap:wrap;justify-content:center;max-width:56rem;margin:0 auto;}
.pipe-node{background:var(--sc-lowest);border:1px solid rgba(189,201,197,.5);border-radius:.8rem;padding:.9rem 1.2rem;font-family:var(--font-display);font-size:.9rem;font-weight:600;color:var(--primary);text-align:center;min-width:110px;flex:1;}
.pipe-arrow{align-self:center;color:var(--outline);}
@media(max-width:820px){.pipe-node{min-width:40%;}}

/* Concept phone section */
.concept-grid{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;}
@media(max-width:900px){.concept-grid{grid-template-columns:1fr;gap:2rem;}}
.concept-phone{width:320px;max-width:100%;margin:0 auto;background:#0d0f11;border-radius:2.4rem;padding:9px;box-shadow:0 30px 80px rgba(24,29,27,.3);}
.concept-screen{background:var(--surface);border-radius:1.9rem;height:520px;overflow:hidden;display:flex;flex-direction:column;position:relative;}
.concept-note{font-size:.72rem;color:var(--outline);text-align:center;margin-top:.8rem;font-family:var(--font-label);letter-spacing:.08em;text-transform:uppercase;}
.arch-layers{max-width:40rem;margin:0 auto;display:flex;flex-direction:column;gap:0;}
.arch-node{background:var(--sc-lowest);border:1px solid rgba(189,201,197,.5);border-radius:.8rem;padding:.9rem 1.2rem;text-align:center;}
.arch-node h4{font-family:var(--font-display);font-size:.95rem;font-weight:600;color:var(--primary);}
.arch-node p{font-size:.76rem;color:var(--outline);margin-top:.15rem;}
.arch-node.hl{border-color:var(--primary);background:linear-gradient(180deg,rgba(194,232,221,.25),var(--sc-lowest) 70%);}
.arch-arrow{align-self:center;color:var(--outline);padding:.15rem 0;}
