/* Comercialia · Identidad glass 3.0. Shared by the public access and workspace. */
:root{--blue:#0071e3;--ice:#72ddf5;--violet:#aca2f4;--ink:#1d1d1f;--muted:#65656d;--line:#d8e2f0;--glass:rgba(255,255,255,.68);--glass-border:rgba(255,255,255,.85);--glass-shadow:0 16px 48px rgba(83,105,152,.08);background:#f1f5fc;color:var(--ink)}
body{background:radial-gradient(ellipse at 8% 22%,#72ddf52d,transparent 48%),radial-gradient(ellipse at 92% 8%,#aca2f449,transparent 45%),radial-gradient(ellipse at 80% 90%,#72ddf51c,transparent 45%),#f1f5fc;background-attachment:fixed}
.brand{min-height:74px;flex-shrink:0;justify-content:flex-start}
.brand-logo{display:block;width:220px;height:auto;max-width:100%;object-fit:contain}
.sidebar{width:260px;padding:18px 19px;overflow-y:auto;background:#ffffff80;backdrop-filter:blur(24px) saturate(140%);-webkit-backdrop-filter:blur(24px) saturate(140%);border-right:1px solid var(--glass-border);box-shadow:8px 0 40px #53699806}
.main{margin-left:260px}.workspace{margin:18px 0 22px;background:#ffffff73;border-color:#fff;border-radius:16px}.nav{gap:4px}.nav button{min-height:42px;border-radius:12px;color:#5f6879}.nav button.active{background:linear-gradient(115deg,#d4e9ff,#e5e5fb);box-shadow:inset 0 1px #fff;color:#005dbd}.sidebar-bottom{padding-top:22px}.local-label{background:#ffffff80;color:#59677a}.topbar{background:#ffffff61;border-bottom:1px solid #fff;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}.topbar-right{gap:10px}.avatar{background:linear-gradient(135deg,#e6faff,#ded8ff);color:#625898}.content{max-width:1500px}
.hero,.stat,.card,.panel,.crm-ai-bar,.crm-ai-card{background:var(--glass);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow),inset 0 1px 0 #fff;border-radius:24px;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.hero{background:radial-gradient(ellipse at 95% 25%,#aca2f439,transparent 55%),radial-gradient(ellipse at 58% 100%,#72ddf539,transparent 60%),#ffffff80;border-radius:28px;min-height:310px}.hero-copy{padding:38px}.hero-copy h2{font-size:38px;max-width:490px}.hero-copy h2 em,.auth-story h1 em{background:linear-gradient(100deg,#0071e3,#6463be);background-clip:text;-webkit-background-clip:text}.hero-art{min-width:0;background:radial-gradient(ellipse,#72ddf52e,transparent 65%)}.hub{width:170px;height:170px;border:0;background:transparent;box-shadow:none;backdrop-filter:none;transform:rotate(-8deg)}.hub img{width:160px;height:160px;object-fit:contain}.orbit{border-color:#fff;width:300px;height:200px;box-shadow:0 0 30px #72ddf515}.orbit.two{border-color:#ffffffb3;width:230px;height:250px}.float-label{background:#ffffffb8;border:1px solid #fff;box-shadow:0 14px 35px #53699812;color:#50596c;z-index:2}.float-label.a{top:25px;left:6px}.float-label.b{bottom:25px;right:16px}.float-label.c{top:94px;right:6px;font-size:10px}
.button{min-height:44px;background:var(--blue);box-shadow:inset 0 1px #ffffff30;transition:background .18s,box-shadow .18s,transform .18s}.button:hover{background:#0064cc;box-shadow:0 8px 24px #0071e326}.button.secondary{background:#ffffffbd;border-color:#d1dff0;color:#0065ca}.button.ghost{background:#e9f2ff;color:#0065ca}.button.danger{background:#fff0f0;color:#a23838}.button:disabled{transform:none;box-shadow:none}.button:focus-visible,a:focus-visible,button:focus-visible{outline:3px solid var(--blue);outline-offset:4px}.card-actions{flex-wrap:wrap}.card-actions .button{white-space:normal}.stat small{color:#687389}.stat-top{color:#59677a}.stat strong{font-weight:600}.agent-icon{border:1px solid #fff;background:linear-gradient(135deg,#e0f6ff,#e8e7ff);box-shadow:0 4px 12px #53699808;color:#0071e3}.card-meta{color:#697489;border-color:#dfe7f2}.card-description,.card p{color:#626a79}.template:hover{border-color:#a8cdf5;box-shadow:0 12px 32px #53699814}.section-head h2{letter-spacing:-.025em}.empty{background:#ffffff80;border-color:#becfe6}.notice{background:linear-gradient(115deg,#edf7ffed,#f2efffeb);color:#546078;border-color:#d7e5f7;border-radius:16px}
.field input,.field textarea,.field select,.crm-toolbar input,.crm-ai-search input{background:#ffffffeb;border:1px solid #cedaeb;border-radius:12px;min-height:44px;color:#1d1d1f}.field{color:#475467}.field input:focus,.field textarea:focus,.field select:focus,.crm-toolbar input:focus,.crm-ai-search input:focus{outline:2px solid #0071e3;outline-offset:2px}.field input::placeholder,.field textarea::placeholder{color:#747f91}.output{color:#475467}.panel .output{background:#ffffff8a;border-radius:14px;padding:16px}.close{color:#546078;background:#edf2fb;min-width:36px;min-height:36px}dialog{background:#f6f8fe;border:1px solid #fff;border-radius:28px;box-shadow:0 35px 100px #35446c33}dialog::backdrop{background:#26314d45;backdrop-filter:blur(8px)}
.auth-layout{background:transparent}.auth-story{background:radial-gradient(ellipse at 15% 40%,#72ddf540,transparent 54%),radial-gradient(ellipse at 100% 72%,#aca2f447,transparent 53%);padding:24px 60px 30px;gap:35px}.auth-story h1{font-size:clamp(44px,4.4vw,72px);line-height:1.04;letter-spacing:-.06em}.auth-story>div>p{max-width:450px;color:#596275}.auth-story .eyebrow{color:#0065ca;letter-spacing:.1em}.auth-story .hero-art{max-width:450px;height:260px;margin:16px 0}.auth-story .hub{width:185px;height:185px}.auth-story .hub img{width:180px;height:180px}.auth-story>p{color:#656d7e}.auth-form-wrap{background:#ffffff58;border-left:1px solid #ffffffd9;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}.auth-form{max-width:420px;background:#ffffff8c;border:1px solid #fff;border-radius:28px;padding:32px;box-shadow:var(--glass-shadow)}.auth-form h2{font-size:29px}.auth-tabs{background:#e9eef880;border:1px solid #dae3f2}.auth-tabs button{min-height:42px;color:#59677a}.auth-tabs button.selected{box-shadow:0 3px 10px #5369980d}.demo-caption,.auth-foot{color:#656d7e!important}.demo-banner{background:linear-gradient(110deg,#e9f5ffe6,#f0ecffe6);border-color:#ffffff;border-radius:18px;box-shadow:0 8px 25px #53699808}
.crm-stage{background:#ffffff8f;border-color:#fff;box-shadow:0 5px 20px #53699806;color:#59677a;border-radius:18px;min-height:90px}.crm-stage.selected{background:linear-gradient(125deg,#d8eeff,#e7e4ff);border-color:#95bfee}.crm-stage strong{color:#35445e}.crm-panel{border-radius:24px}.crm-table th{background:#f0f5fce6;color:#5c6a80}.crm-table td{border-color:#e1e9f4}.crm-table td small{color:#66758a}.crm-table tbody tr:hover{background:#f5f9ffa8}.crm-ai-chips button{background:#ffffffbd;color:#47658a;min-height:34px}.crm-ai-bar{background:linear-gradient(120deg,#eff9ffb8,#f0edffad)}.crm-ai-card{background:#f3f7fff0}.crm-ai-unknown{color:#56667c}.company-proposal{background:#edf3ff}.crm-ai-actions .button{min-height:40px}
#help-panel{background:#f7f9fff2;border-radius:24px;border:1px solid #fff;box-shadow:0 20px 70px #53699833}.help-header{background:linear-gradient(110deg,#eaf8ff,#ede8ff)}.help-avatar{width:48px;height:48px;background:transparent url('/assets/comercialia-symbol-glass.png') center/48px 48px no-repeat;font-size:0;flex-shrink:0}.help-header small{color:#616c83}.help-privacy{color:#687489}#help-launcher{background:#0071e3;min-height:48px;border-color:#ffffffa6;box-shadow:0 10px 35px #0071e32b}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.sidebar,.topbar,.hero,.stat,.card,.panel,.auth-form-wrap,.auth-form,.crm-ai-bar{background:#f9fbff}}
@media(max-width:1100px){.sidebar{width:248px;padding-inline:13px}.main{margin-left:248px}.content{padding-inline:24px}.hero-copy{padding:28px}.hero-copy h2{font-size:31px}.auth-story{padding:24px 32px}.auth-form-wrap{padding:30px 24px}.auth-form{padding:26px}.float-label.c{display:none}.topbar{padding-inline:24px}.page-heading{flex-wrap:wrap}}
@media(max-width:760px){.sidebar{position:static;width:100%;padding:6px 18px 12px;overflow:visible}.sidebar .brand{min-height:68px}.brand-logo{width:220px}.main{margin-left:0}.nav{margin-top:4px;scrollbar-width:thin}.nav button{min-height:44px;padding-inline:12px}.topbar{height:auto;min-height:58px;padding:10px 18px;flex-wrap:wrap;gap:5px}.topbar-right{gap:5px}.topbar-right .logout{padding:8px 6px}.content{padding:26px 18px 100px}.page-heading{gap:16px}.page-heading h1{font-size:29px}.page-heading p{font-size:13px}.hero{min-height:0;border-radius:24px}.hero-copy{padding:26px}.hero-copy h2{font-size:32px}.stats{gap:12px}.stat{padding:18px;border-radius:20px}.stat strong{font-size:30px}.auth-story{padding:8px 24px;gap:0}.auth-form-wrap{padding:10px 18px 100px;border-left:0;background:transparent;backdrop-filter:none}.auth-form{padding:26px;max-width:450px}.auth-form h2{font-size:27px}.demo-banner{flex-wrap:wrap;gap:12px}.crm-table tr{background:#ffffffe0;border-color:#dce6f3}.crm-toolbar{padding:16px}.crm-pipeline{gap:8px}.crm-stage{padding:12px}.modal-inner{padding:24px}.section-head{gap:12px}.section-head span{text-align:right}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important}.button{transition:none}.button:hover{transform:none}}

/* Social profiles shared by the access screen and workspace. */
.social-links{margin:22px 0 12px;padding-top:16px;border-top:1px solid #d9e0eb;text-align:center}
.social-links p{margin:0 0 5px;font-size:13px;font-weight:600;color:#334155}
.social-links>span{display:block;font-size:12px;color:#64748b}
.social-links>div{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:9px}
.social-links a{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:8px 12px;border-radius:10px;color:#075db8;background:#eaf2fc;text-decoration:none;font-size:12px;font-weight:600}
.social-links a:hover{background:#dbeafe;text-decoration:underline}
.social-links a:focus-visible{outline:3px solid #0071e3;outline-offset:3px}
.sidebar-bottom .social-links{margin-top:12px}

.clio-intro{display:flex;align-items:center;gap:32px;padding:24px 32px;background:linear-gradient(120deg,#fff,#eef6ff)}.clio-intro img{width:200px;height:200px;object-fit:contain;border-radius:28px;flex-shrink:0}.clio-intro h2{font-size:28px;line-height:1.2;margin:10px 0}.clio-intro p{max-width:540px;line-height:1.65;color:#526277}@media(max-width:760px){.clio-intro{flex-direction:column;gap:16px;padding:24px;text-align:center}.clio-intro img{width:160px;height:160px}.clio-intro h2{font-size:24px}}

.nav .clio-nav-avatar{width:32px;height:32px;object-fit:contain;border-radius:10px;flex-shrink:0;background:#fff}.nav button:has(.clio-nav-avatar){font-weight:600}@media(max-width:760px){.nav .clio-nav-avatar{width:26px;height:26px;border-radius:8px}}
