/* ECHO Consulting · B · The First Consult (showroom) + The Casebook (deck) · v3 */
body[data-lang="en"] .es,body[data-lang="es"] .en{display:none}
#consult,#ledger{position:relative;padding:clamp(80px,9vw,150px) var(--pad);background:var(--ivory);color:var(--ink);overflow:hidden}
#ledger{background:var(--paper)}
#consult::before,#ledger::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(18,24,33,.18),transparent)}
.cw{position:relative;z-index:2;max-width:1300px;margin:0 auto}
.ch2{display:flex;align-items:baseline;gap:16px}
.ch2 .no{font-family:var(--mo);font-size:11px;letter-spacing:.24em;color:var(--gold-d)}
.ch2 .no::after{content:"";display:inline-block;width:38px;height:1px;background:var(--gold-d);vertical-align:middle;margin-left:13px}
.ch2 .kk{font-family:var(--mo);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-3)}
.chh{font-family:var(--sf);font-weight:500;font-size:clamp(32px,4.6vw,64px);line-height:1.02;letter-spacing:-.02em;margin:20px 0 0;max-width:19ch;text-wrap:balance;color:var(--ink)}
.chh em{font-style:italic;color:var(--gold-d)}
.gh{position:absolute;top:6px;right:-6px;z-index:0;font-family:var(--sf);font-style:italic;font-weight:700;font-size:clamp(140px,20vw,300px);line-height:1;color:transparent;-webkit-text-stroke:1px rgba(18,24,33,.08);pointer-events:none;user-select:none;will-change:transform}
/* ── consult · left column ── */
.cgrid{display:grid;grid-template-columns:minmax(0,.74fr) minmax(0,1.26fr);gap:clamp(30px,4.4vw,72px);margin-top:clamp(34px,4vw,58px);align-items:start}
.cl p{font-size:16px;line-height:1.72;color:var(--ink-2);text-wrap:pretty}
.cl p b{color:var(--ink);font-weight:600}
.cl p+p{margin-top:15px}
.hows{list-style:none;margin:26px 0 0;padding:0;border-top:1.5px solid var(--ink)}
.hows li{display:grid;grid-template-columns:30px 1fr;gap:14px;padding:13px 0;border-bottom:1px solid var(--lni2);align-items:baseline}
.hows .n{font-family:var(--mo);font-size:10px;color:var(--gold-d)}
.hows span{font-size:13.5px;line-height:1.56;color:var(--ink-2)}
.cl p.cnote{margin-top:20px;font-family:var(--mo);font-size:9px;line-height:2;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3)}
/* ── consult · the showroom console ── */
.cons{position:relative;background:#fff;border:1px solid var(--lni);box-shadow:14px 14px 0 -1px rgba(201,151,58,.16),0 30px 70px -40px rgba(18,24,33,.34)}
.cbar{display:flex;align-items:center;gap:10px;padding:14px 20px;border-bottom:1px solid var(--lni);font-family:var(--mo);font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-3);background:var(--ivory-2)}
.cbar .dt{width:6px;height:6px;border-radius:50%;background:var(--gold-d);box-shadow:0 0 8px rgba(168,122,34,.55);animation:cp 2.6s ease-in-out infinite}
.cbar.busy .dt{background:var(--ink);box-shadow:0 0 8px rgba(18,24,33,.4)}
.cbar.done .dt{background:var(--ink-3);box-shadow:none;animation:none}
.cbar .rt{margin-left:auto;color:var(--gold-d)}
@keyframes cp{0%,100%{opacity:1}50%{opacity:.3}}
.cbody{padding:clamp(22px,2.6vw,34px)}
/* mode pills */
.modes{display:flex;gap:9px;flex-wrap:wrap}
.mode{display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:10px 19px;border:1px solid var(--lni);border-radius:99px;background:#fff;font-family:var(--sa);font-size:13.5px;font-weight:600;color:var(--ink-2);cursor:pointer;transition:border-color .25s,color .25s,background .3s,box-shadow .3s}
.mode svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7}
.mode:hover{border-color:var(--gold-d);color:var(--ink)}
.mode[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--ivory);box-shadow:4px 4px 0 -1px var(--gold-d)}
/* stage + panels */
.stage{position:relative;margin-top:20px;min-height:284px}
.pnl{display:none;animation:pfade .5s ease both}
.pnl.on{display:block}
@keyframes pfade{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
/* SPEAK · the orb */
.orbwrap{display:flex;flex-direction:column;align-items:center;text-align:center;padding:16px 0 4px}
.orb{position:relative;width:clamp(128px,15vw,172px);aspect-ratio:1;border-radius:50%;border:0;cursor:pointer;background:radial-gradient(circle at 34% 30%,#2E3D55,var(--ink) 64%);box-shadow:0 22px 46px -18px rgba(18,24,33,.55),inset 0 1px 0 rgba(255,255,255,.14),0 0 0 1px var(--lni);transition:transform .4s cubic-bezier(.2,.7,.2,1),box-shadow .4s;animation:breathe 4.2s ease-in-out infinite}
.orb::before{content:"";position:absolute;inset:-9px;border-radius:50%;border:1px solid rgba(201,151,58,.5)}
.orb::after{content:"";position:absolute;inset:0;border-radius:50%;pointer-events:none}
.orb:hover{transform:scale(1.035)}
.orb:disabled{cursor:not-allowed;opacity:.58;transform:none;animation:none}
@keyframes breathe{0%,100%{box-shadow:0 22px 46px -18px rgba(18,24,33,.55),inset 0 1px 0 rgba(255,255,255,.14),0 0 0 1px var(--lni)}50%{box-shadow:0 26px 54px -18px rgba(18,24,33,.62),inset 0 1px 0 rgba(255,255,255,.14),0 0 0 7px rgba(201,151,58,.08)}}
.orb .omi{position:absolute;inset:0;display:grid;place-items:center;color:var(--ivory)}
.orb .omi svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.6}
.orb .obars{position:absolute;inset:0;display:none;align-items:center;justify-content:center;gap:5px}
.orb .obars i{width:3.5px;height:14px;border-radius:3px;background:var(--gold-l,#C9973A);animation:eq 1s ease-in-out infinite}
.orb .obars i:nth-child(2){animation-delay:.12s}.orb .obars i:nth-child(3){animation-delay:.24s}.orb .obars i:nth-child(4){animation-delay:.36s}.orb .obars i:nth-child(5){animation-delay:.48s}
@keyframes eq{0%,100%{transform:scaleY(.45)}50%{transform:scaleY(1.6)}}
.orb.listen{animation:none;box-shadow:0 26px 56px -18px rgba(18,24,33,.6),0 0 0 1px rgba(201,151,58,.6)}
.orb.listen .omi{display:none}
.orb.listen .obars{display:flex}
.orb.listen::after{border:1px solid rgba(201,151,58,.55);animation:ring 1.9s ease-out infinite}
.orb.listen::before{animation:ring 1.9s ease-out .55s infinite}
@keyframes ring{from{transform:scale(1);opacity:.85}to{transform:scale(1.55);opacity:0}}
.ostat{margin-top:18px;font-family:var(--sf);font-weight:600;font-size:clamp(19px,1.9vw,23px);color:var(--ink)}
.osub{margin-top:6px;font-size:13px;line-height:1.6;color:var(--ink-3);max-width:40ch}
.otm{margin-top:10px;font-family:var(--mo);font-size:10px;letter-spacing:.24em;color:var(--gold-d)}
.otx{margin-top:16px;width:100%;min-height:52px;padding:12px 4px 6px;border-top:1px solid var(--lni);font-size:14px;line-height:1.65;color:var(--ink-2);text-align:left;text-wrap:pretty}
.otx:empty::before{content:attr(data-ph);color:var(--ink-3);font-style:italic}
/* WRITE */
.cta-lbl{font-family:var(--mo);font-size:9px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold-d);display:block;margin-bottom:11px}
#cin{width:100%;min-height:168px;resize:vertical;font-family:var(--sa);font-size:15.5px;line-height:1.7;color:var(--ink);background:repeating-linear-gradient(180deg,transparent 0 30px,rgba(18,24,33,.07) 30px 31px);border:0;border-bottom:1px solid var(--lni);padding:4px 2px;transition:border-color .3s}
#cin:focus{outline:0;border-bottom-color:var(--gold-d)}
#cin::placeholder{color:var(--ink-3)}
/* SHOW */
.drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:172px;border:1.5px dashed rgba(18,24,33,.28);background:var(--ivory);cursor:pointer;text-align:center;padding:22px;transition:border-color .3s,background .3s}
.drop:hover,.drop.over{border-color:var(--gold-d);background:#fff}
.drop svg{width:26px;height:26px;fill:none;stroke:var(--gold-d);stroke-width:1.5}
.drop b{font-family:var(--sa);font-size:14.5px;font-weight:600;color:var(--ink)}
.drop span{font-family:var(--mo);font-size:8.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}
.cap1{width:100%;margin-top:14px;min-height:48px;font-family:var(--sa);font-size:14.5px;color:var(--ink);border:0;border-bottom:1px solid var(--lni);padding:6px 2px;background:transparent}
.cap1:focus{outline:0;border-bottom-color:var(--gold-d)}
.cap1::placeholder{color:var(--ink-3)}
.thumb{display:flex;align-items:center;gap:10px;margin-top:12px;padding:9px 12px;border:1px solid var(--lni);background:var(--ivory)}
.thumb img{width:38px;height:38px;object-fit:cover;border:1px solid var(--lni)}
.thumb span{font-family:var(--mo);font-size:9px;letter-spacing:.1em;color:var(--ink-2);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.thumb button{font-family:var(--mo);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);cursor:pointer;min-height:44px;padding:0 8px}
.thumb button:hover{color:#B3372F}
/* send row + vertical-integration strip */
.sendrow{display:flex;align-items:center;gap:14px;margin-top:20px;flex-wrap:wrap}
#cgo{flex:1;min-width:220px;min-height:56px;display:flex;align-items:center;justify-content:center;gap:11px;font-family:var(--sa);font-size:14.5px;font-weight:600;color:var(--ivory);background:var(--ink);border:1px solid var(--ink);cursor:pointer;transition:transform .28s,box-shadow .28s,opacity .28s;box-shadow:6px 6px 0 -1px var(--gold-d)}
#cgo:hover:not(:disabled){transform:translate(-2px,-2px);box-shadow:9px 9px 0 -1px var(--gold-d)}
#cgo:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}
.cct{font-family:var(--mo);font-size:9px;letter-spacing:.14em;color:var(--ink-3)}
.cct.warn{color:var(--gold-d)}
.vstrip{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;padding:13px 20px;border-top:1px solid var(--lni);background:var(--ivory-2);font-family:var(--mo);font-size:8.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-3)}
.vstrip b{color:var(--gold-d);font-weight:500}
.vstrip i{width:3px;height:3px;border-radius:50%;background:var(--gold-d);display:block}
.cerr{margin-top:13px;padding:12px 14px;border-left:2px solid #B3372F;background:rgba(179,55,47,.06);font-size:13px;line-height:1.6;color:#8C2A24}
/* output note */
.cout{animation:cfade .8s ease both}
@keyframes cfade{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.cout .rl{display:flex;align-items:center;gap:13px;padding-bottom:16px;margin-bottom:22px;border-bottom:1.5px solid var(--ink)}
.cout .rl span{font-family:var(--mo);font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-d)}
.cout .rl i{flex:1;height:0;display:block}
.cout .rl em{font-style:normal;font-family:var(--mo);font-size:9px;letter-spacing:.14em;color:var(--ink-3)}
.cout .txt{font-family:var(--sf);font-size:clamp(17.5px,1.7vw,21px);line-height:1.54;color:var(--ink);text-wrap:pretty}
.cout .txt p{margin:0 0 15px}
.cout .txt p:first-child{font-size:clamp(21px,2.2vw,28px);line-height:1.28;color:var(--gold-d);font-style:italic;margin-bottom:20px}
.cout .txt p:last-child{margin-bottom:0}
.voiceout{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:22px;padding:14px 0;border-top:1px solid var(--lni);border-bottom:1px solid var(--lni)}
.voiceout button{display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:10px 16px;border:1px solid var(--ink);background:var(--ink);color:var(--ivory);font-family:var(--sa);font-size:13px;font-weight:600;cursor:pointer;transition:transform .25s,box-shadow .25s,opacity .25s}
.voiceout button:hover:not(:disabled){transform:translateY(-2px);box-shadow:4px 4px 0 -1px var(--gold-d)}
.voiceout button:disabled{opacity:.55;cursor:wait}
.voiceout button.playing{background:var(--gold-d);border-color:var(--gold-d)}
.voiceout button svg{width:18px;height:18px;fill:currentColor;stroke:currentColor;stroke-width:1.5}
.voiceout>span{font-family:var(--mo);font-size:8.5px;line-height:1.5;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)}
#caud{width:100%}
#caud:empty{display:none}
#caud audio{width:100%;height:42px}
.cend{margin-top:26px;padding-top:22px;border-top:1px solid var(--lni);display:flex;flex-wrap:wrap;align-items:center;gap:16px 22px}
.cend p{flex:1;min-width:220px;font-size:13.5px;line-height:1.6;color:var(--ink-2)}
.cend a{display:inline-flex;align-items:center;gap:10px;padding:14px 26px;background:var(--ink);color:var(--ivory);font-size:14px;font-weight:600;box-shadow:5px 5px 0 -1px var(--gold-d);transition:transform .3s,box-shadow .3s}
.cend a:hover{transform:translate(-2px,-2px);box-shadow:8px 8px 0 -1px var(--gold-d);color:var(--ivory)}
.dots3{display:inline-flex;gap:5px;align-items:center}
.dots3 i{width:5px;height:5px;border-radius:50%;background:currentColor;display:block;animation:dl 1.3s ease-in-out infinite}
.dots3 i:nth-child(2){animation-delay:.16s}.dots3 i:nth-child(3){animation-delay:.32s}
@keyframes dl{0%,100%{opacity:.25;transform:translateY(0)}50%{opacity:1;transform:translateY(-3px)}}
/* ── the casebook · glossy deck ── */
.deck{display:flex;gap:clamp(16px,2.2vw,28px);margin-top:clamp(32px,4vw,54px);overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;padding:16px calc(max((100% - 780px)/2, 4px)) 30px;scrollbar-width:none;-webkit-overflow-scrolling:touch;cursor:grab}
.deck::-webkit-scrollbar{display:none}
.deck.dragging{cursor:grabbing;scroll-snap-type:none}
.pgc{flex:0 0 min(780px,88%);scroll-snap-align:center;scroll-snap-stop:always}
.pgin{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--lni);box-shadow:0 30px 70px -42px rgba(18,24,33,.5);transform:scale(.965);opacity:.62;transition:transform .55s cubic-bezier(.2,.7,.2,1),opacity .5s,box-shadow .55s;overflow:hidden}
.pgc.focus .pgin{transform:scale(1);opacity:1;box-shadow:0 44px 90px -44px rgba(18,24,33,.62)}
.pgin::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold-d),transparent);opacity:0;transition:opacity .5s;z-index:3}
.pgc.focus .pgin::before{opacity:1}
.plate{position:relative;background:linear-gradient(160deg,#fff,var(--paper));padding:clamp(18px,2.4vw,30px);display:grid;place-items:center;min-height:clamp(210px,30vw,330px)}
.plate img{max-width:100%;max-height:clamp(190px,27vw,300px);width:auto;border:1px solid var(--lni);box-shadow:0 18px 40px -20px rgba(18,24,33,.5);pointer-events:none}
.plate::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.5) 50%,transparent 58%);transform:translateX(-130%);pointer-events:none}
.pgc.focus .plate::after{animation:sheen 1.4s cubic-bezier(.3,.6,.3,1) .18s both}
@keyframes sheen{to{transform:translateX(130%)}}
.note{padding:clamp(18px,2.4vw,28px) clamp(18px,2.6vw,32px) clamp(16px,2vw,24px);border-top:1px solid var(--lni);display:flex;flex-direction:column}
.lkick{font-family:var(--mo);font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--gold-d)}
.lttl{font-family:var(--sf);font-weight:600;font-size:clamp(21px,2.4vw,30px);line-height:1.08;letter-spacing:-.012em;margin:9px 0 0;color:var(--ink);text-wrap:balance}
.lstat{display:grid;grid-template-columns:repeat(4,auto);gap:0 clamp(14px,2vw,26px);margin:14px 0 0;padding:11px 0;border-top:1.5px solid var(--ink);border-bottom:1px solid var(--lni);justify-content:start}
.lstat div b{display:block;font-family:var(--sf);font-style:italic;font-weight:600;font-size:clamp(18px,1.9vw,24px);line-height:1;color:var(--gold-d)}
.lstat div span{display:block;margin-top:4px;font-family:var(--mo);font-size:7.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3)}
.lbul{list-style:none;margin:13px 0 0;padding:0}
.lbul li{position:relative;padding:0 0 8px 18px;font-size:13.5px;line-height:1.55;color:var(--ink-2)}
.lbul li::before{content:"";position:absolute;left:0;top:9px;width:9px;height:1px;background:var(--gold-d)}
.fol{margin-top:auto;padding-top:12px;font-family:var(--mo);font-size:9px;letter-spacing:.2em;color:var(--ink-3)}
.fol b{color:var(--gold-d);font-weight:500}
/* deck rail */
.drail{display:flex;align-items:center;gap:18px;margin-top:6px;flex-wrap:wrap}
.lbtn{width:46px;height:46px;border:1px solid var(--lni);color:var(--ink);font-size:15px;cursor:pointer;display:grid;place-items:center;background:#fff;transition:border-color .25s,color .25s,transform .25s;flex:0 0 auto}
.lbtn:hover{border-color:var(--gold-d);color:var(--gold-d);transform:translateY(-2px)}
.dtrack{position:relative;flex:1;min-width:140px;height:2px;background:rgba(18,24,33,.12);overflow:hidden}
.dfill{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,var(--gold-d),var(--gold-l,#C9973A));transition:width .25s ease}
.dcnt{font-family:var(--mo);font-size:10px;letter-spacing:.24em;color:var(--ink-3);white-space:nowrap}
.dcnt b{color:var(--gold-d);font-weight:500}
.lhint{width:100%;font-family:var(--mo);font-size:8.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-3)}
.rvx{opacity:0;transform:translateY(26px);transition:opacity .9s ease,transform 1s cubic-bezier(.2,.7,.2,1)}
.rvx.in{opacity:1;transform:none}
@media(max-width:1000px){.cgrid{grid-template-columns:1fr}.gh{font-size:120px}.pgc{flex-basis:88%}}
@media(max-width:620px){
 #consult,#ledger{padding-left:20px;padding-right:20px}
 .lstat{grid-template-columns:repeat(2,auto);gap:10px 26px}
 .cend a{width:100%;justify-content:center}
 .modes{gap:8px}.mode{padding:10px 15px;font-size:13px}
 .deck{padding-left:10px;padding-right:10px}
 .pgc{flex-basis:92%}
 .plate{min-height:0}.plate img{max-height:200px}
 .sendrow{flex-direction:column;align-items:stretch}.cct{text-align:right}
 .orb{width:132px}
}
@media(prefers-reduced-motion:reduce){
 .rvx{opacity:1!important;transform:none!important}
 .cbar .dt,.dots3 i,.orb,.orb.listen::before,.orb.listen::after,.orb .obars i{animation:none!important}
 .cout,.pnl{animation:none}
 .plate::after{display:none}
 .pgin{transform:none;opacity:1;transition:none}
 .deck{scroll-behavior:auto}
}