/* deedplatform design system — navy + gold.
   Tokens are overridable per tenant (head.ejs sets --brand / --accent). Every class name from v0.1 is kept. */

@font-face{font-family:"Fraunces";font-style:normal;font-weight:100 900;font-display:swap;src:url(/fonts/fraunces-latin-opsz-normal.woff2) format("woff2-variations")}
@font-face{font-family:"Fraunces";font-style:italic;font-weight:100 900;font-display:swap;src:url(/fonts/fraunces-latin-opsz-italic.woff2) format("woff2-variations")}
@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;src:url(/fonts/inter-latin-wght-normal.woff2) format("woff2-variations")}

:root{
  --brand:#1b2733;--accent:#9a7b3c;
  --ink:#1c1c1a;--ink-2:#4a4a46;--muted:#7a7a74;--line:#e6e2da;--line-2:#d6d0c4;
  --cream:#faf8f4;--cream-2:#f3efe7;--paper:#fff;
  --brass-600:#8a6d32;--brass-500:#9a7b3c;--brass-200:#e3d5b5;--brass-100:#f1eadb;
  --navy-900:#101820;--navy-800:#1b2733;--navy-700:#1b2733;--navy-100:#e6e9ec;--navy-50:#f5f6f7;
  --gold-600:#8a6d32;--gold-500:#9a7b3c;--gold-200:#e3d5b5;--gold-100:#f1eadb;
  --teal-950:#101820;--teal-900:#1b2733;--teal-800:#1b2733;--teal-700:#1b2733;--teal-600:#4a4a46;--teal-500:#9a7b3c;--teal-100:#d6d0c4;--teal-50:#f3efe7;
  --coral-600:#8a6d32;--coral-500:#9a7b3c;--coral-100:#f1eadb;
  --bg:#faf8f4;--card:#fff;--ok:#2f6b3a;--warn:#9a5a12;--bad:#9b2c2c;
  --serif:"Fraunces",Georgia,"Times New Roman",serif;
  --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --r:6px;--r-sm:3px;--r-lg:10px;
  --shadow-sm:none;
  --shadow:0 1px 2px rgba(28,28,26,.04),0 12px 32px -16px rgba(28,28,26,.18);
  --shadow-lg:0 2px 4px rgba(28,28,26,.05),0 30px 70px -24px rgba(28,28,26,.35);
  --ease:cubic-bezier(.2,.7,.2,1);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font:15.5px/1.65 var(--sans);color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;font-feature-settings:"cv11","ss01"}
a{color:var(--brand);text-decoration-thickness:1px;text-underline-offset:2px}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.15;margin:0 0 .45em;letter-spacing:-.01em;color:var(--ink);font-variation-settings:"opsz" 72,"SOFT" 0,"WONK" 0}
h1{font-size:34px}h2{font-size:24px}h3{font-size:19px;font-variation-settings:"opsz" 24,"SOFT" 0}
p{margin:0 0 1em}
b,strong{font-weight:600}
img{max-width:100%}
code{background:var(--navy-50);border:1px solid var(--line);padding:1px 6px;border-radius:5px;font-size:13px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}

