@import url('https://fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&family=Playfair+Display:ital,wght@0,500;0,600;0,700;0,800;1,500;1,600&display=swap');
/* SAT /about — Parcel identity override (Claude Design tokens). Higher specificity than the cream body.v5 block so it wins regardless of async CSS order.
   PR-4: the @import above is render-blocking (it sits inside a direct <link rel=stylesheet>), so Playfair Display and IBM Plex Mono are guaranteed present before the inline nav/footer lockup SVG first paints. This removes the cold-load race that rendered the lockup in the Times fallback (wider than the fixed viewBox) and clipped it to "REAL ESTAT" on mobile. */
body.v5.parcel{--ink:#14181B;--ink2:#1B2126;--ink3:#0E1114;--paper:#FBFCFE;--cool:#F6F8FB;--silver:#E9EDF1;--silver2:#D7DDE5;--slate:#5B6470;--slate2:#8A93A0;--brass:#A88B5C;--brass-deep:#8C7143;--sand:#D8C6A6;--line:rgba(216,198,166,.22)}
body.v5.parcel{font-family:"Hanken Grotesk",system-ui,sans-serif;color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased}
body.v5.parcel .flabel{position:absolute;top:-38px;left:2px;font-family:"IBM Plex Mono",monospace;font-size:12px;color:#6b7280;white-space:nowrap;letter-spacing:.04em}
body.v5.parcel .hero{position:relative;height:960px;background:radial-gradient(1200px 700px at 78% 28%,#232A31 0%,var(--ink) 55%,var(--ink3) 100%);overflow:hidden;color:var(--cool)}
body.v5.parcel .hero .proof{position:absolute;right:60px;bottom:226px;z-index:4;text-align:right;font-family:"Hanken Grotesk",sans-serif;font-weight:600;font-size:10.5px;letter-spacing:.18em;color:var(--slate2);line-height:2.1;text-transform:uppercase;padding-top:18px;border-top:1px solid rgba(216,198,166,.4)}
body.v5.parcel .ticker .lbl{flex:none;display:flex;align-items:center;gap:10px;padding:0 26px;min-width:132px;border-right:1px solid rgba(216,198,166,.35);font-family:"IBM Plex Mono",monospace;font-size:10px;letter-spacing:.22em;color:var(--sand);text-transform:uppercase;background:#0E1114}
body.v5.parcel .ticker span{display:inline-flex;align-items:center;font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.18em;color:#B9C0C9;text-transform:uppercase;padding:15px 30px;border-right:1px solid rgba(216,198,166,.18);white-space:nowrap}
body.v5.parcel .path-t .tx h2{color:#F4EFDF}
body.v5.parcel .path-t:hover{background:#221F17}
body.v5.parcel .m .proof2{font-family:"Hanken Grotesk",sans-serif;font-weight:600;letter-spacing:.16em}
body.v5.parcel .m .mreach .lbl2{display:block;font-family:"Hanken Grotesk",sans-serif;font-weight:600;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--slate2);margin-bottom:12px}
body.v5.parcel .st6 h4{font-family:"Hanken Grotesk",sans-serif;font-size:14px;font-weight:700;margin-top:8px;line-height:1.3}
body.v5.parcel .ctab{background:linear-gradient(135deg,#6F5A35 0%,#8C7143 55%,#A88B5C 130%);color:#FFF8EA;padding:84px 60px;position:relative;overflow:hidden}
body.v5.parcel .ctab h2{font-size:52px;margin:20px 0 12px;line-height:1.08;color:#FFF8EA;max-width:640px}
body.v5.parcel .btn-ink:hover{transform:translateY(-2px);color:#FFF8EA}
body.v5.parcel .btn-ghost-ink{display:inline-flex;align-items:center;gap:10px;border:1.5px solid rgba(255,248,234,.55);color:#FFF8EA;font-weight:700;font-size:15px;padding:16px 30px;border-radius:11px}
body.v5.parcel .ci{width:100%;border:none;border-bottom:1.5px solid var(--silver2);padding:7px 2px 10px;font-size:17px;font-family:"Hanken Grotesk";color:var(--ink);background:transparent}
body.v5.parcel .foot .ar{font-family:"Hanken Grotesk";font-size:13px;letter-spacing:0;text-transform:none}
body.v5.parcel .eb, body.v5.parcel .eb2, body.v5.parcel .eb3, body.v5.parcel .k, body.v5.parcel .hero .corner, body.v5.parcel .ticker .lbl, body.v5.parcel .ticker span, body.v5.parcel .metric .l, body.v5.parcel .path .tx .pk, body.v5.parcel .lrow .lt, body.v5.parcel .lrow .la, body.v5.parcel .cleft .fine, body.v5.parcel .privacy, body.v5.parcel .phero .assur, body.v5.parcel .phero .pmeta, body.v5.parcel .ctab .fine2, body.v5.parcel .foot .fal2, body.v5.parcel .foot h4, body.v5.parcel .foot .fbot, body.v5.parcel .arttop .crumb, body.v5.parcel .arttop .byline, body.v5.parcel .toc .t, body.v5.parcel .atom .t, body.v5.parcel .dtable th, body.v5.parcel .plate .pk2, body.v5.parcel .plate .meta2, body.v5.parcel .agrp, body.v5.parcel .tagx, body.v5.parcel .loct, body.v5.parcel .drow .g, body.v5.parcel .drow .go2, body.v5.parcel .trow .open, body.v5.parcel .arow .go, body.v5.parcel .tnote, body.v5.parcel .cout .t, body.v5.parcel .cout .disc, body.v5.parcel .qcard .who, body.v5.parcel .stpanel .aside .t, body.v5.parcel .adv .role, body.v5.parcel .adv .ln, body.v5.parcel .pub .k2, body.v5.parcel .dept .dl, body.v5.parcel .mfoot-mini p{font-family:"Hanken Grotesk",sans-serif;font-weight:600}
body.v5.parcel .metrics{display:grid;grid-template-columns:repeat(4,1fr);background:var(--ink2)}
body.v5.parcel .metric{padding:36px 20px;border-right:1px solid var(--line);text-align:center}
body.v5.parcel .metric:last-child{border-right:none}
body.v5.parcel .metric .v{font-family:'Playfair Display',serif;font-size:42px;font-weight:700;color:var(--sand)}
body.v5.parcel .metric .l{font-family:'Hanken Grotesk',sans-serif;font-weight:600;font-size:10px;letter-spacing:.16em;color:rgba(244,239,223,.55);text-transform:uppercase;margin-top:8px}
body.v5.parcel .dtable td.lb{font-family:'Hanken Grotesk',sans-serif;font-weight:600;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--slate2);white-space:nowrap;width:130px}
body.v5.parcel a{color:inherit;text-decoration:none}

/* ---- Parcel fixes (2026-07-19b) ---- */
body.v5.parcel{background:#FBFCFE}
body.v5.parcel .foot .fstate{color:#C7CED6}
body.v5.parcel .foot .fal2{color:#9AA3AF}

/* ---- PR-1 (2026-07-20): nav = solid ink per SAT-Update-2026-07-16-B (owner-approved), pinned to viewport, reversed lockup ---- */
body.v5.parcel .nav{background:#14181B;position:fixed;left:0;right:0;top:0;z-index:1000;border-bottom:1px solid rgba(216,198,166,.18);box-shadow:none}
body.v5.parcel .nav img{height:40px;width:auto}
body.v5.parcel .nav .links a,body.v5.parcel .nav .links a span{color:#E9EDF1}
body.v5.parcel .nav .links a:hover span{color:#FFFFFF}
body.v5.parcel .nav .cta{background:#A88B5C;color:#14181B;border-color:#A88B5C}
body.v5.parcel .nav .cta:hover{background:#D8C6A6;color:#14181B}

/* ---- PR-2 (2026-07-20): homepage Parcel v5 per SAT-Update-2026-07-16-B section 3 ---- */
/* Hero resets: the legacy unscoped .hero / .hero-video rules in styles.css must not leak into the v5 hero */
body.v5.parcel .hero{display:block;min-height:0;max-height:none;margin:0;padding:0;text-align:left}
body.v5.parcel .hero::before,body.v5.parcel .hero::after{content:none}
body.v5.parcel .hero video.vid{position:absolute;inset:0;top:0;left:0;width:100%;height:100%;object-fit:cover;display:block;z-index:0;opacity:1;transform:none;filter:saturate(.78) brightness(.9)}
/* FAQ: native details/summary inside the Parcel accfaq shell */
body.v5.parcel .accfaq details{margin:0;padding:0;background:transparent;border:none;border-radius:0;border-bottom:1px solid var(--silver)}
body.v5.parcel .accfaq details:last-child{border-bottom:none}
body.v5.parcel .accfaq summary.q{margin:0;border-bottom:none;list-style:none}
body.v5.parcel .accfaq summary.q::-webkit-details-marker{display:none}
body.v5.parcel .accfaq summary.q::marker{content:""}
body.v5.parcel .accfaq summary.q::after{content:none}
body.v5.parcel .accfaq .q .pm{transition:transform .2s}
body.v5.parcel .accfaq details[open] summary.q{background:var(--cool)}
body.v5.parcel .accfaq details[open] summary.q .pm{transform:rotate(45deg)}
body.v5.parcel .accfaq details .ans{margin:0;border-bottom:none}

/* ---- PR-3 polish (2026-07-20): owner review fixes, hover blocking, transparent hero nav, ticker marquee, dock ---- */
body.v5.parcel{overflow-x:hidden}
/* decorative overlays must NEVER block hover or clicks */
body.v5.parcel .tint,body.v5.parcel .gridbg,body.v5.parcel .gridbg2,body.v5.parcel .glow,body.v5.parcel .frameline,body.v5.parcel .cueline,body.v5.parcel .wmk,body.v5.parcel .wm2{pointer-events:none}
/* PR-10 (2026-07-21): homepage hero nav is transparent over the dark video hero at the
   top of the page, then transitions to solid ink once the user scrolls (~40px). A tiny
   scroll listener on the homepage toggles .scrolled on the nav. This relaxes the earlier
   PR-5 forced-ink !important so the over-hero transparency can show. Interior pages have
   no .overhero nav, so they stay solid ink fixed via the base .nav rule above. */
body.v5.parcel .nav.overhero{position:fixed;top:0;left:0;right:0;z-index:1000;background:transparent !important;background-color:transparent !important;border-bottom:none !important;box-shadow:none;transition:background .25s,border-color .25s}
body.v5.parcel .nav.overhero.scrolled{background:#14181B !important;background-color:#14181B !important;border-bottom:1px solid rgba(216,198,166,.18) !important}
/* inline lockup (true Playfair via page fonts). PR-4: 34px cap + max-width + flex:0 0 auto so the CTA can never squeeze it; overflow:visible so if a font ever paints late the serif fallback overflows harmlessly instead of being clipped to "REAL ESTAT" */
body.v5.parcel .nav svg.lockup{height:34px;width:auto;max-width:62vw;flex:0 0 auto;display:block;overflow:visible}
body.v5.parcel .foot svg.lockup{height:35px;width:auto;display:block;overflow:visible}
/* ticker: contained marquee, 36s loop (spec) */
body.v5.parcel .ticker{overflow:hidden}
body.v5.parcel .ticker .tk{flex:1;overflow:hidden;display:flex;align-items:stretch}
body.v5.parcel .ticker .in{display:flex;width:max-content;animation:tick 36s linear infinite}
body.v5.parcel .ticker span.di::before{content:"";width:7px;height:7px;border:1px solid var(--sand);margin-right:10px;flex:none;display:inline-block}
body.v5.parcel .ticker span.as::before{content:"";width:7px;height:7px;background:var(--brass);margin-right:10px;flex:none;display:inline-block}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}
/* dock: on-screen, legible, emphatic hovers */
body.v5.parcel .dock{max-width:100%}
body.v5.parcel .path-l .pidx,body.v5.parcel .path-l .arr{color:var(--ink)}
body.v5.parcel .path-l .tx h2{color:var(--ink)}
body.v5.parcel .path{transition:background .25s}
body.v5.parcel .path-t:hover{background:#2A3138}
body.v5.parcel .path-l:hover{background:#FFFFFF}
body.v5.parcel .path:hover .arr{transform:translateX(6px)}

/* ---- PR-3c (2026-07-20): /contact Parcel, sentence-form controls, full-brief shell ---- */
/* long values (email) must wrap on narrow screens */
body.v5.parcel .lrow .lv{overflow-wrap:anywhere}
/* sentence blanks as real form controls (Playfair italic, dotted brass baseline) */
body.v5.parcel .madlib input.blank,body.v5.parcel .madlib select.blank{font-family:"Playfair Display",serif;font-size:inherit;line-height:1.35;font-style:italic;font-weight:600;color:var(--brass-deep);background:transparent;border:0;border-bottom:2px dotted var(--brass);border-radius:0;padding:0 8px 2px;outline:none;transition:.2s;-webkit-appearance:none;appearance:none;min-width:0;max-width:100%;vertical-align:baseline}
body.v5.parcel .madlib select.blank{cursor:pointer;text-align:center}
body.v5.parcel .madlib select.blank option{font-style:normal;font-family:"Hanken Grotesk",sans-serif;color:#14181B}
body.v5.parcel .madlib input.blank:focus,body.v5.parcel .madlib select.blank:focus{background:var(--cool);border-bottom-color:var(--brass-deep)}
body.v5.parcel .madlib input.blank::placeholder{color:var(--slate2);font-style:italic;opacity:1}
body.v5.parcel .madlib .blank.miss{border-bottom-color:#B0452C}
body.v5.parcel .madlib input.w-sm{width:130px}
body.v5.parcel .madlib input.w-md{width:180px}
body.v5.parcel .madlib input.w-lg{width:260px}
body.v5.parcel .madlib .phgrp{white-space:nowrap}
body.v5.parcel .madlib .phgrp input{width:170px}
body.v5.parcel .madlib .mlbl{display:none}
/* chips + send are real buttons on the live page */
body.v5.parcel button.chip{font-family:inherit;line-height:1.2}
body.v5.parcel button.send{border:0;font-family:inherit}
body.v5.parcel .sendrow .alt a u{color:var(--brass-deep);text-decoration-color:var(--brass)}
/* classic full-brief shell */
body.v5.parcel .fbwrap{max-width:760px;margin-top:26px}
/* cookie preferences control inside the ink footer legal row */
body.v5.parcel .fbot .footer-cookie-prefs{background:none;border:0;color:inherit;font:inherit;padding:0;cursor:pointer}
body.v5.parcel .fbot .footer-cookie-prefs:hover{text-decoration:underline}

/* ================================================================
   PR-3d (2026-07-20): CONSOLIDATED MOBILE LAYER
   Single source of truth for every rule below 768px, replacing the
   six overlapping media blocks appended by earlier sessions today.
   Ordered by page anatomy: nav, homepage hero, ticker, dock,
   metrics, shared sections, homepage components, interior heroes,
   engagements, about, contact, CTA band, footer.
   The v5 component layer at the end of styles.min.css carries the
   desktop geometry (absolute offsets, fixed heights, multi-column
   grids); this block re-flows all of it into one clean column.
   ================================================================ */
@media (max-width:767px){

  /* -- 1. Nav: one row, 30px lockup, brass CTA, links hidden -- */
  body.v5.parcel .nav{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 20px}
  body.v5.parcel .nav.overhero{padding:14px 20px}
  body.v5.parcel .nav .links{display:none}
  body.v5.parcel .nav svg.lockup{height:30px}
  body.v5.parcel .nav .cta{padding:9px 14px;font-size:12px;margin-left:auto;white-space:nowrap}

  /* -- 2. Homepage hero: ink tint over the video, static flow -- */
  body.v5.parcel .hero{height:auto;min-height:0;padding:128px 22px 252px;background:var(--ink)}
  body.v5.parcel .hero .frameline,body.v5.parcel .hero .gridbg,body.v5.parcel .hero .glow,body.v5.parcel .hero .cueline{display:none}
  body.v5.parcel .hero video.vid{display:block}
  body.v5.parcel .hero .tint{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(14,17,20,.78) 0%,rgba(14,17,20,.52) 42%,rgba(14,17,20,.86) 80%,#0E1114 100%)}
  /* hmain and proof keep position:relative for stacking above the tint,
     but every desktop offset must be cleared or the boxes are dragged
     off the canvas (the PR-2 versus PR-3b conflict found on 20 July) */
  body.v5.parcel .hmain{position:relative;top:auto;right:auto;bottom:auto;left:auto;max-width:none;z-index:2}
  body.v5.parcel .hmain .ebx{display:none}
  body.v5.parcel .hmain h1{font-size:34px;line-height:1.12;margin-top:18px}
  body.v5.parcel .hmain h1 .it{margin-left:20px}
  body.v5.parcel .hmain p{font-size:14.5px;margin-top:16px}
  body.v5.parcel .hero .eb{position:relative;z-index:2}
  body.v5.parcel .hero .proof{position:relative;top:auto;right:auto;bottom:auto;left:auto;z-index:2;text-align:left;font-size:10px;line-height:2;margin-top:26px;padding-top:14px}
  body.v5.parcel .hero .proof b{font-size:19px}

  /* -- 3. Ticker: slim strip above the dock, label hidden -- */
  body.v5.parcel .ticker{bottom:188px;z-index:3}
  body.v5.parcel .ticker .lbl{display:flex;padding:0 14px;min-width:auto;font-size:9px}
  body.v5.parcel .ticker span{font-size:9.5px;padding:12px 18px}

  /* -- 4. Dock: cards stacked one per row -- */
  body.v5.parcel .dock{grid-template-columns:1fr;z-index:3}
  body.v5.parcel .path{padding:18px 20px;gap:13px}
  body.v5.parcel .path .pidx{display:none}
  body.v5.parcel .path .pm{width:32px;height:32px}
  body.v5.parcel .path .tx h2{font-size:19px}

  /* -- 5. Metrics: 2 x 2 grid -- */
  body.v5.parcel .metrics{grid-template-columns:repeat(2,1fr)}
  body.v5.parcel .metric{border-right:none;border-bottom:1px solid var(--line);padding:26px 14px}
  body.v5.parcel .metric .v{font-size:34px}

  /* -- 6. Shared section rhythm and eyebrows -- */
  body.v5.parcel .sect{padding:56px 22px}
  body.v5.parcel h2.d{font-size:32px;line-height:1.12}
  body.v5.parcel .eb2{display:flex;align-items:center;gap:10px;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--slate)}
  body.v5.parcel .eb2 .mm{width:20px;height:20px;flex:none}

  /* -- 7. Homepage: asset ledger, broadsheet, wall, FAQ -- */
  body.v5.parcel .assets{margin-top:26px}
  body.v5.parcel .agrp{letter-spacing:.14em;gap:10px}
  body.v5.parcel .arow{grid-template-columns:34px 24px 1fr auto;gap:12px;padding:16px 0}
  body.v5.parcel .arow h3{font-size:16.5px}
  body.v5.parcel .arow p{display:none}
  body.v5.parcel .arow .lotmini{width:22px;height:22px}
  body.v5.parcel .arow .go{opacity:1;transform:none;font-size:9px}
  body.v5.parcel .sheet .cols{display:block;margin-top:30px}
  body.v5.parcel .sheet h2{font-size:30px;margin-bottom:18px}
  body.v5.parcel .sheet .statcol{margin-top:26px}
  /* justified columns river badly at 390px, rag right instead */
  body.v5.parcel .sheet .body{text-align:left}
  body.v5.parcel .wall{padding:46px 22px}
  body.v5.parcel .wall .names{font-size:24px;line-height:1.7;margin-top:24px}
  body.v5.parcel .wall .names .sep{width:7px;height:7px;margin:0 10px;vertical-align:3px}
  body.v5.parcel .wall .sub{font-size:8.5px;letter-spacing:.12em;margin-top:20px}
  body.v5.parcel .accfaq{background:#fff;border:1px solid var(--silver);border-radius:14px;overflow:hidden}
  body.v5.parcel .accfaq summary.q{display:flex;justify-content:space-between;align-items:center;gap:12px;font-weight:600;cursor:pointer}
  body.v5.parcel .accfaq .q{font-size:13.5px;padding:14px 16px}
  body.v5.parcel .accfaq .q .pm{color:var(--brass-deep)}
  body.v5.parcel .accfaq .ans{font-size:12.5px;padding:0 16px 14px}

  /* -- 8. Interior page heroes: clear the fixed nav, compact type -- */
  body.v5.parcel .phero{padding:92px 22px 44px}
  body.v5.parcel .phero h1{font-size:34px;line-height:1.14}
  body.v5.parcel .phero .lede2{font-size:15.5px}
  body.v5.parcel .phero .ctas{flex-wrap:wrap;gap:12px}

  /* -- 9. Engagements: rows stacked, meta joined by middots -- */
  body.v5.parcel .erow{display:block;padding:18px 0}
  body.v5.parcel .erow .cl2{display:block;font-size:22px;margin-bottom:2px}
  body.v5.parcel .erow .f2{display:inline;font-size:13px;color:var(--slate)}
  body.v5.parcel .erow .f2 + .f2::before{content:" \00b7  "}
  body.v5.parcel .erow .tag2{display:none}
  body.v5.parcel .vrow{display:block;padding:20px 0}

  /* -- 10. About: advisors stacked, record table, NDA band -- */
  body.v5.parcel .advisors{display:block}
  body.v5.parcel .adv{margin-bottom:18px}
  body.v5.parcel .dtable td{font-size:14px}
  body.v5.parcel .ndaband{display:block;padding:22px}
  body.v5.parcel .ndaband .btn{margin-top:14px}

  /* -- 11. Contact: sentence panel first, ink ledger, classic brief -- */
  body.v5.parcel .cframe{display:flex;flex-direction:column;min-height:0}
  body.v5.parcel .cright{order:-1;display:block;padding:98px 22px 44px}
  body.v5.parcel .cleft{display:block;background:var(--ink);color:var(--cool);position:relative;overflow:hidden;padding:40px 22px 36px}
  body.v5.parcel .cleft .eb,body.v5.parcel .cleft h1,body.v5.parcel .cleft .sub{display:none}
  body.v5.parcel .cleft .gridbg{position:absolute;inset:0;background-image:linear-gradient(rgba(216,198,166,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(216,198,166,.05) 1px,transparent 1px);background-size:90px 90px}
  body.v5.parcel .cleft .wmk{position:absolute;left:-70px;bottom:-70px;width:300px;height:300px;opacity:.05;transform:rotate(6deg)}
  body.v5.parcel .ledger{margin-top:0}
  body.v5.parcel .ledger .lrow{display:grid;grid-template-columns:86px 1fr;gap:12px;align-items:baseline;border-top:1px solid var(--line);padding:16px 0 14px}
  body.v5.parcel .lrow .lt{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.2em;color:var(--slate2);text-transform:uppercase}
  body.v5.parcel .lrow .lv{font-family:"Playfair Display",serif;font-weight:600;color:var(--cool);font-size:18px}
  body.v5.parcel .lrow .la{display:none}
  body.v5.parcel .cleft .fine{font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.18em;color:rgba(138,147,160,.8);text-transform:uppercase;line-height:2.1;position:relative;margin-top:22px}
  body.v5.parcel .madlib{font-family:"Playfair Display",serif;font-weight:500;font-size:22px;line-height:1.9;margin-top:26px;max-width:none}
  body.v5.parcel .madlib .cw{display:none}
  body.v5.parcel .madlib .mhide{display:none}
  body.v5.parcel .madlib .blank{display:inline-block;border-bottom:2px dotted var(--brass);color:var(--brass-deep);font-style:italic;font-weight:600;padding:0 8px;white-space:nowrap}
  body.v5.parcel .madlib .mlbl{display:block;font-family:"Hanken Grotesk",sans-serif;font-style:normal;font-weight:600;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--slate2);margin:20px 0 2px}
  body.v5.parcel .madlib input.blank.full{display:block;width:100%;margin:2px 0 10px;padding:4px 4px 10px;font-size:20px}
  body.v5.parcel .madlib input.w-sm{width:110px}
  body.v5.parcel .madlib input.w-md{width:150px}
  body.v5.parcel .madlib .phgrp{display:flex;align-items:stretch;gap:8px;white-space:normal;margin-top:2px}
  body.v5.parcel .madlib .phgrp select.blank{width:118px;flex:none;font-size:20px;text-align:left}
  body.v5.parcel .madlib .phgrp input{flex:1;width:auto;font-size:20px;padding:4px 4px 10px}
  body.v5.parcel .madlib .phgrp .dot{display:none}
  body.v5.parcel .chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px}
  body.v5.parcel .chip{font-weight:600;border:1px solid var(--silver2);border-radius:999px;background:#fff;color:var(--slate);padding:8px 14px;font-size:12px}
  body.v5.parcel .chip.on{background:var(--ink);border-color:var(--ink);color:var(--cool)}
  body.v5.parcel .sendrow{display:flex;flex-direction:column;align-items:stretch;text-align:center;gap:14px;margin-top:34px}
  body.v5.parcel .send{display:inline-flex;align-items:center;justify-content:center;gap:12px;background:var(--brass);color:var(--ink);font-weight:700;font-size:15px;padding:16px 28px;border-radius:12px;box-shadow:0 14px 34px rgba(140,113,67,.35)}
  body.v5.parcel .sendrow .alt{font-size:13px;color:var(--slate2)}
  body.v5.parcel .sendrow .alt u{color:var(--brass-deep);text-decoration-color:var(--brass)}
  body.v5.parcel .privacy{display:flex;flex-direction:column;gap:6px;margin-top:34px;border-top:1px solid var(--silver);padding-top:16px;font-family:"IBM Plex Mono",monospace;font-size:9.5px;letter-spacing:.14em;color:var(--slate2);text-transform:uppercase}
  /* classic full brief: the message field must not sit beside its label */
  body.v5.parcel .fbwrap textarea{display:block;width:100%;min-height:130px;margin-top:8px}

  /* -- 12. CTA band: compact -- */
  body.v5.parcel .ctab{padding:56px 22px}
  body.v5.parcel .ctab h2{font-size:32px}
  body.v5.parcel .ctab .row{flex-wrap:wrap;gap:12px}

  /* -- 13. Footer: single ink column, clearance for the action bar -- */
  body.v5.parcel .foot{background:var(--ink3);color:#B9C0C9;position:relative;overflow:hidden;padding:56px 22px 110px}
  body.v5.parcel .foot .wmk{position:absolute;right:-80px;bottom:-80px;width:300px;height:300px;opacity:.04;transform:rotate(-6deg)}
  body.v5.parcel .foot svg.lockup{height:30px}
  body.v5.parcel .foot h4{color:#E9EDF1;font-size:11px;letter-spacing:.18em;text-transform:uppercase;margin:0 0 4px}
  body.v5.parcel .foot ul{list-style:none;margin:8px 0 0;padding:0}
  body.v5.parcel .foot li{margin:7px 0;font-size:13.5px;color:#9AA3AF}
  body.v5.parcel .fgrid{display:block}
  body.v5.parcel .fgrid > div{margin-bottom:26px}
  body.v5.parcel .fbot{display:block;text-align:center;border-top:1px solid rgba(216,198,166,.15);margin-top:26px;padding-top:18px;font-size:11px;letter-spacing:.08em;color:#8A93A0}
  body.v5.parcel .fbot span{display:block;margin:6px 0}
}

/* ================================================================
   PR-5 (2026-07-20): NAV HAMBURGER + MOBILE MENU (CSS-only toggle)
   Bug fix: below 768px the inline .links were hidden with no way to
   reach the sections. A visually-hidden checkbox (#navtog) toggled by
   the .hbg label opens the .mobmenu ink panel. No JavaScript. Identical
   markup on all seven Parcel pages. Desktop (>=768px) is untouched:
   .hbg and .mobmenu stay display:none and the inline .links + .cta are
   unchanged, so there is no desktop regression.
   ================================================================ */
body.v5.parcel .nav .navtog{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;opacity:0;overflow:hidden;clip:rect(0 0 0 0);pointer-events:none}
body.v5.parcel .nav .hbg{display:none}
body.v5.parcel .nav .mobmenu{display:none}

@media (max-width:767px){
  /* keep the bar pinned; lay out as lockup | hamburger */
  body.v5.parcel .nav,body.v5.parcel .nav.overhero{position:fixed;top:0;left:0;right:0}
  /* the inline brass CTA moves into the menu on mobile to keep the bar clean */
  body.v5.parcel .nav>.cta{display:none}
  /* hamburger button, top-right */
  body.v5.parcel .nav .hbg{display:flex;flex-direction:column;justify-content:center;gap:5px;width:42px;height:34px;margin-left:auto;padding:6px;box-sizing:border-box;cursor:pointer;-webkit-tap-highlight-color:transparent;flex:0 0 auto}
  body.v5.parcel .nav .hbg span{display:block;width:100%;height:2px;border-radius:2px;background:#E9EDF1;transition:transform .25s ease,opacity .2s ease}
  /* the sliding ink panel, anchored directly under the bar */
  body.v5.parcel .nav .mobmenu{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:#14181B;border-bottom:1px solid rgba(216,198,166,.18);box-shadow:0 26px 44px rgba(0,0,0,.45);padding:6px 0 14px;max-height:0;overflow:hidden;opacity:0;visibility:hidden;transform:translateY(-8px);transition:max-height .3s ease,opacity .25s ease,transform .25s ease,visibility .25s;z-index:1001}
  body.v5.parcel .nav .mobmenu a{display:block;padding:15px 24px;color:#E9EDF1;font-family:"Hanken Grotesk",sans-serif;font-weight:600;font-size:16px;letter-spacing:.01em;border-bottom:1px solid rgba(216,198,166,.08)}
  body.v5.parcel .nav .mobmenu a:active{background:#1B2126}
  body.v5.parcel .nav .mobmenu .mm-cta{margin:14px 22px 4px;padding:14px 18px;border-bottom:none;background:#A88B5C;color:#14181B;border-radius:11px;text-align:center;font-weight:700}
  /* open state: checkbox drives the panel and the bars-to-X morph */
  body.v5.parcel .nav .navtog:checked~.mobmenu{max-height:82vh;overflow-y:auto;opacity:1;visibility:visible;transform:translateY(0)}
  body.v5.parcel .nav .navtog:checked~.hbg span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  body.v5.parcel .nav .navtog:checked~.hbg span:nth-child(2){opacity:0}
  body.v5.parcel .nav .navtog:checked~.hbg span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
}

/* ================================================================
   PR-6 (2026-07-20): /insights + /tools Parcel hub rebuild support
   - Global interior-hero clearance: on desktop the .phero eyebrow cleared
     the 97.6px fixed nav by only ~12px and read as sitting under it. Give
     the interior heroes a comfortable clearance without a large void.
   - Real <button>/<a> filter (insights) and anchor (tools) chips inherit
     the page font.
   - Mobile reflow for the ghost-plate grid (.plates) and calculator ledger
     (.trow), whose desktop fixed-width columns would otherwise overflow
     390px (scrollWidth must stay <=392).
   ================================================================ */
@media (min-width:768px){
  body.v5.parcel .phero{padding-top:128px}
}
body.v5.parcel .fc{cursor:pointer}
body.v5.parcel button.fc{font-family:inherit;line-height:1.2}
@media (max-width:767px){
  /* keep any absolutely-placed interior-hero data line in flow on mobile */
  body.v5.parcel .phero .pmeta{position:static;display:block;right:auto;bottom:auto;margin-top:20px}
  body.v5.parcel .tnote{white-space:normal;line-height:1.5}
  /* insights ghost-plate grid: single column */
  body.v5.parcel .plates{grid-template-columns:1fr;gap:14px;margin-top:30px}
  body.v5.parcel .plate{min-height:0}
  body.v5.parcel .fchips{margin-top:26px}
  /* tools calculator ledger: index column + stacked text/affordance */
  body.v5.parcel .trows{margin-top:30px}
  body.v5.parcel .trow{grid-template-columns:38px 1fr;gap:4px 14px;padding:20px 0}
  body.v5.parcel .trow:hover{padding-left:0;padding-right:0;background:transparent}
  body.v5.parcel .trow .no{grid-column:1;grid-row:1}
  body.v5.parcel .trow h3{grid-column:2;grid-row:1;font-size:20px}
  body.v5.parcel .trow p{grid-column:2;grid-row:2;font-size:13.5px;max-width:none}
  body.v5.parcel .trow .open{grid-column:2;grid-row:3;justify-self:start;margin-top:4px}
}

/* ================================================================
   PR-7 (2026-07-21): MOBILE TEXT-INFLATION GUARD (device-only defect)
   The owner saw "words coming out of screen / boxes not closed" on a real
   phone, but the 320-390px desktop-iframe overflow scan reported zero
   genuine overflow on every Parcel page (nav, hero, ticker, dock, metrics,
   engagements, about, contact, tools calculators, insights, legal, 404).
   Root cause of the discrepancy: text-size-adjust computed to `auto`, so
   mobile Chrome (Android automatic font-boosting) and iOS Safari on
   rotation inflate the font size of in-flow text beyond the authored mobile
   sizes, spilling headings, labels and mono eyebrows past their fixed
   boxes. Desktop iframes never apply this inflation, which is exactly why
   the earlier 390px verification missed it. Pinning text-size-adjust to
   100% makes every engine honour the authored mobile type scale.
   Paired with the ?v=11 cache-buster on all Parcel views so any phone that
   cached the pre-PR-3d ?v=10 stylesheet re-fetches the current mobile CSS.
   ================================================================ */
html{-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}
body.v5.parcel{-webkit-text-size-adjust:100%;text-size-adjust:100%}

/* ================================================================
   PR-8 (2026-07-21): INTERIOR-HERO DECORATIVE WATERMARK CLIP GUARD
   The .phero decorative .wmk lockup lays out to ~442px at a 360px
   viewport. It is already contained on every Parcel page (interior
   heroes compute overflow-x:hidden and body.v5.parcel is
   overflow-x:hidden, so there is no page scrollbar - the document
   scrollWidth stays 345 at 360px), but pin the horizontal clip
   explicitly in the owned override so an upstream parcel-theme change
   can never let the watermark bleed past the viewport on mobile.
   Scoped to .phero only and overflow-x only: the homepage .hero
   (which hosts the ticker marquee) and the ticker itself are left
   untouched, and nothing that may legitimately overhang vertically is
   affected. Hardening; no visible change.
   ================================================================ */
@media (max-width:767px){
  body.v5.parcel .phero{overflow-x:hidden}
}

/* ================================================================
   PR-9 (2026-07-21): /insights FLAGSHIP PLATE - restore dark panel
   The flagship "Riyadh Commercial Rent Index" plate is authored inline as a
   full-width dark featured card (inline style includes background:var(--ink))
   with a sand eyebrow, cool (near-white) H3 title and a faint white ghost
   letter - every child is coloured for a dark ground. A legacy pre-Parcel
   .article-card rule sets background:#fff !important, which outranks the inline
   dark background, so the near-white title (var(--cool)) was left on the
   near-white page (contrast ~1.0) and the flagship headline was effectively
   invisible; the sand eyebrow and ghost letter were washed out too. Re-assert
   the authored ink background only on the plate that itself requests it (the
   attribute selector matches solely the inline var(--ink) flagship, so the 20
   light article cards are untouched). No markup, copy, schema or ordering
   change; restores the intended featured-card look and makes the headline
   legible. Scoped, additive, reversible.
   ================================================================ */
body.v5.parcel .plate[style*="var(--ink)"]{background:#14181B !important;border-color:#14181B !important}

/* ================================================================
   PR-11 (2026-07-21): OWNER MOBILE POLISH (satestate.com iPhone review)
   Four scoped, additive fixes. No copy, markup, schema or link change.
   ---------------------------------------------------------------- */

/* FIX 1 - Mobile Call / WhatsApp / Email bar -> Parcel identity.
   The base bar (styles.min.css) still uses the pre-Parcel palette
   (--sat-cream ground, --sat-gold icons, --sat-charcoal labels) so it
   read as the old design. Re-skin it to the ink chrome used by the nav
   and footer: deep ink ground, a hairline brass top rule, brass icons
   and paper Hanken Grotesk labels for contrast, and comfortable tap
   targets. Visibility stays owned by the base 767.98px rule (the bar is
   display:none on desktop) so these appearance rules are inert there.
   The three tel:/wa.me/mailto: links are untouched. */
body.v5.parcel .mobile-action-bar{background:#14181B;background-color:#14181B;border-top:1px solid rgba(216,198,166,.22);box-shadow:0 -10px 30px rgba(0,0,0,.34)}
body.v5.parcel .mobile-action-bar__btn{color:#E9EDF1;font-family:"Hanken Grotesk",system-ui,sans-serif;font-weight:600;gap:5px;padding:11px 4px;min-height:58px}
body.v5.parcel .mobile-action-bar__btn + .mobile-action-bar__btn{border-left:1px solid rgba(216,198,166,.12)}
body.v5.parcel .mobile-action-bar__btn:active{background:rgba(216,198,166,.07)}
body.v5.parcel .mobile-action-bar__icon{color:#A88B5C}
body.v5.parcel .mobile-action-bar__label{color:#E9EDF1;font-size:11px;letter-spacing:.1em;text-transform:uppercase}

/* FIX 2 - Homepage coverage strip (ticker): roll on mobile + sit flush
   on the dock. The .in marquee (animation:tick 36s) is authored
   width-independently and rolls on desktop, but a global
   prefers-reduced-motion reset in styles.min.css
   (*{animation-duration:0.01ms!important}) freezes it on phones with
   Reduce Motion enabled, which is why it read static on mobile while
   desktop scrolled. Re-assert the marquee for this one decorative strip
   only, so it rolls on mobile exactly like desktop. The strip also sat
   at bottom:188px above a 170px-tall two-card dock, leaving an 18px
   gap; drop it to bottom:170px so it is flush on the dock. */
@media (max-width:767px){
  body.v5.parcel .ticker .in{animation:tick 36s linear infinite !important;will-change:transform}
  body.v5.parcel .ticker{bottom:170px}
}

/* FIX 3 - Homepage dock: the light "Landlord advisory" tile (.path-l)
   sat as a near-white (--cool) panel with no edge, reading as a bright
   floating block next to the ink "Tenant representation" tile. Keep the
   calm --cool tone but add a hairline so the two tiles read as an
   intentional pair; text stays ink and legible. */
body.v5.parcel .path-l{background:var(--cool);border:1px solid var(--silver)}
body.v5.parcel .path-l:hover{background:var(--paper)}

/* FIX 4 - /insights "Latest market intelligence" intro. The
   .insights-intro brass left rule sat at the section's 22px content
   edge with no inner padding, so its text started 4px inset from the
   eyebrow and heading and jammed against the bar (misaligned left
   edges, floating rule). On mobile, drop the rule and align the intro
   flush-left with the eyebrow and heading for one clean editorial
   column. Desktop keeps the bordered callout. */
@media (max-width:767px){
  body.v5.parcel.insights-page .insights-intro{border-left:0;padding-left:0}
}

/* ================================================================
   PR-13 (2026-07-21): HOMEPAGE DOCK CONTRAST BALANCE (owner desktop review)
   The "02 Landlord advisory" owner tile (.path-l) rendered as a cold
   near-white slab (var(--cool) #F6F8FB) beside the ink "01 Tenant
   representation" occupier tile and directly above the dark metrics band,
   so on desktop it read as a bright block floating in a sea of dark. The
   earlier PR-11 FIX 3 softened it with a hairline but kept the cold --cool
   ground, so the owner still found it "too white and out of contrast".
   Re-tone the owner tile into a warm brass-paper panel that pairs with the
   ink occupier tile as one intentional set: a warm sand ground (#E6DAC1),
   a soft brass inset hairline in place of the cold silver border, and the
   same brass-to-sand top accent the occupier tile carries. The parcel
   mark, index numeral, eyebrow and arrow are lifted from the inherited
   near-white to brass-deep so the tile reads clearly as the brass/paper
   counterpart of the ink tile, with the heading kept near-ink (#241C0E)
   for full legibility. The metrics band below is deliberately left dark
   (var(--ink2)): it matches the ink hero above and the occupier tile, so
   the occupier tile, owner tile and metrics band read as one grounded
   composition rather than gaining a third competing tone. No copy,
   numerals, arrows or links change; the hover lift is preserved. This
   supersedes PR-11 FIX 3 for the owner tile via source order. Scoped,
   additive, reversible.
   ================================================================ */
body.v5.parcel .path-l{background:#E6DAC1;border:none;box-shadow:inset 0 0 0 1px rgba(168,139,92,.30)}
body.v5.parcel .path-l::before{background:linear-gradient(90deg,var(--brass),var(--sand))}
body.v5.parcel .path-l .pm{color:var(--brass-deep)}
body.v5.parcel .path-l .pidx{color:var(--brass-deep)}
body.v5.parcel .path-l .tx .pk{color:var(--brass-deep)}
body.v5.parcel .path-l .tx h2{color:#241C0E}
body.v5.parcel .path-l .arr{color:var(--brass-deep)}
body.v5.parcel .path-l:hover{background:#EDE2CD}

/* ================================================================
   PR-14 (2026-07-22): SHARE BUTTONS -> Parcel identity
   The "Share this tool" (four calculators) and "Share this insight"
   (every /insights article) LinkedIn + X buttons rendered as bright
   platform-blue fills from the legacy .share-btn.linkedin/.twitter rules
   in styles.min.css, clashing with the ink/paper Parcel palette. Re-skin
   the shared share component (identical .article-share > .share-buttons >
   .share-btn markup on tools and articles) into subtle outline pill
   buttons: paper ground, hairline silver border, ink Hanken label and a
   brass icon, with a brass border + brass-deep label on hover. The share
   URLs, targets (LinkedIn share-offsite + X intent of the current page),
   aria-labels and inline brand icons are untouched - appearance only.
   Scoped to body.v5.parcel and marked !important where needed so it wins
   over the legacy platform-colour fills regardless of stylesheet order.
   ================================================================ */
body.v5.parcel .article-share .article-footer-label{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--slate);font-weight:500}
body.v5.parcel .article-share .share-buttons{display:inline-flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:12px}
body.v5.parcel .article-share .share-btn{display:inline-flex;align-items:center;gap:8px;background:var(--paper) !important;color:var(--ink) !important;border:1.5px solid var(--silver2) !important;border-radius:999px;padding:9px 18px;font-family:"Hanken Grotesk",system-ui,sans-serif;font-weight:600;font-size:13.5px;letter-spacing:.01em;line-height:1;box-shadow:none !important;text-decoration:none;transition:border-color .2s,color .2s,background .2s}
body.v5.parcel .article-share .share-btn svg{width:17px;height:17px;color:var(--brass-deep);transition:color .2s}
body.v5.parcel .article-share .share-btn:hover{background:#FFFFFF !important;border-color:var(--brass) !important;color:var(--brass-deep) !important}
body.v5.parcel .article-share .share-btn:hover svg{color:var(--brass)}
body.v5.parcel .article-share .share-btn:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
/* ================================================================
   PR-15 (2026-07-22): HOMEPAGE HERO STRIP LIFT + CTA INK
   1) The homepage coverage strip (.ticker marquee) is absolutely
      positioned inside the hero (bottom:132px) just above the two-card
      dock. With the hero fixed at 960px the strip landed ~778px down,
      i.e. just below a ~730-900px first viewport, so it read as below
      the fold on load. The headline block is pinned to top:200px while
      the proof stats, ticker and dock are all anchored to the hero
      bottom, so trimming the desktop hero height lifts the whole bottom
      cluster together (alignment preserved) and pulls the coverage strip
      up into the first viewport. Desktop only (min-width:768px); the
      mobile hero (height:auto, static flow) is untouched, so the mobile
      strip position and marquee are unchanged.
   2) Lock the brass nav CTA label to the brand ink (#14181B) so the
      "Get in touch" CTA stays crisp ink on the brass on the homepage.
   Scoped, additive, reversible. No markup or copy change.
   ================================================================ */
@media (min-width:768px){
  body.v5.parcel .hero{height:800px}
}
body.v5.parcel .nav .cta{color:#14181B}
body.v5.parcel .nav .cta:hover{color:#14181B}

/* ================================================================
   PR-16 (2026-07-22): NAV "Get in touch" CTA label -> WHITE
   Owner now prefers the brass nav "Get in touch" CTA to carry a white
   label instead of ink. This supersedes the PR-15 ink rule directly
   above via source order (same selector, later in this last-loaded
   sheet), so the label renders white on the brass CTA on every page,
   including the static /insights templates that load only styles.min.css
   + this override (no parcel-theme.css). The brass background and the
   brass/sand hover are unchanged. Desktop nav CTA + mobile-menu CTA.
   ================================================================ */
body.v5.parcel .nav .cta{color:#FBFCFE}
body.v5.parcel .nav .cta:hover{color:#FBFCFE}
body.v5.parcel .nav .mobmenu .mm-cta,
body.v5.parcel .nav .mobmenu .mm-cta:hover{color:#FBFCFE}

/* ================================================================
   PR-17 (2026-07-22): /insights ARTICLE BODY -> Parcel article look (frame 09)
   The /insights/:slug pages already carried the Parcel nav + footer, but
   the article BODY still used the old design (measure, rhythm, quote,
   table and intro styling). This is a CSS-only reskin of the shared
   article body classes and the elements article.content renders, to the
   Parcel article design: Playfair headings with brass section rules,
   Hanken body on a comfortable ~750px reading measure, IBM Plex Mono
   eyebrows/data, an answer/summary intro box (the "atom"), a contents
   card, styled blockquotes, brass-marked lists, sourced tables that stay
   horizontally scrollable on mobile, figures and a byline/crumb. It lives
   in this last-loaded, universally-included sheet so it reaches BOTH the
   dynamic article.ejs pages (which also load parcel-theme.css) and the
   static /insights templates (which do not). No markup, copy, headings,
   meta, canonical or JSON-LD change. Scoped to body.v5.parcel; where a
   legacy styles.min.css rule shares the selector, !important is used so
   the Parcel look wins regardless of source order.
   ================================================================ */

/* -- Page ground + header (crumb, eyebrow, title, byline) -- */
body.v5.parcel .article-page{background:var(--paper);color:var(--ink)}
body.v5.parcel .article-header{padding:132px 24px 0 !important;text-align:left}
body.v5.parcel .article-header-container{max-width:750px !important;margin:0 auto !important;text-align:left}
body.v5.parcel .article-breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 22px;font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--slate)}
body.v5.parcel .article-breadcrumb a{color:var(--slate);text-decoration:none}
body.v5.parcel .article-breadcrumb a:hover{color:var(--brass-deep)}
body.v5.parcel .article-breadcrumb .breadcrumb-separator{color:var(--brass)}
body.v5.parcel .article-breadcrumb .breadcrumb-current{color:var(--brass-deep)}
body.v5.parcel .article-category-badge{display:inline-block;margin:0 0 14px;padding:0 !important;background:transparent !important;border:0 !important;border-radius:0 !important;font-family:"IBM Plex Mono",monospace;font-size:11px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--brass-deep) !important}
body.v5.parcel .article-title{font-family:"Playfair Display",Georgia,serif;font-weight:700;font-size:clamp(33px,4.9vw,52px);line-height:1.08;letter-spacing:-.01em;color:var(--ink);margin:0 0 20px}
body.v5.parcel .article-meta-header{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin:0;padding:0 0 22px;border-bottom:1px solid var(--line);font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--slate)}
body.v5.parcel .article-reading-time{display:inline-flex;align-items:center;gap:6px}

/* -- Byline strip -- */
body.v5.parcel .article-author-strip{max-width:750px;margin:22px auto 0;padding:0 24px;display:flex;align-items:center;gap:14px}
body.v5.parcel .author-strip-avatar{flex:none;width:44px;height:44px;border-radius:50%;background:var(--ink);color:var(--sand);display:flex;align-items:center;justify-content:center;font-family:"Playfair Display",Georgia,serif;font-weight:700;font-size:15px;letter-spacing:.04em}
body.v5.parcel .author-strip-text{display:flex;flex-direction:column;gap:2px}
body.v5.parcel .author-strip-name{font-family:"Hanken Grotesk",sans-serif;font-weight:700;font-size:14px;color:var(--ink)}
body.v5.parcel .author-strip-tagline{font-family:"IBM Plex Mono",monospace;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--slate)}

/* -- Body container + reading measure -- */
body.v5.parcel .article-body-container{max-width:750px !important;margin:0 auto !important;padding:0 24px 76px}
body.v5.parcel .article-content{max-width:none !important;margin:0;font-family:"Hanken Grotesk",system-ui,sans-serif;font-size:18px;line-height:1.75;color:#252B31}
body.v5.parcel .article-content > p{font-size:18px;line-height:1.78;margin:0 0 22px}
body.v5.parcel .article-content strong{color:var(--ink);font-weight:700}
body.v5.parcel .article-content em{font-style:italic}
body.v5.parcel .article-content a:not(.btn){color:var(--brass-deep) !important;text-decoration:underline;text-decoration-color:rgba(168,139,92,.4);text-underline-offset:3px}
body.v5.parcel .article-content a:not(.btn):hover{color:var(--brass) !important;text-decoration-color:var(--brass)}

/* -- Headings: Playfair, brass section rule on h2 -- */
body.v5.parcel .article-content h2{font-family:"Playfair Display",Georgia,serif;font-weight:700;font-size:clamp(26px,3.4vw,34px);line-height:1.18;color:var(--ink);margin:50px 0 16px;padding-top:24px;border-top:1px solid var(--line)}
body.v5.parcel .article-content h3{font-family:"Playfair Display",Georgia,serif;font-weight:600;font-size:22px;line-height:1.28;color:var(--ink);margin:34px 0 12px}
body.v5.parcel .article-content h4{font-family:"Hanken Grotesk",sans-serif;font-weight:700;font-size:15px;letter-spacing:.02em;text-transform:uppercase;color:var(--brass-deep);margin:28px 0 10px}

/* -- Answer / summary intro box (the "atom") -- */
body.v5.parcel .article-content .lead-paragraph,
body.v5.parcel .article-content .article-intro{position:relative;margin:0 0 32px !important;padding:24px 26px !important;background:var(--cool) !important;border:1px solid var(--line) !important;border-left:3px solid var(--brass) !important;border-radius:4px !important;font-family:"Hanken Grotesk",sans-serif;font-size:19px;line-height:1.62;font-weight:500;color:var(--ink)}
body.v5.parcel .article-content .article-intro > p{margin:0 0 12px;font-size:19px;line-height:1.62}
body.v5.parcel .article-content .article-intro > p:last-child{margin-bottom:0}

/* -- Lists: brass squares / mono numerals (TOC list excluded) -- */
body.v5.parcel .article-content ul:not(.article-toc-list),
body.v5.parcel .article-content ol:not(.article-toc-list){margin:0 0 24px !important;padding-left:0 !important;list-style:none !important}
body.v5.parcel .article-content ul:not(.article-toc-list) > li,
body.v5.parcel .article-content ol:not(.article-toc-list) > li{position:relative;padding-left:28px;margin:0 0 11px;line-height:1.7}
body.v5.parcel .article-content ul:not(.article-toc-list) > li::before{content:"";position:absolute;left:3px;top:11px;width:7px;height:7px;background:var(--brass)}
body.v5.parcel .article-content ol:not(.article-toc-list){counter-reset:sat-li}
body.v5.parcel .article-content ol:not(.article-toc-list) > li{counter-increment:sat-li}
body.v5.parcel .article-content ol:not(.article-toc-list) > li::before{content:counter(sat-li);position:absolute;left:0;top:1px;font-family:"IBM Plex Mono",monospace;font-size:13px;font-weight:600;color:var(--brass-deep)}

/* -- Contents card (.article-toc lives at the top of the flow) -- */
body.v5.parcel .article-content .article-toc{margin:0 0 34px !important;padding:20px 22px !important;background:#fff !important;border:1px solid var(--silver) !important;border-radius:8px !important}
body.v5.parcel .article-content .article-toc-toggle{display:flex;justify-content:space-between;align-items:center;width:100%;padding:0;background:none;border:0;cursor:pointer}
body.v5.parcel .article-content .article-toc-title{font-family:"IBM Plex Mono",monospace;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--brass-deep)}
body.v5.parcel .article-content .article-toc-chevron{color:var(--brass)}
body.v5.parcel .article-content .article-toc-list{margin:14px 0 0;padding:0;list-style:none;counter-reset:none}
body.v5.parcel .article-content .article-toc-list li{position:static;margin:0 0 9px;padding-left:0}
body.v5.parcel .article-content .article-toc-list li::before{content:none}
body.v5.parcel .article-content .article-toc-list a{font-family:"Hanken Grotesk",sans-serif;font-size:14.5px;line-height:1.4;color:var(--slate);text-decoration:none}
body.v5.parcel .article-content .article-toc-list a:hover{color:var(--brass-deep)}

/* -- Blockquote / pull-quote -- */
body.v5.parcel .article-content blockquote{margin:32px 0;padding:4px 0 4px 26px;border-left:3px solid var(--brass);font-family:"Playfair Display",Georgia,serif;font-style:italic;font-weight:500;font-size:24px;line-height:1.4;color:var(--ink)}
body.v5.parcel .article-content blockquote p{margin:0 0 10px;font-size:inherit;line-height:inherit;color:inherit}
body.v5.parcel .article-content blockquote p:last-child{margin-bottom:0}
body.v5.parcel .article-content blockquote cite{display:block;margin-top:12px;font-family:"IBM Plex Mono",monospace;font-style:normal;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--slate)}

/* -- Tables: sourced-table look; stay scrollable when wider than the measure -- */
body.v5.parcel .article-content table{display:block;width:max-content;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;border-collapse:collapse;margin:28px 0;font-family:"Hanken Grotesk",sans-serif;font-size:15px}
body.v5.parcel .article-content th,
body.v5.parcel .article-content td{padding:12px 16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--silver)}
body.v5.parcel .article-content thead th{font-family:"IBM Plex Mono",monospace;font-size:10.5px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--slate);white-space:nowrap;background:var(--cool);border-bottom:1.5px solid var(--brass)}
body.v5.parcel .article-content tbody tr:last-child td{border-bottom:none}

/* -- Figures, images, code -- */
body.v5.parcel .article-content figure{margin:30px 0}
body.v5.parcel .article-content img{max-width:100%;height:auto;display:block;border-radius:6px}
body.v5.parcel .article-content figcaption{margin-top:10px;font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.06em;color:var(--slate);text-align:center}
body.v5.parcel .article-content code{font-family:"IBM Plex Mono",monospace;font-size:.9em;background:var(--cool);padding:2px 6px;border-radius:4px;color:var(--brass-deep)}

/* -- Footer: tags -- */
body.v5.parcel .article-footer{margin-top:44px;padding-top:28px;border-top:1px solid var(--line)}
body.v5.parcel .article-footer .article-footer-label{font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;font-weight:500;color:var(--slate)}
body.v5.parcel .article-tags .tag{display:inline-block;margin:8px 8px 0 0;padding:6px 12px;background:var(--cool);border:1px solid var(--silver);border-radius:999px;font-family:"Hanken Grotesk",sans-serif;font-size:12.5px;color:var(--slate)}

/* -- Mobile: narrower gutters, slightly smaller body -- */
@media (max-width:767px){
  body.v5.parcel .article-header{padding:96px 20px 0 !important}
  body.v5.parcel .article-body-container{padding:0 20px 60px}
  body.v5.parcel .article-author-strip{padding:0 20px}
  body.v5.parcel .article-content{font-size:16.5px}
  body.v5.parcel .article-content > p{font-size:16.5px}
  body.v5.parcel .article-content .lead-paragraph,
  body.v5.parcel .article-content .article-intro{font-size:16.5px;padding-left:18px !important;padding-right:18px !important}
  body.v5.parcel .article-content .article-intro > p{font-size:16.5px}
}