:root { --ink:#0b2a68; --blue:#9ebcf4; --sky:#e8effc; --paper:#fcfcf8; --line:#d9e0ea; --muted:#68728a; --lime:#d7e58d; --orange:#f0c17e; --rose:#e4a8ae; }
.brand { display:grid; grid-template-columns:39px 1fr; column-gap:9px; align-items:center; } .brand-monogram { display:grid; place-items:center; width:38px; height:38px; border:1px solid #b8cef8; color:#b8cef8; font:600 17px 'Playfair Display'; } .brand-name { color:white; font:700 16px/.9 Manrope; letter-spacing:.11em; } .brand img { display:none; } .brand span { grid-column:1/-1; margin-left:0; }
* { box-sizing:border-box; } body { margin:0; background:#edf2fa; color:var(--ink); font-family:Manrope, sans-serif; } button,input,textarea,select { font:inherit; } button { cursor:pointer; } .shell { min-height:100vh; display:flex; } .sidebar { position:sticky; top:0; height:100vh; width:252px; display:flex; flex-direction:column; padding:28px 22px; background:var(--ink); color:white; } .brand img { display:block; width:174px; height:auto; filter:brightness(0) invert(1); } .brand span { display:block; margin:7px 0 0 4px; color:#9ebcf4; font-family:'DM Mono'; font-size:10px; letter-spacing:.16em; } .environment { width:max-content; margin:48px 0 24px; padding:6px 8px; color:#bed0f6; border:1px solid #31568f; font:10px 'DM Mono'; letter-spacing:.08em; } .environment i { display:inline-block; width:6px; height:6px; margin-left:6px; border-radius:50%; background:var(--lime); } nav { display:grid; gap:7px; } .nav-item { display:flex; align-items:center; width:100%; gap:13px; border:0; border-radius:5px; padding:12px 10px; color:#c7d7f5; background:transparent; text-align:left; font-size:13px; } .nav-item span { color:#7099d9; font:10px 'DM Mono'; } .nav-item:hover,.nav-item.active { color:#102c66; background:#b8cef8; } .nav-item.active span { color:#315794; } .sidebar-footer { margin-top:auto; padding:16px 10px; border-top:1px solid #274a7f; font-size:12px; } .sidebar-footer small { display:block; margin-top:3px; color:#a5badc; } .workspace { width:min(1440px, calc(100% - 252px)); padding:0 5.2vw 64px; background:linear-gradient(125deg,#f5f8fd 0%,#f8f9f3 64%,#e4edff 100%); } .topbar { display:flex; align-items:center; justify-content:space-between; min-height:92px; border-bottom:1px solid var(--line); } .topbar p { color:var(--muted); margin:0; font:11px 'DM Mono'; letter-spacing:.03em; } .eyebrow { margin:0 0 9px; color:#63759a; font:10px 'DM Mono'; letter-spacing:.1em; } .outline-button,.primary-button { border:1px solid var(--ink); padding:11px 16px; border-radius:3px; color:var(--ink); background:transparent; font-weight:700; font-size:12px; } .primary-button { border-color:var(--ink); color:white; background:var(--ink); } .primary-button:hover { background:#214587; } .view { display:none; animation:enter .38s ease both; } .view.active { display:block; } @keyframes enter { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } } .hero-line,.detail-head { display:flex; align-items:end; justify-content:space-between; gap:30px; padding:58px 0 30px; } h1,h2,p { margin-top:0; } h1 { max-width:800px; margin-bottom:0; font:700 clamp(36px,4vw,62px)/1.03 'Playfair Display', serif; letter-spacing:-.045em; } h1 em { color:#6181bd; font-weight:600; } h2 { font:700 22px/1.1 'Playfair Display', serif; letter-spacing:-.03em; } .date-tile { text-align:right; color:#6784bc; } .date-tile b { display:block; font:700 44px/.7 'Playfair Display'; }.date-tile span { display:block; margin-top:10px; font:10px 'DM Mono'; letter-spacing:.1em; } .metrics { display:grid; grid-template-columns:repeat(3,1fr); gap:15px; } .metrics article { min-height:142px; padding:22px; border:1px solid var(--line); background:rgba(255,255,255,.66); } .metrics span,.metrics small { display:block; color:var(--muted); font-size:11px; } .metrics strong { display:block; margin:10px 0 7px; font:700 48px/.9 'Playfair Display'; }.section-title { display:flex; align-items:end; justify-content:space-between; margin:54px 0 17px; }.section-title.compact { margin-top:44px; }.section-title h2 { margin:0; }.text-button,.back-link { border:0; padding:0; color:var(--ink); background:none; font-size:12px; font-weight:700; }.text-button span { margin-left:8px; }.dossier-list { border-top:1px solid var(--line); }.dossier-row { display:grid; grid-template-columns:44px minmax(190px,1.5fr) 180px 130px 20px; align-items:center; gap:16px; width:100%; padding:19px 6px; border:0; border-bottom:1px solid var(--line); background:transparent; color:var(--ink); text-align:left; }.dossier-row:hover,.dossier-row.selected { background:rgba(158,188,244,.16); }.company-mark { display:grid; place-items:center; width:36px; height:36px; border-radius:50%; color:var(--ink); background:var(--blue); font:11px 'DM Mono'; }.company-mark.muted { background:#dce1e8; }.dossier-name b,.dossier-name small { display:block; }.dossier-name b { font-size:13px; }.dossier-name small { margin-top:3px; color:var(--muted); font-size:10px; }.step { color:var(--muted); font-size:11px; }.step.current { color:#aa6d0e; }.step.ready { color:#4c7221; }.progress { height:4px; background:#dde4eb; }.progress i { display:block; height:100%; background:var(--ink); }.arrow { color:#7084a8; }.demo-note { margin-top:18px; color:#68728a; font-size:11px; }.detail-head { align-items:flex-start; }.detail-head h1 { font-size:46px; }.subline { margin:9px 0 0; color:var(--muted); font-size:13px; }.back-link { display:block; margin-bottom:31px; color:#5775aa; }.status-pill { margin-top:17px; padding:8px 11px; color:#667823; background:var(--lime); font:10px 'DM Mono'; letter-spacing:.07em; }.muted-status { color:#6a7590; background:#e2e6ee; }.progress-steps { display:grid; grid-template-columns:repeat(4,1fr); margin-bottom:31px; }.progress-steps div { position:relative; display:grid; gap:7px; color:#9ca7b9; }.progress-steps div:not(:last-child)::after { content:''; position:absolute; top:13px; left:27px; right:0; height:1px; background:#d4dce6; }.progress-steps b { z-index:1; display:grid; place-items:center; width:27px; height:27px; border:1px solid #c3cedc; border-radius:50%; background:#f6f8fb; font:11px 'DM Mono'; }.progress-steps span { font-size:10px; }.progress-steps .done,.progress-steps .current { color:var(--ink); }.progress-steps .done b { border-color:var(--ink); color:white; background:var(--ink); }.progress-steps .done::after { background:var(--ink)!important; }.progress-steps .current b { border-color:#7798d2; background:var(--blue); }.audit-grid { display:grid; grid-template-columns:1.35fr .85fr; gap:18px; }.paper-card { padding:25px; border:1px solid var(--line); background:rgba(255,255,255,.76); }.card-heading { display:flex; justify-content:space-between; }.card-heading h2 { margin:0; }.doc-chip,.count-badge { height:max-content; padding:5px 7px; color:#5374b1; background:var(--sky); font:10px 'DM Mono'; }.count-badge { color:#637820; background:#eff5cd; }.extract-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:13px; margin:25px 0 13px; } label { display:block; color:#68728a; font-size:10px; } input,textarea,select { display:block; width:100%; margin-top:6px; padding:9px 0; border:0; border-bottom:1px solid #cbd4e0; color:var(--ink); outline:none; background:transparent; font:500 12px Manrope; } textarea { resize:vertical; min-height:50px; }.wide-field { margin-bottom:18px; }.card-footer { display:flex; justify-content:space-between; align-items:center; padding-top:15px; border-top:1px solid var(--line); }.ok-dot { color:#4e6c1b; font-size:10px; }.ok-dot::before { content:''; display:inline-block; width:7px; height:7px; margin-right:6px; border-radius:50%; background:#9db941; }.check-list { margin:20px 0 19px; }.check-list label { display:grid; grid-template-columns:16px 1fr auto; align-items:center; gap:7px; padding:9px 0; border-bottom:1px solid #e7ebef; color:var(--ink); font-size:11px; }.check-list input { width:auto; margin:0; accent-color:var(--ink); }.check-list small { color:#5a7a22; font-size:10px; }.checklist-card .primary-button { width:100%; }.approved { background:#567b2b; }.legend { color:#708091; font-size:10px; }.legend i { display:inline-block; width:8px; height:8px; border-radius:50%; background:#a6bf51; }.document-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }.document-cards article { display:grid; grid-template-columns:35px 1fr; align-items:center; gap:12px; padding:17px; border:1px solid var(--line); background:#fff; }.document-icon { display:grid; place-items:center; width:35px; height:42px; color:#5777b5; background:#eaf0fc; font:16px 'Playfair Display'; }.document-cards b,.document-cards small { display:block; }.document-cards b { font-size:11px; }.document-cards small { margin-top:3px; color:var(--muted); font-size:9px; }.signed { margin-top:9px; color:#4d751e; font-size:9px; }.icon-button { grid-column:2; justify-self:start; border:0; padding:0; color:#5675a9; background:none; font-size:10px; }.zoning-layout { display:grid; grid-template-columns:1.55fr .6fr; gap:18px; }.plan-card,.zone-panel,.calculator-card { border:1px solid var(--line); background:rgba(255,255,255,.75); }.plan-toolbar { display:flex; justify-content:space-between; padding:14px 17px; border-bottom:1px solid var(--line); color:#6b7d9e; font:9px 'DM Mono'; letter-spacing:.08em; }.plan-toolbar button { width:21px; border:0; color:var(--ink); background:#e7eefb; }.plan-toolbar span { margin:0 5px; }.plan-stage { display:grid; place-items:center; min-height:450px; overflow:hidden; padding:40px; background:radial-gradient(#ccd8ec 1px,transparent 1px); background-size:13px 13px; }.building { position:relative; width:min(94%,580px); height:310px; border:5px solid var(--ink); background:#f7f4ed; transform-origin:center; transition:transform .2s ease; }.plan-label { position:absolute; color:#8a98aa; font:9px 'DM Mono'; letter-spacing:.1em; }.main-label { top:-24px; left:0; }.street { right:12px; bottom:-27px; }.zone { position:absolute; display:grid; place-content:center; border:2px solid rgba(11,42,104,.6); color:#0b2a68; text-align:center; font-size:12px; font-weight:700; transition:all .2s; }.zone small { font-size:9px; font-weight:500; }.zone:hover,.zone.active-zone { z-index:2; outline:3px solid var(--ink); outline-offset:2px; }.zone-sale { left:22px; top:25px; width:47%; height:64%; background:rgba(215,229,141,.67); }.zone-office { right:18px; top:25px; width:25%; height:39%; background:rgba(158,188,244,.65); }.zone-storage { left:22px; bottom:22px; width:60%; height:22%; background:rgba(240,193,126,.67); }.zone-wc { right:18px; bottom:22px; width:17%; height:29%; background:rgba(228,168,174,.68); }.plan-card>p { margin:0; padding:14px 17px; color:#788397; border-top:1px solid var(--line); font-size:10px; }.zone-panel { padding:22px; }.zone-panel h2 { margin-bottom:29px; }.zone-panel label { position:relative; margin-bottom:19px; }.zone-panel label span { position:absolute; right:0; bottom:9px; color:#7a8799; }.zone-summary { display:grid; gap:3px; margin:27px 0 18px; padding:13px; background:#edf2fb; }.zone-summary span { color:#7182a5; font-size:9px; }.zone-summary b { font-size:10px; }.zone-panel .primary-button { width:100%; }.zone-list { margin-top:24px; border-top:1px solid var(--line); }.zone-list button { display:grid; grid-template-columns:22px 1fr auto; width:100%; padding:10px 0; border:0; border-bottom:1px solid var(--line); color:#748098; background:none; text-align:left; font:10px 'DM Mono'; }.zone-list button.selected { color:var(--ink); }.zone-list em { font-style:normal; }.calculator-card { display:grid; grid-template-columns:1fr 1.6fr; gap:36px; margin-top:18px; padding:25px; }.calculator-card h2 { margin:0 0 7px; }.calculator-card p { color:#6d788b; font-size:11px; }.calculator-card form { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; align-items:end; }.calculator-card .primary-button { height:38px; }.calculator-card output { grid-column:1/-1; color:#516b20; font-size:10px; }.mail-tabs { display:flex; flex-wrap:wrap; gap:4px; padding:0 0 13px; border-bottom:1px solid var(--line); }.mail-tabs button { border:0; border-radius:20px; padding:8px 13px; color:#627089; background:transparent; font-size:11px; }.mail-tabs button.active { color:var(--ink); background:#dbe6fa; font-weight:700; }.mail-editor { margin-top:20px; padding:25px; border:1px solid var(--line); background:white; }.mail-meta { display:grid; gap:12px; }.mail-meta label { display:grid; grid-template-columns:58px 1fr; align-items:center; padding-bottom:7px; border-bottom:1px solid var(--line); }.mail-meta input { margin:0; padding:0; border:0; }.mail-editor textarea { min-height:270px; margin-top:25px; padding:17px; border:1px solid #dae1eb; line-height:1.6; }.mail-footer { display:flex; justify-content:space-between; align-items:center; margin-top:17px; }.attachment { padding:6px 8px; color:#5c75a0; background:#ebf1fb; font-size:10px; }.email-flow { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:18px; }.email-flow article { padding:16px; background:#eaf0fa; }.email-flow b,.email-flow span { display:block; }.email-flow b { margin-bottom:5px; font-size:11px; }.email-flow span { color:#718096; font-size:10px; } dialog { width:min(600px,calc(100% - 30px)); padding:34px; border:0; box-shadow:0 20px 70px rgba(9,33,82,.28); color:var(--ink); } dialog::backdrop { background:rgba(12,33,76,.42); backdrop-filter:blur(2px); }.modal-close { position:absolute; top:14px; right:16px; border:0; color:var(--ink); background:none; font-size:18px; }.fake-pdf,.signature-sheet,.mail-preview { display:grid; gap:11px; margin:20px 0; padding:27px; border:1px solid #d4dce8; color:#263c67; background:#fbfaf5; }.fake-pdf b { margin-bottom:13px; }.signature-sheet { min-height:210px; }.signature { align-self:end; width:max-content; margin-left:auto; color:#0b2a68; font:20px 'Playfair Display'; }.signature em { font:9px Manrope; }.mail-preview pre { white-space:pre-wrap; font:12px/1.7 Manrope; }.mail-preview span { color:#6680ad; font-size:10px; }.modal-note { color:#6b7890; font-size:11px; } #toast { position:fixed; right:26px; bottom:24px; max-width:370px; padding:14px 18px; transform:translateY(22px); opacity:0; border-left:4px solid var(--lime); color:white; background:var(--ink); box-shadow:0 10px 30px rgba(11,42,104,.2); font-size:12px; pointer-events:none; transition:all .25s; } #toast.show { transform:none; opacity:1; }
@media (max-width:980px) { .sidebar { width:200px; }.workspace { width:calc(100% - 200px); padding:0 28px 50px; }.document-cards,.metrics,.email-flow { grid-template-columns:1fr; }.dossier-row { grid-template-columns:44px 1fr 100px 80px 15px; gap:8px; }.zoning-layout,.audit-grid { grid-template-columns:1fr; }.calculator-card { grid-template-columns:1fr; }.calculator-card form { grid-template-columns:repeat(2,1fr); } }
@media (max-width:690px) { .shell { display:block; }.sidebar { position:relative; width:auto; height:auto; min-height:0; padding:18px; }.brand img { width:145px; }.environment,.sidebar-footer { display:none; } nav { grid-template-columns:repeat(4,1fr); margin-top:20px; }.nav-item { justify-content:center; padding:9px 3px; font-size:9px; }.nav-item span { display:none; }.workspace { width:100%; padding:0 18px 40px; }.topbar { min-height:70px; }.topbar p { max-width:190px; font-size:9px; }.outline-button { padding:9px 10px; font-size:10px; }.hero-line,.detail-head { padding:35px 0 24px; }.hero-line h1,.detail-head h1 { font-size:37px; }.date-tile { display:none; }.metrics { grid-template-columns:repeat(3,1fr); gap:7px; }.metrics article { min-height:100px; padding:13px; }.metrics strong { font-size:34px; }.metrics small { font-size:9px; }.section-title { align-items:flex-start; gap:15px; margin-top:37px; }.dossier-row { grid-template-columns:36px 1fr 18px; padding:14px 3px; }.dossier-row .step,.dossier-row .progress { display:none; }.progress-steps span { max-width:56px; font-size:8px; }.extract-grid { grid-template-columns:1fr; }.document-cards article { grid-template-columns:35px 1fr auto; }.document-cards .signed { margin:0; }.document-cards .icon-button { grid-column:2; }.plan-stage { min-height:310px; padding:25px 13px; }.building { height:210px; }.zone { font-size:9px; }.zone small { font-size:7px; }.calculator-card form { grid-template-columns:1fr; }.mail-footer { align-items:flex-start; flex-direction:column; gap:12px; }.mail-editor { padding:17px; }.mail-meta label { grid-template-columns:40px 1fr; }.mail-editor textarea { min-height:310px; }.email-flow { grid-template-columns:1fr; } }

.creation-head { padding-bottom:22px; }.creation-progress { margin-bottom:28px; }.creation-layout { display:grid; grid-template-columns:1fr 1.15fr; gap:18px; }.scan-card,.extraction-card,.creation-documents { min-height:100%; }.scan-drop { display:grid; place-items:center; gap:8px; min-height:225px; margin:24px 0 16px; padding:24px; border:1px dashed #9cafcf; background:linear-gradient(145deg,#f4f8ff,#faf9f2); text-align:center; }.scan-drop span,.extract-intro,.creation-documents>p,.workflow-note,.creation-final p,.creation-submit p { color:#6d788b; font-size:11px; line-height:1.6; }.scan-mark { display:grid; place-items:center; width:52px; height:64px; color:#5070aa; border:1px solid #a9bfdf; background:white; font:22px 'Playfair Display'; }.file-picker { width:max-content; margin-top:7px; padding:8px 11px; color:#42649d; border:1px solid #c5d4eb; background:white; font-size:10px; }.file-picker input { display:none; }.scan-actions,.creation-actions,.creation-submit { display:flex; align-items:center; gap:14px; }.scan-status { color:#768397; font-size:10px; }.scan-status.done { color:#4f7022; }.extract-intro { margin:20px 0 10px; }.pending-dot::before { background:#b3bfce; }.creation-documents { margin-top:18px; padding:25px; }.creation-document-list { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin:22px 0; }.creation-document-list span { display:grid; gap:3px; padding:14px; border:1px solid #e0e6ee; background:#fafcff; }.creation-document-list b { font-size:11px; }.creation-document-list small { color:#6d7c93; font-size:9px; }.creation-final { display:flex; align-items:center; justify-content:space-between; gap:25px; margin-top:18px; padding:24px 25px; border:1px solid #bed298; background:#f3f8df; }.creation-final h2 { margin:0 0 7px; }.creation-final p { max-width:680px; margin:0; }.creation-submit { justify-content:space-between; margin-top:20px; padding:17px 0; border-top:1px solid var(--line); }.creation-submit p { max-width:440px; margin:0; text-align:right; }.primary-button:disabled,.outline-button:disabled,.text-button:disabled { cursor:not-allowed; opacity:.42; } input:disabled,textarea:disabled { cursor:not-allowed; color:#8a97a9; }.creation-final[hidden] { display:none; }
@media (max-width:980px) { .creation-layout { grid-template-columns:1fr; }.creation-document-list { grid-template-columns:1fr; } }
@media (max-width:690px) { .creation-actions,.creation-submit,.creation-final { align-items:stretch; flex-direction:column; }.creation-submit p { text-align:left; }.creation-final .primary-button { width:100%; }.scan-actions { align-items:flex-start; flex-direction:column; } }