/* ---- header ------------------------------------------------------------ */
.top{position:sticky;top:0;z-index:40;background:var(--brand);color:#fff;padding:0 28px;display:flex;align-items:center;gap:22px;height:64px;box-shadow:0 1px 0 rgba(255,255,255,.08),0 6px 20px -10px rgba(11,26,46,.5)}
.top a{color:#fff;text-decoration:none;opacity:.85;font-weight:500;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;transition:opacity .15s;white-space:nowrap}.top a:hover{opacity:1}
.top .logo{font-family:var(--serif);font-weight:400;font-size:22px;display:flex;align-items:center;gap:12px;opacity:1;letter-spacing:0;text-transform:none;font-variation-settings:"opsz" 24,"SOFT" 0}
.top img{height:34px;max-width:150px;object-fit:contain;background:#fff;border-radius:6px;padding:3px}
.top .sp{flex:1}
.top .pill{background:transparent;border:1px solid rgba(255,255,255,.3);padding:3px 11px;border-radius:99px;font-size:10.5px;font-family:var(--sans);font-weight:500;letter-spacing:.12em;text-transform:uppercase}
.top .btn.ghost{border-color:rgba(255,255,255,.55)!important;color:#fff!important}.top .btn.ghost:hover{background:rgba(255,255,255,.1)}
.top form{display:inline}

/* ---- layout ------------------------------------------------------------ */
.wrap{max-width:1120px;margin:0 auto;padding:36px 28px}.narrow{max-width:660px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:28px;margin-bottom:22px}
.card>h1:first-child,.card>h2:first-child{margin-top:-2px}
.grid{display:grid;gap:18px}.g2{grid-template-columns:1fr 1fr}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
@media(max-width:820px){.g2,.g3,.g4{grid-template-columns:1fr}.wrap{padding:24px 18px}.top{padding:0 18px;gap:14px}.top .pill{display:none}h1{font-size:28px}}
.stat{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:20px 22px;position:relative;overflow:hidden}
.stat:before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--accent)}
.stat b{display:block;font-family:var(--serif);font-weight:400;font-size:30px;line-height:1.1;letter-spacing:-.02em;font-variation-settings:"opsz" 48}
.stat span{color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.08em;font-weight:600}

/* ---- forms ------------------------------------------------------------- */
label{display:block;font-size:13px;font-weight:600;margin:14px 0 6px;color:var(--ink-2)}
input,select,textarea{width:100%;padding:10px 13px;border:1px solid var(--line-2);border-radius:var(--r-sm);font:inherit;background:#fff;color:var(--ink);transition:border-color .15s,box-shadow .15s}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px color-mix(in srgb,var(--brand) 18%,transparent)}
textarea{min-height:88px}
input[type=checkbox],input[type=radio]{width:auto;margin-right:8px;accent-color:var(--brand)}
input[type=color]{padding:3px}
/* A native file input will not shrink below the intrinsic width of its button plus "No file chosen", so
   equal grid columns clipped the label. Let the field take the slack and wrap onto its own line when tight,
   and shrink the browser's button to leave room for the filename. */
input[type=file]{padding:6px 10px}
input[type=file]::file-selector-button{margin:0 10px 0 0;padding:6px 12px;border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--bg);color:var(--ink);font:inherit;font-size:.92em;cursor:pointer}
input[type=file]::file-selector-button:hover{border-color:var(--brand);color:var(--brand)}
.upload-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.upload-row>select{flex:0 1 auto;width:auto;min-width:150px}
.upload-row>input[type=file]{flex:1 1 240px;min-width:0}
.upload-row>.btn{flex:0 0 auto}
/* A document upload is a full-page form POST that can carry 25MB, and until it comes back the page looks
   exactly as it did before the click. This says it is working. The bar is indeterminate on purpose: a native
   submit reports no progress, and a bar that pretends to know a percentage would be lying. */
.upload-row.busy>select,.upload-row.busy>input[type=file]{opacity:.55;pointer-events:none}
.upload-status[hidden]{display:none}
.upload-status{display:flex;align-items:center;gap:10px;margin:10px 0 0}
.upload-bar{flex:0 0 150px;height:6px;border-radius:999px;background:var(--line);overflow:hidden;position:relative}
.upload-bar:after{content:"";position:absolute;top:0;bottom:0;width:40%;border-radius:999px;background:var(--brand);animation:upload-slide 1.15s ease-in-out infinite}
@keyframes upload-slide{from{transform:translateX(-110%)}to{transform:translateX(260%)}}
@media(prefers-reduced-motion:reduce){.upload-bar:after{animation:none;width:100%;opacity:.45}}
.inline label{display:inline-flex;align-items:center;font-weight:500;margin-right:18px;margin-top:8px}
details summary{cursor:pointer;color:var(--brand)}
/* Advanced sections: a button-shaped summary that hides developer settings until asked for. */
details.adv{margin-bottom:22px}
details.adv>summary{display:inline-flex;align-items:center;gap:10px;padding:10px 16px;border:1px solid var(--line);border-radius:var(--r);background:var(--card);color:var(--ink);font-weight:500;list-style:none}
details.adv>summary::-webkit-details-marker{display:none}
details.adv>summary:after{content:"+";color:var(--brand);font-size:17px;line-height:1;transition:transform .2s}
details.adv[open]>summary{margin-bottom:18px}
details.adv[open]>summary:after{transform:rotate(45deg)}

/* ---- buttons ----------------------------------------------------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--brand);color:#fff;border:1px solid var(--brand);border-radius:3px;padding:12px 22px;font:inherit;font-weight:500;font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;line-height:1.3;cursor:pointer;text-decoration:none;transition:background .15s,color .15s,border-color .15s,opacity .15s}
.btn:hover{opacity:.88}
.btn.accent{background:var(--accent);color:#fff;border-color:var(--accent)}.btn.accent:hover{background:var(--brass-600);opacity:1}
.btn.ghost{background:transparent;color:var(--brand);border-color:color-mix(in srgb,var(--brand) 40%,transparent)}.btn.ghost:hover{border-color:var(--brand);opacity:1}
.btn.sm{padding:8px 14px;font-size:11px}
.btn.lg{padding:16px 30px;font-size:13px;border-radius:3px}

/* ---- tables ------------------------------------------------------------ */
table{width:100%;border-collapse:collapse;font-size:14px}
th,td{text-align:left;padding:12px 10px;border-bottom:1px solid var(--line);vertical-align:top}
th{color:var(--muted);font-weight:600;font-size:11.5px;text-transform:uppercase;letter-spacing:.06em;border-bottom-color:var(--line-2)}
tr:last-child td{border-bottom:0}
tbody tr:hover td,table tr:hover td{background:var(--navy-50)}
tr:first-child:hover th{background:transparent}

/* A table with an action in its last column: the button takes the width it needs and the names keep theirs,
   rather than every column sharing the width equally and wrapping "Adam Shen (you)" over three lines. */
.table-actions td:last-child,.table-actions th:last-child{width:1px;white-space:nowrap;text-align:right;padding-right:0}
.table-actions td:first-child,.table-actions th:first-child{white-space:nowrap}
.table-actions td:nth-child(2),.table-actions th:nth-child(2){width:1px;white-space:nowrap}
.table-actions td:first-child .small{overflow-wrap:anywhere;margin-top:2px}
.table-actions form{margin:0}

/* ---- badges / alerts --------------------------------------------------- */
.badge{display:inline-block;font-family:var(--sans);vertical-align:middle;padding:3px 10px;border-radius:99px;font-size:12px;font-weight:600;background:#e9ecf1;color:var(--ink-2);white-space:nowrap}
.badge.recorded,.badge.delivered,.badge.active{background:#dcfce7;color:var(--ok)}
.badge.submitted,.badge.in_review,.badge.drafting,.badge.recording,.badge.at_county,.badge.awaiting_signature,.badge.ready_to_sign,.badge.signed_received{background:#dbeafe;color:#1d4ed8}
.badge.pending_payment,.badge.draft,.badge.awaiting_details,.badge.needs_pricing,.badge.pending_review{background:var(--gold-100);color:#8a5a12}
.badge.rejected,.badge.cancelled,.badge.suspended{background:#fee2e2;color:var(--bad)}
.err{background:#fef2f2;color:#7f1d1d;border:1px solid #fecaca;border-radius:var(--r-sm);padding:11px 15px;margin:12px 0}
.ok{background:#f0fdf4;color:#14532d;border:1px solid #bbf7d0;border-radius:var(--r-sm);padding:11px 15px;margin:12px 0}
.muted{color:var(--muted)}.small{font-size:13px}

/* ---- wizard / order widgets ------------------------------------------- */
.steps{display:flex;gap:6px;margin:0 0 22px;padding:0;list-style:none;font-size:13px;counter-reset:s}
.steps li{flex:1;padding:9px 12px;border-radius:var(--r-sm);background:#eaeef4;color:var(--muted);font-weight:500}
.steps li.on{background:var(--brand);color:#fff}
.price{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px dashed var(--line-2)}
.price.total{font-weight:600;font-size:19px;border:0;padding-top:14px;font-family:var(--serif)}
.timeline{list-style:none;padding:0;margin:0}
.timeline li{padding:8px 0 8px 22px;border-left:2px solid var(--line-2);position:relative;font-size:14px}
.timeline li:before{content:"";position:absolute;left:-6px;top:15px;width:10px;height:10px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px #fff}
.ladder{display:flex;gap:4px;margin:16px 0 22px;padding:0;list-style:none;flex-wrap:wrap}
.ladder li{flex:1;min-width:92px;font-size:11px;padding:7px 6px;border-radius:6px;background:#eaeef4;color:var(--muted);text-align:center;font-weight:500}
.ladder li.done{background:#d7ead9;color:#14532d}
.ladder li.on{background:var(--brand);color:#fff;font-weight:600;box-shadow:var(--shadow)}
.check{display:flex;gap:12px;padding:10px 0;border-bottom:1px dashed var(--line-2);font-size:14px}
.check .lvl{flex:0 0 66px;font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;padding:3px 6px;border-radius:5px;text-align:center;height:fit-content}
.lvl.info{background:#dbeafe;color:#1d4ed8}.lvl.action{background:var(--gold-100);color:#92400e}.lvl.block{background:#fee2e2;color:#991b1b}
.party{border:1px solid var(--line);border-radius:10px;padding:14px 16px;margin:10px 0;background:#fafbfd}
.hidden{display:none}

/* ---- hero (tenant landing + marketing) --------------------------------- */
.hero{position:relative;overflow:hidden;padding:130px 28px 120px;text-align:center;color:#fff;background:var(--navy-900) url(/img/hero.jpg) center/cover no-repeat}
.hero:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(16,24,32,.7),rgba(16,24,32,.45))}
.hero>*{position:relative}
.hero h1{font-size:clamp(36px,5vw,58px);color:#fff;max-width:820px;margin:0 auto .45em;font-weight:300;letter-spacing:-.01em;line-height:1.1;font-variation-settings:"opsz" 144,"SOFT" 0}
.hero h1 em{font-style:italic;font-weight:300;color:#fff}
.hero p{font-size:18px;opacity:.92;max-width:640px;margin:0 auto 34px;line-height:1.55}
.hero .btn{box-shadow:0 8px 24px -8px rgba(0,0,0,.5)}
.hero .btn.ghost{color:#fff;border-color:rgba(255,255,255,.6)}
.hero .eyebrow{display:inline-block;font-size:11.5px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--brass-200);margin-bottom:22px}

/* ---- footer ------------------------------------------------------------ */
footer{padding:36px 28px;color:var(--muted);font-size:13px;text-align:center;border-top:1px solid var(--line);margin-top:24px}
footer a{color:var(--muted)}

/* ---- marketing site (deedplatform.com) — editorial ----------------------- */
.mk{background:var(--cream);color:var(--ink)}
.mk .top{position:sticky;top:0;background:rgba(250,248,244,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:var(--ink);box-shadow:none;border-bottom:1px solid var(--line);height:76px;padding:0 48px}
.mk .top a{color:var(--ink);opacity:.75;font-size:11.5px;letter-spacing:.14em;font-weight:500}
.mk .top a:hover{opacity:1}
.mk .top .logo{font-size:22px;opacity:1;color:var(--ink);font-weight:400}
.mk .top .logo .pill{display:none}
.mk .top nav{display:flex;gap:34px;align-items:center;margin-right:auto;margin-left:56px}
.mk .top .btn{background:var(--ink);border-color:var(--ink);color:#fff!important;opacity:1;padding:10px 18px;font-size:11px}
.mk .top .btn:hover{opacity:.85}
.mk .in{max-width:1180px;margin:0 auto}
.mk .eyebrow,.mk .kicker{display:block;font-size:11.5px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--brass-500);margin-bottom:22px}
.mk h1,.mk h2{font-weight:300;letter-spacing:-.015em;line-height:1.08;font-variation-settings:"opsz" 144,"SOFT" 0,"WONK" 0}
.mk h2{font-size:clamp(34px,4.2vw,54px);margin:0 0 .5em;max-width:16ch}
.mk h2 em,.mk h1 em{font-style:italic;font-weight:300}
.mk .lead{font-size:18px;line-height:1.6;color:var(--ink-2);max-width:56ch;margin:0 0 40px}
.mk section.sec{padding:140px 48px}
.mk .rule{border:0;border-top:1px solid var(--line-2);margin:0}
/* hero: split, text on cream, photo on the right */
.mk .hero{padding:0;background:var(--cream);color:var(--ink);text-align:left;min-height:calc(100vh - 76px)}
.mk .hero:before{display:none}
.mk .hero .in{max-width:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:calc(100vh - 76px)}
.mk .hero .copy{padding:120px 64px 96px 48px;display:flex;flex-direction:column;justify-content:center;max-width:720px;margin-left:auto;width:100%}
.mk .hero h1{font-size:clamp(42px,4.6vw,66px);color:var(--ink);margin:0 0 .5em;text-align:left;max-width:none;font-weight:300}
.mk .hero p{font-size:18px;color:var(--ink-2);max-width:52ch;margin:0 0 40px;text-align:left;opacity:1}
.mk .hero .cta{display:flex;gap:28px;align-items:center;flex-wrap:wrap}
.mk .hero .cta .link{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--brass-500);padding-bottom:4px}
.mk .hero .cta .link:hover{border-color:var(--ink)}
.mk .hero .eyebrow{color:var(--brass-500)}
.mk .hero h1 em{color:var(--brass-600)}
.mk .hero .photo{position:relative;margin:0;min-height:520px;background:var(--navy-900) url(/img/hero.jpg) center/cover no-repeat}
.mk .hero .photo figcaption{position:absolute;left:28px;bottom:24px;color:rgba(255,255,255,.75);font-size:11px;letter-spacing:.16em;text-transform:uppercase}
/* trust line */
.mk .trust{padding:34px 48px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--cream)}
.mk .trust .in{display:flex;gap:48px;justify-content:space-between;align-items:center;flex-wrap:wrap}
.mk .trust span{font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);font-weight:500}
.mk .trust b{font-family:var(--serif);font-weight:400;font-size:22px;color:var(--ink);margin-right:10px;letter-spacing:0;font-variation-settings:"opsz" 36}
/* numbered columns */
.mk .head{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:end;margin-bottom:72px}
.mk .head .lead{margin:0 0 8px}
.mk .cols{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line-2)}
.mk .cols>div{padding:44px 40px 44px 0;border-right:1px solid var(--line);margin-right:40px}
.mk .cols>div:last-child{border-right:0;margin-right:0}
.mk .cols .n{font-family:var(--serif);font-size:14px;color:var(--brass-500);margin-bottom:34px;letter-spacing:.06em;font-variation-settings:"opsz" 24}
.mk .cols h3{font-size:28px;font-weight:300;margin-bottom:.55em;line-height:1.15;font-variation-settings:"opsz" 72,"SOFT" 0}
.mk .cols p{margin:0;color:var(--ink-2);font-size:16px;line-height:1.65}
/* photo band with statement */
.mk .band{background:var(--navy-900);color:#fff;padding:0}
.mk .band .in{max-width:none;display:grid;grid-template-columns:1.1fr .9fr}
.mk .band .photo{min-height:560px;background:var(--navy-800) url(/img/interior.jpg) center/cover no-repeat}
.mk .band .text{padding:110px 72px;display:flex;flex-direction:column;justify-content:center;max-width:640px}
.mk .band .eyebrow{color:var(--brass-200)}
.mk .band h2{color:#fff;font-size:clamp(30px,3.4vw,44px);max-width:none}
.mk .band p{color:rgba(255,255,255,.78);font-size:17px;line-height:1.65;max-width:48ch}
.mk .band .btn{align-self:flex-start;margin-top:12px;background:transparent;border-color:rgba(255,255,255,.5);color:#fff}
.mk .band .btn:hover{border-color:#fff;opacity:1}
/* how it works: editorial steps + one screenshot */
.mk .steps-ed{display:grid;grid-template-columns:.9fr 1.1fr;gap:80px;align-items:center}
.mk .steps-ed ol{list-style:none;margin:0;padding:0;counter-reset:st}
.mk .steps-ed li{display:grid;grid-template-columns:64px 1fr;gap:18px;padding:30px 0;border-top:1px solid var(--line-2)}
.mk .steps-ed li:last-child{border-bottom:1px solid var(--line-2)}
.mk .steps-ed li .n{font-family:var(--serif);font-size:14px;color:var(--brass-500);padding-top:6px;letter-spacing:.06em}
.mk .steps-ed li h3{font-size:24px;font-weight:300;margin-bottom:.35em;font-variation-settings:"opsz" 48,"SOFT" 0}
.mk .steps-ed li p{margin:0;color:var(--ink-2);font-size:15.5px}
.mk .frame{background:#fff;border:1px solid var(--line-2);border-radius:6px;overflow:hidden;box-shadow:var(--shadow-lg)}
.mk .frame img{display:block;width:100%;height:auto}
.mk .frame .cap{font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:12px 16px;border-top:1px solid var(--line)}
/* feature list: two columns of hairline rows */
.mk .list{display:grid;grid-template-columns:1fr 1fr;gap:0 80px;border-top:1px solid var(--line-2)}
.mk .list>div{padding:30px 0;border-bottom:1px solid var(--line)}
.mk .list h3{font-size:21px;font-weight:400;margin-bottom:.3em;font-variation-settings:"opsz" 36,"SOFT" 0}
.mk .list p{margin:0;color:var(--ink-2);font-size:15.5px}
/* data protection: statement + list, on paper */
.mk .paper{background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.mk .split{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}
.mk .split ul{list-style:none;padding:0;margin:0}
.mk .split li{padding:18px 0 18px 0;border-bottom:1px solid var(--line);font-size:16px;color:var(--ink-2);display:grid;grid-template-columns:28px 1fr;gap:10px}
.mk .split li:before{content:"—";color:var(--brass-500)}
.mk .split .shot{border:1px solid var(--line-2);border-radius:6px;overflow:hidden;box-shadow:var(--shadow-lg);background:#fff}
.mk .split .shot img{display:block;width:100%;height:auto}
/* faq */
.mk .faq{max-width:860px}
.mk .faq details{border-top:1px solid var(--line-2)}
.mk .faq details:last-child{border-bottom:1px solid var(--line-2)}
.mk .faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:24px 0;font-family:var(--serif);font-weight:400;font-size:22px;color:var(--ink);font-variation-settings:"opsz" 36,"SOFT" 0}
.mk .faq summary::-webkit-details-marker{display:none}
.mk .faq summary:after{content:"+";flex:0 0 auto;color:var(--brass-500);font-family:var(--serif);font-size:26px;line-height:1;transition:transform .2s}
.mk .faq details[open] summary:after{transform:rotate(45deg)}
.mk .faq p{color:var(--ink-2);font-size:16px;margin:0 0 26px;max-width:70ch}
/* closing */
.mk .close{background:var(--cream);text-align:center;padding:150px 48px}
.mk .close h2{margin:0 auto .5em;max-width:20ch}
.mk .close p{color:var(--ink-2);max-width:48ch;margin:0 auto 40px;font-size:17px}
.mk .close .btn{margin:0 6px}
/* footer */
.mk footer{background:var(--navy-900);color:rgba(255,255,255,.6);text-align:left;padding:64px 48px 48px;margin-top:0;border-top:0}
.mk footer .in{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;align-items:flex-end}
.mk footer .brand{font-family:var(--serif);font-size:26px;font-weight:300;color:#fff;font-variation-settings:"opsz" 36,"SOFT" 0}
.mk footer .small{color:rgba(255,255,255,.45);margin-top:8px}
.mk footer nav a{margin-left:32px;color:#fff;font-size:11px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;opacity:.7}
.mk footer nav a:hover{opacity:1}
/* signup / narrow pages */
.mk .page{padding-top:40px;background:var(--cream);min-height:60vh}
.mk .page .card{border:1px solid var(--line-2)}
.mk .page h1{font-weight:300}
@media(max-width:960px){
  .mk .top{padding:0 20px;height:66px}.mk .top nav{display:none}
  .mk .hero .in{grid-template-columns:1fr;min-height:0}.mk .hero .copy{padding:64px 22px 56px;max-width:none}.mk .hero .photo{min-height:340px}
  .mk section.sec{padding:80px 22px}
  .mk .head,.mk .cols,.mk .steps-ed,.mk .list,.mk .split,.mk .band .in{grid-template-columns:1fr}
  .mk .head{gap:16px;margin-bottom:40px}
  .mk .cols>div{padding:32px 0;border-right:0;margin-right:0;border-bottom:1px solid var(--line)}
  .mk .band .photo{min-height:320px}.mk .band .text{padding:64px 22px}
  .mk .trust{padding:24px 20px}.mk .trust .in{gap:18px 28px}
  .mk .close{padding:90px 22px}.mk footer{padding:48px 22px 36px}
  .mk footer nav{display:flex;flex-wrap:wrap;gap:14px 22px}.mk footer nav a{margin:0}
  .mk .top .logo{font-size:19px}.mk .top .btn{padding:9px 12px;letter-spacing:.08em;white-space:nowrap}
  .mk h1 br,.mk h2 br{display:none}
}

/* faq page */
.mk .faq-page .wrap{max-width:1180px;padding:72px 48px 120px}
.mk .faq-page h1{font-size:clamp(40px,4.4vw,60px);margin:0 0 .4em}
.mk .faq-page .lead a{color:var(--ink)}
.mk .faq-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:72px;margin-top:24px;align-items:start}
.mk .faq-topics{position:sticky;top:112px;display:flex;flex-direction:column;border-top:1px solid var(--line-2)}
.mk .faq-topics a{padding:14px 0;border-bottom:1px solid var(--line);color:var(--ink-2);text-decoration:none;font-size:11.5px;font-weight:500;letter-spacing:.14em;text-transform:uppercase}
.mk .faq-topics a:hover{color:var(--ink)}
.mk .faq-group{margin-bottom:88px;scroll-margin-top:100px}
.mk .faq-group .n{display:block;font-family:var(--serif);font-size:14px;color:var(--brass-500);letter-spacing:.06em;margin-bottom:14px}
.mk .faq-group h2{font-size:clamp(28px,3vw,38px);max-width:none;margin:0 0 28px}
.mk .faq-page .faq details{scroll-margin-top:100px}
.mk .faq-page .faq summary{font-size:20px;padding:22px 0}
.mk .faq-page .faq p a{color:var(--ink)}
.mk .faq-page .faq code{font-size:.9em}
.mk .faq-more{margin:32px 0 0}
.mk .faq-more .link,.mk .faq-close .link{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--brass-500);padding-bottom:4px}
.mk .faq-close{text-align:center;border-top:1px solid var(--line-2);padding-top:96px}
.mk .faq-close h2{margin:0 auto .4em;max-width:none}
.mk .faq-close p{color:var(--ink-2);margin:0 auto 32px;font-size:17px}
@media(max-width:960px){
  .mk .faq-page .wrap{padding:48px 22px 80px}
  .mk .faq-layout{grid-template-columns:1fr;gap:32px}
  .mk .faq-topics{position:static;flex-direction:row;flex-wrap:wrap;gap:8px;border-top:0}
  .mk .faq-topics a{border:1px solid var(--line-2);border-radius:999px;padding:8px 14px;letter-spacing:.1em}
  .mk .faq-group{margin-bottom:56px}
  .mk .faq-page .faq summary{font-size:18px}
  .mk .faq-close{padding-top:64px}
}

/* ---- demo films (marketing home) --------------------------------------- */
.mk section.sec.theater{background:var(--navy-900);color:#fff;border-top:0;border-bottom:0}
.mk .theater h2{color:#fff}
.mk .theater .kicker{color:var(--brass-200)}
.mk .theater .lead{color:rgba(255,255,255,.72)}
.mk .theater figure{margin:0}
.mk .vframe{position:relative;background:#000;border:1px solid rgba(255,255,255,.14);border-radius:6px;overflow:hidden;box-shadow:var(--shadow-lg)}
.mk .vframe video,.mk .vframe .vposter,.mk .vframe iframe{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#000;border:0}
.mk .vplay{position:absolute;inset:0;width:100%;height:100%;border:0;background:rgba(16,24,32,.28);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .2s var(--ease)}
.mk .vplay:hover{background:rgba(16,24,32,.12)}
.mk .vplay:before{content:"";width:74px;height:74px;border-radius:50%;border:1px solid rgba(255,255,255,.7);background:rgba(16,24,32,.42);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);transition:border-color .2s var(--ease),background .2s var(--ease)}
.mk .vplay:after{content:"";position:absolute;width:0;height:0;border-style:solid;border-width:11px 0 11px 18px;border-color:transparent transparent transparent #fff;margin-left:5px}
.mk .vplay:hover:before{border-color:var(--brass-200);background:rgba(16,24,32,.6)}
.mk .vplay:focus-visible{outline:2px solid var(--brass-200);outline-offset:3px}
.mk .vframe.playing .vplay{display:none}
.mk .theater figcaption{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 16px;padding:18px 2px 0}
.mk .theater .vt{font-family:var(--serif);font-weight:300;font-size:22px;color:#fff;font-variation-settings:"opsz" 36,"SOFT" 0}
.mk .theater .vd{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--brass-200)}
.mk .theater .vp{flex:1 0 100%;margin-top:8px;color:rgba(255,255,255,.66);font-size:15px;line-height:1.6;max-width:62ch}
.mk .vfeature{max-width:960px;margin:0 auto 72px}
.mk .vgrid{display:grid;grid-template-columns:1fr 1fr;gap:56px;border-top:1px solid rgba(255,255,255,.14);padding-top:64px}
.mk .vmore{margin:64px 0 0;text-align:center}
.mk .theater .link{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;color:#fff;text-decoration:none;border-bottom:1px solid var(--brass-500);padding-bottom:4px}
.mk .theater .link:hover{border-color:#fff}
@media(max-width:960px){
  .mk .vgrid{grid-template-columns:1fr;gap:40px;padding-top:40px}
  .mk .vfeature{margin-bottom:44px}
  .mk .theater .vt{font-size:19px}
  .mk .vplay:before{width:58px;height:58px}
}

/* ---- reduced motion ---------------------------------------------------- */
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}