/* Otech Partner Hub v2 — product-specific styles. Shared tokens and components live in styles.css (unchanged). */

/* Page states: landing → login → app */
.landing{display:none}
body:not(.authed):not(.show-login) .landing{display:block}
body:not(.show-login) .login{display:none}
body.authed .login{display:none}
body:not(.authed) .app{display:none}
body:not(.authed){overflow:auto}
.login-card .back{margin-bottom:14px}

/* Landing page */
.lp-wrap{max-width:1180px;margin:0 auto;padding:0 28px}
.lp-nav{position:sticky;top:0;z-index:20;background:rgba(4,0,33,.92);backdrop-filter:blur(8px);padding:14px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.lp-nav .logo svg{height:28px;width:auto;display:block}
.lp-links{display:flex;flex-direction:row;gap:18px;margin-left:24px;overflow:visible}
.lp-links a{color:#CFC9FF;text-decoration:none;font-size:13.5px}
.lp-links a:hover{color:#fff}
.btn.lp-ghost{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.22)}
.btn.lp-ghost:hover{background:rgba(255,255,255,.16);color:#fff;border-color:rgba(255,255,255,.4)}
.btn.lg{padding:12px 18px;font-size:14.5px;border-radius:10px}
.lp-hero{position:relative;overflow:hidden;color:#fff;padding:64px 0 70px;background:radial-gradient(900px 420px at 88% 0%,rgba(255,120,0,.28),transparent 60%),linear-gradient(150deg,var(--night) 0%,#120A6B 55%,var(--deep) 100%)}
.lp-hero .dots{position:absolute;left:-140px;bottom:-160px;width:620px;height:620px;border-radius:50%;background-image:radial-gradient(rgba(255,255,255,.6) 1px,transparent 1.5px);background-size:11px 11px;opacity:.22;-webkit-mask:radial-gradient(circle,#000 35%,transparent 70%);mask:radial-gradient(circle,#000 35%,transparent 70%)}
.lp-hero-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:44px;align-items:center;position:relative}
.lp-hero h1{font-size:44px;line-height:1.1;color:#fff;margin:0 0 16px}
.lp-hero p{color:#CFC9FF;font-size:16.5px;line-height:1.6;margin:0}
.eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:#FFB774;margin-bottom:12px;font-weight:700}
.eyebrow.dark{color:var(--orange)}
.lp-preview{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:18px;padding:14px;box-shadow:0 30px 80px rgba(0,0,0,.35)}
.lp-ptabs{display:flex;gap:4px;margin-bottom:10px}
.lp-ptabs button{border:0;background:none;color:#B8B1F5;font-weight:700;font-size:12.5px;padding:7px 11px;border-radius:8px}
.lp-ptabs button.on{background:#fff;color:var(--deep)}
.pv{background:var(--bg);border-radius:12px;padding:12px;color:var(--ink);display:flex;flex-direction:column;gap:10px}
.pv-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.pv-k{background:#fff;border:1px solid var(--line-2);border-radius:10px;padding:9px 10px}
.pv-k b{font-family:Sora;font-size:15px;display:block;margin-top:3px}
.pv-card{background:#fff;border:1px solid var(--line-2);border-radius:10px;padding:10px 12px}
.pv-req{display:grid;grid-template-columns:140px 1fr 118px;gap:8px;align-items:center;font-size:12px;padding:3px 0}
.pv-steps{display:flex;gap:6px;flex-wrap:wrap}
.pv-steps span{font-size:11.5px;font-weight:700;border-radius:20px;padding:4px 10px;background:var(--deep-xl);color:var(--deep)}
.pv-steps span.ok{background:var(--green-l);color:var(--green)}
.lp-sec{padding:60px 0;background:#fff}
.lp-sec.alt{background:var(--bg)}
.lp-two{display:grid;grid-template-columns:1fr 1.4fr;gap:40px}
.lp-h2{font-size:30px;line-height:1.2;margin:0}
.lp-lead p{font-size:15.5px;line-height:1.7;color:var(--ink-2);margin:0 0 12px}
.lp-ben .ico{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:var(--deep-xl);color:var(--deep);margin-bottom:12px}
.lp-ben .ico svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.7}
.lp-ben p{color:var(--ink-2);line-height:1.6;font-size:13.5px;margin:8px 0 0}
.lp-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.lp-step{border-top:3px solid var(--deep);padding-top:14px}
.lp-step p{color:var(--ink-2);line-height:1.55;font-size:13.5px}
.lp-step h3{margin-top:10px}
.lp-faq{border-bottom:1px solid var(--line-2);padding:14px 0}
.lp-faq summary{font-weight:700;cursor:pointer}
.lp-faq p{color:var(--ink-2);margin:8px 0 0;line-height:1.6}
.lp-cta{padding:44px 0;background:linear-gradient(120deg,var(--night),#1A0E8C 60%,var(--deep))}
.lp-foot{padding:20px 0;background:var(--night);color:#8F86D9;font-size:12.5px}
@media (max-width:980px){.lp-hero-grid,.lp-two{grid-template-columns:1fr}.lp-steps{grid-template-columns:1fr 1fr}.lp-links{display:none}.lp-hero h1{font-size:34px}}

/* Navigation */
.nav-cta{display:block;width:100%;margin:2px 0 8px;border:0;border-radius:10px;padding:10px;background:var(--orange);color:#fff;font-weight:700;font-size:13.5px}
.nav-cta:hover{filter:brightness(1.06)}
.nav-item.feature{background:rgba(255,120,0,.12);color:#fff;font-weight:700}
.nav-item.feature.on{background:rgba(255,255,255,.16)}
.hero-btn{background:rgba(255,255,255,.12)!important;color:#fff!important;border-color:rgba(255,255,255,.25)!important}

/* Notifications bell */
.bell-wrap{position:relative}
.bell{width:38px;height:38px;border-radius:10px;border:1px solid var(--line-2);background:#fff;display:grid;place-items:center;position:relative}
.bell svg{width:19px;height:19px;stroke:var(--ink-2);fill:none;stroke-width:1.7}
.bell-count{position:absolute;top:-5px;right:-5px;background:var(--orange);color:#fff;font-size:10.5px;font-weight:700;border-radius:20px;padding:1px 6px;min-width:18px;text-align:center}
.bell-menu{width:370px}
.bell-list{max-height:420px;overflow:auto}
.bell-item{display:flex;gap:10px;padding:11px 14px;border-bottom:1px solid var(--line-2);cursor:pointer;font-size:13px;line-height:1.4}
.bell-item:hover{background:var(--deep-xl)}
.bell-item.unread{background:#FBFAFF}
.bell-item.unread b::after{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--orange);margin-left:6px;vertical-align:middle}
.menu hr{border:0;border-top:1px solid var(--line-2);margin:4px 0}
.menu button[disabled]{opacity:.5}
.menu button[hidden]{display:none}

/* Layout helpers */
.g5{grid-template-columns:repeat(5,1fr)}
@media (max-width:1200px){.g5{grid-template-columns:repeat(3,1fr)}}
.grid>*{min-width:0}
.card.click{cursor:pointer}.card.click:hover{border-color:var(--deep)}
.qhead{display:flex;align-items:center;gap:10px;margin:0 0 12px}
.qhead .right{margin-left:auto}
.qn{width:26px;height:26px;border-radius:8px;background:var(--orange);color:#fff;display:grid;place-items:center;font-family:Sora;font-weight:600;font-size:13px;flex:none}
.statbox{border:1px solid var(--line-2);border-radius:12px;padding:12px;background:#fff}
.statbox.click{cursor:pointer}.statbox.click:hover{border-color:var(--deep)}
.hb{display:grid;gap:10px;align-items:center;margin:8px 0}
.hb-l{color:var(--ink-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hb-t{height:14px;background:#F2F1F7;border-radius:4px;overflow:hidden}
.hb-t div{height:100%;border-radius:0 4px 4px 0}
.unlock{padding:10px 0;border-bottom:1px dashed var(--line-2)}
.unlock:last-child{border:0}
.sel{height:34px;border:1px solid var(--line);border-radius:9px;padding:0 8px;font:inherit;font-size:13px;background:#fff}
select.autonomy{height:32px;border:1px solid var(--line);border-radius:8px;font:inherit;font-size:12px;padding:0 6px}
.capgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}
.capgrid label{display:flex;gap:6px;align-items:center}
.field input,.field select{width:100%}

/* Proposal / approval cards */
.prop{border:1px solid var(--line-2);border-radius:12px;padding:12px 14px;margin-bottom:10px;background:#fff}
.prop.risk{border-color:#F5C2C2;background:#FFFBFB}
.prop.done{opacity:.6}
.prop.ai{background:var(--deep-xl);border-color:var(--deep-l);margin:8px 0}
.prop .ph{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.prop .ph .right{margin-left:auto}
.prop .acts{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap;align-items:center}
.mini{border:1px solid var(--line-2);border-radius:10px;padding:10px;background:#fff}
.chain{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:8px 0 4px}
.cstep{font-size:11.5px;font-weight:700;border-radius:8px;padding:4px 9px;background:#F0F0F3;color:var(--ink-2);display:inline-flex;flex-direction:column;line-height:1.25}
.cstep i{font-style:normal;font-weight:400;font-size:10.5px;opacity:.8}
.cstep.ok{background:var(--green-l);color:var(--green)}
.cstep.cur{background:var(--gold-l);color:#9A6A00;box-shadow:inset 0 0 0 1px #F3DFA4}
.cstep.no{background:var(--red-l);color:var(--red)}
.arr{color:var(--muted)}
.stepper,.stage-track{display:flex;gap:4px;margin:12px 0;flex-wrap:wrap}
.stepper span,.stage-track span{flex:1;min-width:90px;text-align:center;font-size:11.5px;font-weight:700;padding:7px 6px;border-radius:8px;background:#F0F0F3;color:var(--ink-2)}
.stepper span.ok,.stage-track span.ok{background:var(--green-l);color:var(--green)}
.stepper span.cur,.stage-track span.cur{background:var(--deep);color:#fff}
.stage-track span.lost{background:var(--red-l);color:var(--red)}
.tl{font-size:12.5px;line-height:1.55;display:flex;flex-direction:column;gap:6px;max-height:300px;overflow:auto}
.tl>div{padding-left:10px;border-left:2px solid var(--line)}
.mfoot{display:flex;gap:8px;margin-top:16px;flex-wrap:wrap;align-items:center;border-top:1px solid var(--line-2);padding-top:14px}
.modal.wide{width:980px}
.kanban.k6{grid-template-columns:repeat(6,minmax(180px,1fr))}
.kanban .kcard .n{line-height:1.35}

/* Knowledge base */
.kb{display:grid;grid-template-columns:320px 1fr;gap:16px;align-items:start}
.kb-side{padding:12px;position:sticky;top:0}
.kb-side input{width:100%;height:36px;border:1px solid var(--line);border-radius:9px;padding:0 10px;font:inherit;outline:none;margin-bottom:10px}
.kb-cats{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:10px}
.kb-cats button{border:1px solid var(--line-2);background:#fff;border-radius:20px;padding:4px 9px;font-size:11.5px;font-weight:700;color:var(--ink-2)}
.kb-cats button.on{background:var(--deep-xl);color:var(--deep);border-color:var(--deep-l)}
.kb-list{display:flex;flex-direction:column;gap:2px;max-height:56vh;overflow:auto}
.kb-item{border:0;background:none;text-align:left;padding:9px 10px;border-radius:9px;display:flex;flex-direction:column;gap:2px;font:inherit;font-size:13px}
.kb-item:hover{background:var(--deep-xl)}
.kb-item.on{background:var(--deep-xl);box-shadow:inset 3px 0 0 var(--deep)}
.kb-body{white-space:pre-wrap;line-height:1.7;font-size:14px;color:var(--ink)}
@media (max-width:1000px){.kb{grid-template-columns:1fr}}

/* Hub AI result cards */
.aicard{background:#fff;border:1px solid var(--line-2);border-radius:10px;margin:6px 0 8px;overflow:hidden;white-space:normal}
.aicard table{font-size:12px}
.aicard th{font-size:10.5px;padding:6px 8px}
.aicard td{padding:6px 8px}
.aicard a{color:var(--deep);text-decoration:none;font-weight:700}
.aicard.ok{padding:8px 10px;color:var(--green);font-weight:700;font-size:12.5px}
.msg.bot .prop{white-space:normal}
.msg.bot>div{white-space:pre-wrap}
.req-row{grid-template-columns:170px 1fr 128px}
.page-head .actions .btn{white-space:nowrap}
.page-head .sub{max-width:900px}
.ai-suggest{flex-wrap:nowrap;overflow-x:auto;padding-bottom:8px;scrollbar-width:thin}
.ai-suggest button{white-space:nowrap;flex:none}