@import url("/site/site-depth.css");
:root { --ink:#08131f; --paper:#f6f2e9; --white:#fffdf8; --orange:#f0522b; --mint:#69dfc5; --muted:#5d6871; --line:rgba(8,19,31,.17); }
* { box-sizing:border-box; }
body { margin:0; min-height:100vh; background:var(--paper); color:var(--ink); font:16px/1.55 "DM Sans",system-ui,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
.wrap { width:min(1040px,calc(100% - 48px)); margin:0 auto; }
.draft-bar { padding:8px 20px; background:var(--mint); text-align:center; font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
header { border-bottom:1px solid var(--line); }
.site-header { position:sticky; top:0; z-index:20; background:rgba(246,242,233,.92); backdrop-filter:blur(18px); }
.nav { min-height:76px; display:flex; align-items:center; gap:28px; }
.brand { display:inline-flex; align-items:center; gap:11px; margin-right:auto; }
.brand-mark { width:34px; height:34px; }
.brand-name { font:700 18px/1 "Manrope",sans-serif; letter-spacing:-.5px; }
.brand-name span { color:var(--orange); }
.brand-name small { display:block; margin-top:3px; color:var(--muted); font-size:8px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }
.back { font:800 12px/1 "Manrope",sans-serif; letter-spacing:.08em; text-transform:uppercase; }
.back:hover { color:var(--orange); }
.nav-links { display:flex; align-items:center; gap:25px; font-size:13px; font-weight:700; }
.nav-links a:hover { color:var(--orange); }
.actions { display:flex; align-items:center; gap:10px; }
.actions .button { min-height:46px; margin-top:0; }
.menu-button { display:none; width:44px; height:44px; border:1px solid var(--ink); background:transparent; color:var(--ink); cursor:pointer; }
main { min-height:calc(100vh - 150px); display:grid; place-items:center; padding:68px 0 88px; }
.access-card { border:1px solid var(--line); background:var(--white); }
.access-head { padding:50px 54px 42px; display:grid; grid-template-columns:1fr .8fr; gap:54px; align-items:end; border-bottom:1px solid var(--line); }
.eyebrow { margin:0 0 18px; color:var(--orange); font:800 12px/1 "Manrope",sans-serif; letter-spacing:.13em; text-transform:uppercase; }
h1 { margin:0; font:800 clamp(48px,6vw,76px)/.96 "Manrope",sans-serif; letter-spacing:-.05em; }
.access-head p { margin:0; color:var(--muted); font-size:18px; }
.choice-grid { display:grid; grid-template-columns:1fr 1fr; }
.choice { min-height:260px; padding:42px 54px; display:flex; flex-direction:column; align-items:flex-start; }
.choice + .choice { border-left:1px solid var(--line); }
.choice-label { color:var(--orange); font:800 11px/1 "Manrope",sans-serif; letter-spacing:.12em; text-transform:uppercase; }
h2 { margin:18px 0 12px; font:800 27px/1.1 "Manrope",sans-serif; letter-spacing:-.04em; }
.choice p { max-width:380px; margin:0 0 26px; color:var(--muted); font-size:15px; }
.button { min-height:50px; margin-top:auto; display:inline-flex; align-items:center; justify-content:center; padding:0 22px; border:1px solid var(--ink); background:var(--ink); color:white; font:800 13px/1 "Manrope",sans-serif; }
.button:hover { background:var(--orange); border-color:var(--orange); }
.button.outline { background:transparent; color:var(--ink); }
.button.outline:hover { background:var(--orange); color:white; }
.plan-card { display:grid; grid-template-columns:1fr minmax(360px,.72fr); }
.plan-copy { padding:60px 56px; }
.plan-copy p { max-width:560px; color:var(--muted); font-size:18px; }
.plan { padding:48px 42px; background:var(--ink); color:white; }
.plan .eyebrow { color:var(--mint); }
.price { margin:18px 0 8px; font:800 68px/.9 "Manrope",sans-serif; letter-spacing:-.06em; }
.price span { font-size:17px; letter-spacing:-.02em; }
.plan > p { margin:0 0 26px; color:rgba(255,255,255,.64); }
.plan ul { margin:0 0 32px; padding:0; list-style:none; }
.plan li { position:relative; margin:12px 0; padding-left:24px; font-size:14px; }
.plan li::before { content:"✓"; position:absolute; left:0; color:var(--mint); font-weight:800; }
.plan .button { width:100%; background:var(--mint); border-color:var(--mint); color:var(--ink); }
.fine { margin-top:13px; color:rgba(255,255,255,.44); font-size:11px; text-align:center; }
.product-head { padding:50px 54px 36px; border-bottom:1px solid var(--line); }
.product-head h1 { max-width:12ch; }
.product-head p { max-width:680px; margin:20px 0 0; color:var(--muted); font-size:18px; }
.product-grid { display:grid; grid-template-columns:1.2fr 1fr 1fr; }
.product-card { min-height:340px; padding:34px 30px; display:flex; flex-direction:column; align-items:flex-start; border-right:1px solid var(--line); }
.product-card:last-child { border-right:0; }
.product-card.featured { background:var(--ink); color:white; }
.product-card .choice-label { color:var(--orange); }
.product-card.featured .choice-label { color:var(--mint); }
.product-card h2 { font-size:31px; }
.product-card p { margin:0 0 24px; color:var(--muted); font-size:14px; }
.product-card.featured p { color:rgba(255,255,255,.64); }
.product-card .product-price { margin:0 0 22px; font:800 23px/1 "Manrope",sans-serif; letter-spacing:-.03em; }
.product-card .button { margin-top:auto; }
.product-card.featured .button { background:var(--mint); border-color:var(--mint); color:var(--ink); }
.early-card { display:grid; grid-template-columns:minmax(0,.82fr) minmax(440px,1.18fr); }
.early-summary { padding:56px 52px; background:var(--ink); color:white; }
.early-summary .eyebrow { color:var(--mint); }
.early-summary h1 { max-width:10ch; font-size:clamp(42px,5vw,66px); }
.early-summary > p { max-width:510px; margin:24px 0 34px; color:rgba(255,255,255,.66); font-size:17px; }
.early-price { margin:0 0 8px; font:800 52px/.95 "Manrope",sans-serif; letter-spacing:-.06em; }
.early-price span { font-size:15px; letter-spacing:-.02em; }
.early-plan-note { color:rgba(255,255,255,.55); font-size:13px; }
.early-points { margin:28px 0 0; padding:27px 0 0; border-top:1px solid rgba(255,255,255,.14); list-style:none; }
.early-points li { position:relative; margin:13px 0; padding-left:24px; color:rgba(255,255,255,.78); font-size:14px; }
.early-points li::before { content:"✓"; position:absolute; left:0; color:var(--mint); font-weight:800; }
.early-disclaimer { margin-top:30px; padding:16px 18px; border:1px solid rgba(105,223,197,.26); background:rgba(105,223,197,.08); color:rgba(255,255,255,.7); font-size:12px; }
.early-form-wrap { padding:52px; }
.early-form-wrap h2 { margin:0 0 8px; font-size:31px; }
.form-intro { margin:0 0 30px; color:var(--muted); font-size:14px; }
.early-form { display:grid; gap:18px; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.field { display:grid; gap:7px; }
.field.full { grid-column:1 / -1; }
.field label,.consent-label { font:800 11px/1.25 "Manrope",sans-serif; letter-spacing:.07em; text-transform:uppercase; }
.field input,.field select,.field textarea { width:100%; border:1px solid var(--line); border-radius:0; background:#fffefa; color:var(--ink); padding:13px 14px; font:500 14px/1.4 "DM Sans",sans-serif; }
.field textarea { min-height:92px; resize:vertical; }
.field input:focus,.field select:focus,.field textarea:focus { outline:2px solid rgba(240,82,43,.28); border-color:var(--orange); }
.consent-label { display:grid; grid-template-columns:18px 1fr; gap:10px; align-items:start; color:var(--muted); font-family:"DM Sans",sans-serif; font-weight:600; letter-spacing:0; line-height:1.45; text-transform:none; }
.consent-label input { width:16px; height:16px; margin:2px 0 0; accent-color:var(--orange); }
.early-form .button { width:100%; margin-top:2px; }
.form-fine { margin:0; color:var(--muted); font-size:11px; text-align:center; }
.form-success { display:none; min-height:100%; align-content:center; padding:22px 0; }
.form-success.visible { display:grid; }
.form-success .success-mark { width:54px; height:54px; display:grid; place-items:center; margin-bottom:22px; border-radius:50%; background:var(--mint); color:var(--ink); font:800 23px/1 "Manrope",sans-serif; }
.form-success h2 { max-width:14ch; font-size:38px; }
.form-success p { max-width:520px; color:var(--muted); }
.form-success .button { width:auto; justify-self:start; margin-top:18px; }
.dock-product { overflow:visible; border-top:0; }
.dock-hero { position:relative; isolation:isolate; width:100vw; min-height:600px; margin-left:calc(50% - 50vw); display:grid; grid-template-columns:1.05fr .95fr; overflow:hidden; background:#d9dde0; }
.dock-hero::before { content:""; position:absolute; z-index:-2; inset:0; background:url("/site/assets/docklock-hero.png") center 53% / cover no-repeat; filter:grayscale(1) contrast(.92); transform:scale(1.01); }
.dock-hero::after { content:""; position:absolute; z-index:-1; inset:0; background:linear-gradient(90deg,rgba(255,253,248,.94) 0%,rgba(255,253,248,.9) 48%,rgba(8,19,31,.38) 66%,rgba(8,19,31,.66) 100%); }
.dock-hero-copy { display:flex; flex-direction:column; justify-content:center; padding:72px 56px 72px max(56px,calc((100vw - 1040px)/2 + 56px)); }
.dock-hero-copy h1 { max-width:11ch; }
.dock-hero-copy > p { max-width:610px; margin:24px 0 30px; color:var(--muted); font-size:18px; }
.dock-actions { display:flex; flex-wrap:wrap; gap:12px; }
.dock-actions .button { margin-top:0; }
.dock-visual { position:relative; display:grid; place-items:center; padding:72px max(56px,calc((100vw - 1040px)/2 + 56px)) 72px 56px; overflow:hidden; background:rgba(8,19,31,.36); color:white; }
.dock-visual::before { content:none; }
.dock-calendar { position:relative; z-index:1; width:min(310px,100%); padding:26px; border:1px solid rgba(255,255,255,.24); background:linear-gradient(145deg,#11273a 0%,#091927 100%); box-shadow:0 38px 72px rgba(0,0,0,.46),0 12px 24px rgba(0,0,0,.3),0 0 0 1px rgba(255,255,255,.06); transform:translateY(-3px); }
.dock-calendar::after { content:""; position:absolute; z-index:-1; left:9%; right:9%; bottom:-18px; height:24px; border-radius:50%; background:rgba(0,0,0,.4); filter:blur(15px); }
.dock-calendar-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:18px; font:800 11px/1 "Manrope",sans-serif; letter-spacing:.1em; text-transform:uppercase; }
.dock-calendar-head span:last-child { color:var(--mint); }
.dock-slots { display:grid; gap:8px; }
.dock-slot { display:grid; grid-template-columns:50px 1fr auto; gap:12px; align-items:center; padding:12px; background:rgba(255,255,255,.055); font-size:12px; }
.dock-slot b { color:var(--mint); font:800 9px/1 "Manrope",sans-serif; text-transform:uppercase; }
.dock-slot.alert b { color:#ff9b78; }
.dock-features { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); }
.dock-feature { padding:34px 36px 38px; border-right:1px solid var(--line); }
.dock-feature:last-child { border-right:0; }
.dock-feature span { color:var(--orange); font:800 10px/1 "Manrope",sans-serif; letter-spacing:.12em; }
.dock-feature h2 { margin:14px 0 10px; font-size:24px; }
.dock-feature p { margin:0; color:var(--muted); font-size:14px; }
.access-status { display:inline-flex; align-items:center; gap:9px; margin:2px 0 10px; padding:10px 13px; border:1px solid rgba(105,223,197,.3); background:rgba(105,223,197,.08); color:var(--mint); font:800 11px/1 "Manrope",sans-serif; letter-spacing:.08em; text-transform:uppercase; }
.access-status::before { content:""; width:8px; height:8px; border-radius:50%; background:var(--mint); box-shadow:0 0 10px rgba(105,223,197,.55); }
.dock-main { display:block; min-height:auto; padding:0 0 88px; overflow-x:clip; }
.dock-week { display:grid; grid-template-columns:repeat(5,1fr); margin-bottom:10px; border:1px solid rgba(255,255,255,.1); }
.dock-week div { padding:10px 4px; display:grid; gap:4px; border-right:1px solid rgba(255,255,255,.08); text-align:center; }
.dock-week div:last-child { border-right:0; }
.dock-week b { color:rgba(255,255,255,.45); font:800 8px/1 "Manrope",sans-serif; }
.dock-week span { font:800 14px/1 "Manrope",sans-serif; }
.dock-week .today { background:rgba(240,82,43,.14); color:#ff9b78; }
.dock-proof { position:relative; z-index:3; display:grid; grid-template-columns:repeat(3,1fr); margin-top:-26px; border:1px solid rgba(8,19,31,.1); border-radius:18px; background:rgba(255,253,248,.94); box-shadow:0 28px 60px rgba(8,19,31,.15),0 5px 16px rgba(8,19,31,.08); backdrop-filter:blur(14px); }
.dock-proof div { position:relative; min-height:146px; padding:33px 32px; display:grid; align-content:center; gap:9px; overflow:hidden; border-right:1px solid var(--line); }
.dock-proof div::after { content:none; }
.dock-proof div:last-child { border-right:0; }
.dock-proof strong { font:800 18px/1.15 "Manrope",sans-serif; }
.dock-proof span { color:var(--muted); font-size:13px; }
.dock-perspectives,.dock-process { padding:82px 56px; }
.dock-perspectives { background:radial-gradient(circle at 88% 16%,rgba(105,223,197,.11),transparent 24%),linear-gradient(180deg,#fffdf8 0%,#f7f2e9 100%); }
.dock-section-head { display:grid; grid-template-columns:1fr .82fr; gap:60px; align-items:end; margin-bottom:34px; }
.dock-section-head .eyebrow { margin-bottom:14px; }
.dock-section-head h2 { max-width:13ch; margin:0; font-size:clamp(38px,4vw,56px); }
.dock-section-head > p { margin:0; color:var(--muted); font-size:17px; }
.dock-view-toggle { width:max-content; display:flex; gap:4px; margin-bottom:26px; padding:4px; border:1px solid var(--line); border-radius:999px; background:#f4efe5; }
.dock-view-toggle button { min-width:136px; padding:11px 18px; border:0; border-radius:999px; background:transparent; color:var(--muted); cursor:pointer; font:800 12px/1 "Manrope",sans-serif; }
.dock-view-toggle button.active { background:var(--ink); color:white; box-shadow:0 5px 16px rgba(8,19,31,.16); }
.dock-view-panel { position:relative; display:grid; grid-template-columns:.72fr 1.28fr; gap:42px; align-items:center; padding:46px; overflow:hidden; border:1px solid rgba(8,19,31,.09); border-radius:24px; background:rgba(255,253,248,.88); box-shadow:0 30px 70px rgba(8,19,31,.12),0 5px 18px rgba(8,19,31,.06); }
.dock-view-panel::before { content:""; position:absolute; top:0; left:0; right:0; height:4px; background:linear-gradient(90deg,var(--orange),rgba(240,82,43,.15) 35%,var(--mint)); }
.dock-view-panel[hidden] { display:none; }
.dock-view-copy .view-number { color:var(--orange); font:800 11px/1 "Manrope",sans-serif; letter-spacing:.14em; }
.dock-view-copy h3 { margin:15px 0 14px; font:800 30px/1.08 "Manrope",sans-serif; letter-spacing:-.04em; }
.dock-view-copy > p { margin:0 0 22px; color:var(--muted); }
.dock-view-copy ul { margin:0; padding:0; list-style:none; }
.dock-view-copy li { position:relative; margin:10px 0; padding-left:22px; color:var(--muted); font-size:13px; }
.dock-view-copy li::before { content:"✓"; position:absolute; left:0; color:var(--orange); font-weight:800; }
.dock-app-shell { overflow:hidden; border:1px solid rgba(8,19,31,.14); border-radius:18px; background:white; box-shadow:0 22px 48px rgba(8,19,31,.13); }
.app-shell-top { min-height:76px; padding:17px 20px; display:flex; justify-content:space-between; align-items:center; gap:20px; background:#172131; color:white; }
.app-shell-top div { display:grid; gap:5px; }
.app-shell-top small { color:#ff8b66; font:800 8px/1 "Manrope",sans-serif; letter-spacing:.13em; }
.app-shell-top strong { font:800 17px/1 "Manrope",sans-serif; }
.app-shell-top > span { color:rgba(255,255,255,.68); font-size:11px; }
.app-status-row { display:flex; flex-wrap:wrap; gap:7px; padding:12px 16px; border-bottom:1px solid var(--line); }
.app-status-row i { padding:6px 9px; border-radius:999px; background:#e5f7ed; color:#15754d; font:700 9px/1 "DM Sans",sans-serif; font-style:normal; }
.app-status-row i:nth-child(2) { background:#fff0cc; color:#8b6200; }
.app-status-row i:nth-child(3) { background:#dff4ed; color:#08735a; }
.app-status-row i:nth-child(4) { background:#ffe6d7; color:#9b4c28; }
.mini-calendar { display:grid; grid-template-columns:48px repeat(5,1fr); padding:0 14px 16px; }
.mini-calendar > b { padding:13px 3px 9px; border-bottom:1px solid var(--line); color:var(--ink); font:800 9px/1 "Manrope",sans-serif; text-align:center; }
.mini-calendar .mini-time { padding:14px 7px; color:var(--muted); font-size:9px; text-align:right; }
.mini-calendar em { margin:5px 3px; padding:10px 3px; border:1px solid #9ad8bc; border-radius:7px; background:#dff4e8; color:#25805b; font:800 8px/1 "Manrope",sans-serif; font-style:normal; text-align:center; }
.mini-calendar em.confirmed { border-color:#9ad7cc; background:#d9f0ea; color:#08735a; }
.mini-calendar em.blocked { border-color:#efbba9; background:#f9e0d6; color:#9b4c28; }
.partner-search { display:grid; grid-template-columns:.8fr 1.2fr; gap:8px; padding:14px; border-bottom:1px solid var(--line); background:#f5f6f7; }
.partner-search span { padding:10px 11px; border:1px solid var(--line); background:white; color:var(--muted); font-size:10px; }
.appointment-list { display:grid; padding:7px 14px 16px; }
.appointment-row { display:grid; grid-template-columns:52px 1fr auto; gap:13px; align-items:center; padding:15px 8px; border-bottom:1px solid var(--line); }
.appointment-row:last-child { border-bottom:0; }
.appointment-row time { font:800 13px/1 "Manrope",sans-serif; }
.appointment-row div { display:grid; gap:4px; }
.appointment-row strong { font-size:12px; }
.appointment-row small { color:var(--muted); font-size:10px; }
.appointment-row > b { padding:6px 8px; border-radius:999px; background:#dff4ed; color:#08735a; font-size:8px; text-transform:uppercase; }
.appointment-row > b.review { background:#ffe6d7; color:#9b4c28; }
.appointment-row.open { background:#f5fbf8; }
.dock-permission { position:relative; display:grid; grid-template-columns:1.12fr .88fr; align-items:center; gap:56px; padding:82px 56px; overflow:hidden; background:radial-gradient(circle at 19% 8%,rgba(105,223,197,.14),transparent 28%),radial-gradient(circle at 88% 100%,rgba(240,82,43,.1),transparent 26%),var(--ink); color:white; }
.dock-permission::after { content:""; position:absolute; inset:18px; border:1px solid rgba(255,255,255,.035); pointer-events:none; }
.permission-visual { display:grid; grid-template-columns:1fr 120px 1fr; align-items:center; }
.facility-node,.partner-node { position:relative; min-height:158px; display:grid; place-content:center; gap:8px; padding:24px; border:1px solid rgba(255,255,255,.17); border-radius:22px; background:linear-gradient(145deg,rgba(24,55,76,.98),rgba(10,30,44,.98)); text-align:center; box-shadow:0 24px 48px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.08); }
.facility-node { transform:translateY(-10px); }
.partner-node { transform:translateY(10px); }
.facility-node span,.partner-node span { color:var(--mint); font:800 9px/1 "Manrope",sans-serif; letter-spacing:.12em; text-transform:uppercase; }
.facility-node strong,.partner-node strong { font:800 17px/1.15 "Manrope",sans-serif; }
.permission-path { display:grid; grid-template-columns:1fr; justify-items:center; color:rgba(255,255,255,.55); text-align:center; }
.permission-path i { width:100%; height:1px; background:linear-gradient(90deg,rgba(105,223,197,.15),var(--mint),rgba(105,223,197,.15)); }
.permission-path b { margin:8px 0; color:var(--mint); font:800 8px/1 "Manrope",sans-serif; letter-spacing:.1em; text-transform:uppercase; }
.permission-copy .eyebrow { color:var(--mint); }
.permission-copy h2 { margin:0 0 20px; font-size:38px; }
.permission-copy p { margin:0; color:rgba(255,255,255,.65); font-size:16px; }
.dock-audiences { padding:82px 56px 98px; background:linear-gradient(180deg,#fffdf8 0%,#f8f4ec 100%); }
.dock-audience-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.dock-audience-grid article { position:relative; min-height:300px; padding:34px; display:flex; flex-direction:column; overflow:hidden; border:1px solid rgba(8,19,31,.1); border-radius:18px; background:#fffdf9; box-shadow:0 16px 35px rgba(8,19,31,.07),inset 0 1px 0 rgba(255,255,255,.8); transition:transform .2s ease,box-shadow .2s ease; }
.dock-audience-grid article::before { content:""; position:absolute; top:0; left:0; width:74px; height:4px; background:var(--orange); }
.dock-audience-grid article::after { content:none; }
.dock-audience-grid article:hover { transform:translateY(-4px); box-shadow:0 24px 48px rgba(8,19,31,.11); }
.dock-audience-grid span { color:var(--orange); font:800 10px/1 "Manrope",sans-serif; letter-spacing:.12em; text-transform:uppercase; }
.dock-audience-grid h3 { max-width:16ch; margin:24px 0 14px; font:800 26px/1.08 "Manrope",sans-serif; letter-spacing:-.035em; }
.dock-audience-grid p { margin:0 0 24px; color:var(--muted); font-size:14px; }
.dock-audience-grid b { margin-top:auto; color:var(--ink); font:800 12px/1.4 "Manrope",sans-serif; }
.dock-intelligence { display:grid; grid-template-columns:.8fr 1.2fr; gap:56px; align-items:center; padding:82px 56px; background:radial-gradient(circle at 86% 12%,rgba(105,223,197,.11),transparent 29%),radial-gradient(circle at 6% 92%,rgba(240,82,43,.08),transparent 25%),#0b1b29; color:#fff; }
.dock-intelligence-copy h2 { max-width:12ch; margin:0 0 18px; color:#fff; font-size:40px; }
.dock-intelligence-copy > p { margin:0; color:rgba(255,255,255,.7); }
.future-note { margin-top:28px; padding:17px 18px; display:flex; gap:13px; align-items:flex-start; border-left:3px solid var(--orange); background:rgba(255,255,255,.055); }
.future-note strong { flex:0 0 auto; color:#fff; font:800 10px/1.4 "Manrope",sans-serif; letter-spacing:.09em; text-transform:uppercase; }
.future-note span { color:rgba(255,255,255,.68); font-size:12px; line-height:1.45; }
.kpi-preview { overflow:hidden; border:1px solid rgba(255,255,255,.17); border-radius:15px; background:#fffdf8; color:var(--ink); box-shadow:0 38px 80px rgba(0,0,0,.34),0 8px 24px rgba(0,0,0,.2); }
.kpi-head { display:flex; justify-content:space-between; align-items:center; padding:22px 24px; border-bottom:1px solid var(--line); }
.kpi-head div { display:flex; flex-direction:column; gap:5px; }
.kpi-head small { color:var(--orange); font:800 9px/1 "Manrope",sans-serif; letter-spacing:.13em; }
.kpi-head strong { font:800 17px/1.2 "Manrope",sans-serif; }
.kpi-head > span { padding:6px 9px; border-radius:20px; background:#f3ede3; color:var(--muted); font:800 9px/1 "Manrope",sans-serif; text-transform:uppercase; letter-spacing:.08em; }
.kpi-summary { display:grid; grid-template-columns:repeat(3,1fr); border-bottom:1px solid var(--line); }
.kpi-summary div { padding:20px 22px; border-right:1px solid var(--line); }
.kpi-summary div:last-child { border-right:0; }
.kpi-summary b { display:block; margin-bottom:5px; font:800 25px/1 "Manrope",sans-serif; }
.kpi-summary span { color:var(--muted); font-size:10px; }
.kpi-partners { padding:8px 22px; }
.kpi-partners > div { display:flex; justify-content:space-between; gap:18px; padding:13px 0; border-bottom:1px solid var(--line); font-size:11px; }
.kpi-partners > div:last-child { border-bottom:0; }
.kpi-partners span { display:flex; align-items:center; gap:8px; font-weight:700; }
.kpi-partners i { width:8px; height:8px; border-radius:50%; background:#6b7280; }
.kpi-partners i.good { background:#2f8c5b; }.kpi-partners i.watch { background:#d99a27; }.kpi-partners i.alert { background:#d5533b; }
.kpi-partners b { color:var(--muted); font-size:10px; }
.kpi-signals { display:flex; flex-wrap:wrap; gap:7px; padding:17px 22px 20px; background:#f5f0e8; }
.kpi-signals span { padding:7px 9px; border:1px solid rgba(8,19,31,.11); border-radius:2px; background:#fff; color:var(--muted); font:700 9px/1 "Manrope",sans-serif; }
.dock-record { display:grid; grid-template-columns:.72fr 1.28fr; gap:52px; align-items:center; padding:82px 56px; background:radial-gradient(circle at 78% 26%,rgba(240,82,43,.09),transparent 26%),linear-gradient(135deg,#f2ede3,#e9e2d6); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.dock-record-copy h2 { margin:0 0 18px; font-size:40px; }
.dock-record-copy > p { margin:0; color:var(--muted); }
.direction-note { margin-top:24px; padding:16px 18px; border-left:3px solid var(--orange); background:rgba(255,255,255,.55); }
.direction-note strong { display:block; margin-bottom:5px; font:800 11px/1 "Manrope",sans-serif; letter-spacing:.08em; text-transform:uppercase; }
.direction-note span { color:var(--muted); font-size:12px; }
.dock-record-flow { display:grid; grid-template-columns:repeat(5,1fr); gap:9px; align-items:stretch; }
.dock-record-flow div { position:relative; min-height:196px; padding:23px 17px; display:flex; flex-direction:column; border:1px solid rgba(8,19,31,.1); border-radius:14px; background:rgba(255,253,248,.92); box-shadow:0 14px 30px rgba(8,19,31,.09),inset 0 1px 0 rgba(255,255,255,.9); }
.dock-record-flow div:nth-child(even) { transform:translateY(10px); }
.dock-record-flow div:not(:last-child)::after { content:"→"; position:absolute; z-index:2; right:-15px; top:50%; width:20px; height:20px; display:grid; place-items:center; border-radius:50%; background:var(--ink); color:white; transform:translateY(-50%); font:800 10px/1 "Manrope",sans-serif; box-shadow:0 4px 10px rgba(8,19,31,.22); }
.dock-record-flow i { color:var(--orange); font:800 9px/1 "Manrope",sans-serif; font-style:normal; letter-spacing:.1em; }
.dock-record-flow strong { margin:46px 0 10px; font:800 16px/1 "Manrope",sans-serif; }
.dock-record-flow span { color:var(--muted); font-size:11px; }
.dock-process { background:#fbf8f2; }
.dock-process-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.dock-process-grid article { position:relative; min-height:242px; padding:30px 25px; overflow:hidden; border:1px solid rgba(8,19,31,.09); border-radius:17px; background:rgba(255,255,255,.82); box-shadow:0 16px 34px rgba(8,19,31,.075); }
.dock-process-grid article::after { content:none; }
.dock-process-grid article:nth-child(even) { transform:translateY(14px); }
.dock-process-grid span { width:34px; height:34px; display:grid; place-items:center; border-radius:50%; background:#f4e8dd; color:var(--orange); font:800 10px/1 "Manrope",sans-serif; letter-spacing:.06em; }
.dock-process-grid h3 { margin:44px 0 11px; font:800 21px/1 "Manrope",sans-serif; }
.dock-process-grid p { margin:0; color:var(--muted); font-size:13px; }
.dock-next { position:relative; display:grid; grid-template-columns:1fr auto; gap:50px; align-items:center; margin:28px 56px 0; padding:56px 48px; overflow:hidden; border:1px solid rgba(255,255,255,.1); border-radius:22px; background:radial-gradient(circle at 90% 18%,rgba(105,223,197,.18),transparent 26%),linear-gradient(135deg,#0a1a28,#102d40); color:white; box-shadow:0 26px 58px rgba(8,19,31,.2); }
.dock-next::after { content:none; }
.dock-next h2 { max-width:15ch; margin:0 0 17px; font-size:40px; }
.dock-next p { max-width:690px; margin:0; color:rgba(255,255,255,.66); }
.dock-next .button { margin-top:0; }
.dock-next .button { position:relative; z-index:1; border-color:var(--mint); background:var(--mint); color:var(--ink); box-shadow:0 14px 30px rgba(0,0,0,.18); }
.spec { padding:50px 54px; }
.spec h1 { max-width:13ch; }
.spec-intro { max-width:720px; margin:22px 0 42px; color:var(--muted); font-size:18px; }
.spec-flow { display:grid; grid-template-columns:repeat(5,1fr); margin:0 0 42px; border:1px solid var(--line); }
.spec-step { min-height:140px; padding:24px 20px; border-right:1px solid var(--line); }
.spec-step:last-child { border-right:0; }
.spec-step span { color:var(--orange); font:800 11px/1 "Manrope",sans-serif; letter-spacing:.12em; }
.spec-step strong { display:block; margin-top:16px; font:800 17px/1.2 "Manrope",sans-serif; }
.spec-grid { display:grid; grid-template-columns:1fr 1fr; gap:42px; }
.spec-grid h2 { margin-bottom:18px; font-size:24px; }
.spec-grid ul { margin:0; padding-left:20px; }
.spec-grid li { margin:10px 0; color:var(--muted); }
.spec a { color:var(--orange); font-weight:800; }
.dev-link { font-weight:800; color:var(--orange); }
footer { padding:28px 0; border-top:1px solid var(--line); color:var(--muted); font-size:12px; }
@media(max-width:960px){ .nav-links { display:none; position:absolute; top:76px; left:0; right:0; padding:22px 24px; background:var(--paper); border-bottom:1px solid var(--line); flex-direction:column; align-items:flex-start; } .nav-links.open { display:flex; } .menu-button { display:grid; place-items:center; } .actions .outline { display:none; } }
@media(max-width:860px){ .product-grid,.spec-flow,.early-card,.dock-hero,.dock-view-panel,.dock-permission,.dock-record,.dock-intelligence { grid-template-columns:1fr; } .product-card,.spec-step { min-height:auto; border-right:0; border-bottom:1px solid var(--line); } .dock-features { grid-template-columns:1fr; } .dock-feature { border-right:0; border-bottom:1px solid var(--line); } .dock-feature:last-child { border-bottom:0; } .dock-process-grid { grid-template-columns:1fr 1fr; } .dock-process-grid article:nth-child(2) { border-right:0; } .dock-process-grid article:nth-child(-n+2) { border-bottom:1px solid var(--line); } }
@media(max-width:760px){ .access-head,.plan-card,.spec-grid,.dock-section-head,.dock-next { grid-template-columns:1fr; } .choice-grid,.form-grid,.dock-proof,.dock-audience-grid,.dock-process-grid { grid-template-columns:1fr; } .field.full { grid-column:auto; } .choice + .choice { border-left:0; border-top:1px solid var(--line); } .access-head,.choice,.plan-copy,.plan,.product-head,.spec,.early-summary,.early-form-wrap,.dock-hero-copy,.dock-visual,.dock-perspectives,.dock-process,.dock-permission,.dock-next,.dock-audiences,.dock-record,.dock-intelligence { padding:38px 30px; } .dock-proof { margin-top:-18px; } .dock-proof div { border-right:0; border-bottom:1px solid var(--line); } .dock-proof div:last-child { border-bottom:0; } .dock-audience-grid article { border:1px solid rgba(8,19,31,.1); } .dock-view-panel { padding:28px 24px; border-radius:18px; } .dock-record-flow,.kpi-summary { grid-template-columns:1fr; } .dock-record-flow div { min-height:auto; border-right:1px solid rgba(8,19,31,.13); border-bottom:0; transform:none; } .dock-record-flow div:last-child { border-bottom:1px solid rgba(8,19,31,.13); } .dock-record-flow div:not(:last-child)::after { content:"↓"; right:50%; top:auto; bottom:-15px; transform:translateX(50%); } .dock-record-flow strong { margin-top:24px; } .dock-process-grid article,.dock-process-grid article:nth-child(even),.facility-node,.partner-node { transform:none; } .dock-next { margin:20px 0 0; } .kpi-summary div { border-right:0; border-bottom:1px solid var(--line); } .kpi-summary div:last-child { border-bottom:0; } .kpi-partners > div { align-items:flex-start; flex-direction:column; gap:5px; } }
@media(max-width:680px){ .nav { min-height:68px; } .nav-links { top:68px; } .actions .button { display:none; } }
@media(max-width:520px){ .wrap { width:min(100% - 30px,1040px); } h1 { font-size:46px; } .permission-visual { grid-template-columns:1fr; gap:12px; } .permission-path i { width:1px; height:24px; } .permission-path b { margin:6px 0; } }

/* Warden 9/22: the bar spans the window, so the name stays at the top left and the buttons
   at the top right instead of drifting toward the middle on a wide screen. Same gutters as the
   homepage hero: 24px, growing to 120 and stopping. Nothing changes below 1229px. The eight
   pages that share this stylesheet keep their CSS here rather than inline. */
@media (min-width: 1229px) {
  header .wrap.nav { width: auto; max-width: none; margin: 0;
    padding-left: clamp(24px, calc(24px + (100vw - 1228px) * .22), 120px);
    padding-right: clamp(24px, calc(24px + (100vw - 1228px) * .22), 120px); }
}
