";inherits:false;initial-value:0deg}
.card::before,a.tile::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;pointer-events:none;background:conic-gradient(from var(--fx-a),transparent 0 70%,rgba(224,190,106,.95) 82%,transparent 94%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity 350ms ease}
@keyframes fxSweep{to{--fx-a:360deg}}
@media (hover:hover) and (pointer:fine){
.card:hover,a.tile:hover{border-color:rgba(201,162,75,.65)}
.card:hover::after,.card:hover::before,a.tile:hover::after,a.tile:hover::before{opacity:1}
}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
.card:hover::before,a.tile:hover::before{animation:fxSweep 2.4s linear infinite}
}
/* ---------- scroll-in reveals: .fx-on (fx.js) plays a short rise as an element scrolls in. Nothing is hidden at rest:
the rise only starts transparent (backwards fill) and ends fully visible, so a failed script leaves content readable. */
@keyframes fxUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@keyframes fxBar{from{transform:scaleX(.02)}to{transform:scaleX(1)}}
@media (prefers-reduced-motion:no-preference){
.fx-on{animation:fxUp 700ms cubic-bezier(0.23,1,0.32,1) backwards;animation-delay:calc(var(--fx-i,0) * 70ms)}
.barred.fx-on::after,.fx-on .barred::after{transform-origin:left center;animation:fxBar 800ms cubic-bezier(0.23,1,0.32,1) 300ms backwards}
}
/* ---------- buttons: a press, and a gold lift on hover ---------- */
.btn{transition:transform 160ms cubic-bezier(0.23,1,0.32,1),box-shadow 200ms ease,background-color 180ms ease,border-color 180ms ease,color 180ms ease}
.btn:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){
.btn.primary:hover{box-shadow:0 14px 34px -10px rgba(201,162,75,.7)}
}
/* ---------- page entrance ---------- */
/* Fades start at .01, not 0: browsers skip fully transparent first paints when picking the Largest Contentful Paint. */
@media (prefers-reduced-motion:no-preference){
#root>*{animation:fxPage 260ms ease both}
}
/* html.fx-pre (assets/app-start.js): the pre-rendered page is already on screen, so it does not fade in again */
.fx-pre #root>*,.fx-pre .rise{animation:none}
@keyframes fxPage{0%{opacity:.01}100%{opacity:1}}
/* ---------- phones and touch screens: no cursor glow, softer orbs ---------- */
@media (hover:none),(max-width:760px){#fx-cursor{display:none}#fx-bg .orb{filter:blur(60px);opacity:.3}}
@media (prefers-reduced-motion:reduce){#fx-bg canvas,#fx-bg .grain,#fx-cursor{display:none}}
/* ---------- Moyasar form on either ground ---------- */
div#mysr{color:var(--cream)!important;font-family:var(--f-display)}
div#mysr>div{max-width:none!important;color:var(--cream)!important}
div#mysr .text-black\/90,div#mysr .text-neutral-800\/90,div#mysr .text-xs.font-medium{color:var(--cream-dim)!important}
div#mysr .flex.items-end.justify-between{letter-spacing:.12em;text-transform:uppercase;font-size:.66rem;color:var(--cream-dim)!important}
div#mysr input{background:var(--ink-900)!important;color:var(--cream)!important;box-shadow:0 0 0 1px var(--ink-600)!important;font-family:var(--f-edit);font-size:1rem!important}
div#mysr input:focus{box-shadow:0 0 0 1px var(--gold),0 0 0 4px rgba(201,162,75,.15)!important}
div#mysr input::placeholder{color:var(--fieldph)!important;opacity:1!important;font-style:italic}
div#mysr input{color:var(--fieldtx)!important;-webkit-text-fill-color:var(--fieldtx);font-weight:500}
div#mysr button.bg-primary{background:var(--gold)!important;color:var(--ongold)!important;font-weight:700;letter-spacing:.08em;text-transform:uppercase;border-radius:var(--radius)!important;transition:background .18s,box-shadow .3s}
div#mysr button.bg-primary:hover{background:var(--gold-hi)!important;box-shadow:0 14px 34px -10px rgba(224,190,106,.75)}
div#mysr button.bg-stc{border-radius:var(--radius)!important}
div#mysr hr,div#mysr .border{border-color:var(--line)!important}
div#mysr .text-red-600,div#mysr .text-error{color:var(--bad)!important}
div#mysr .bg-red-100{background:rgba(196,106,90,.12)!important}
div#mysr img{filter:none}
/* ---------- grid filler: "and more" card that closes an unfinished row ---------- */
.fx-fill{position:relative;overflow:hidden;display:grid;gap:var(--s2);align-content:end;padding:var(--s5);min-height:100%;isolation:isolate;animation:fxFillIn .9s cubic-bezier(.2,.7,.2,1) both}
.fx-fill-tile{background:
radial-gradient(120% 90% at 100% 0%,rgba(201,162,75,.12),transparent 60%),
repeating-linear-gradient(135deg,rgba(237,232,220,.028) 0 1px,transparent 1px 14px),
var(--ink-900)}
.fx-fill-card{background:
radial-gradient(120% 90% at 100% 0%,rgba(201,162,75,.1),transparent 60%),
repeating-linear-gradient(135deg,rgba(237,232,220,.028) 0 1px,transparent 1px 14px),
var(--ink-800);border:1px dashed var(--line-gold);border-radius:var(--radius)}
.fx-fill .micro{color:var(--goldtx)}
.fx-fill h3{color:var(--cream)}
.fx-fill .q{font-style:italic;color:var(--cream-dim);max-width:44ch;margin:0}
.fx-fill-link{display:inline-flex;align-items:center;gap:8px;justify-self:start;margin-top:var(--s2);text-decoration:none}
.fx-fill:hover .fx-fill-link:after{transform:translate(4px)}
.fx-fill:hover .fx-fill-art i{border-color:rgba(224,190,106,.45)}
/* wide filler: copy left, orbit art right */
.fx-fill-wide{padding-right:calc(var(--s5) + 220px)}
.fx-fill-art{position:absolute;z-index:-1;right:-40px;top:50%;width:260px;height:260px;transform:translateY(-50%);pointer-events:none}
.fx-fill:not(.fx-fill-wide) .fx-fill-art{right:-90px;top:-60px;transform:none;opacity:.55}
.fx-fill-art i{position:absolute;inset:0;border:1px solid rgba(201,162,75,.22);border-radius:50%;transition:border-color .3s}
.fx-fill-art i:nth-child(2){inset:40px;border-style:dashed;animation:fxSpin 38s linear infinite}
.fx-fill-art i:nth-child(3){inset:88px;background:radial-gradient(circle,rgba(224,190,106,.35),transparent 70%);border-color:rgba(224,190,106,.4)}
.fx-fill-art i:nth-child(1)::after,.fx-fill-art i:nth-child(2)::after{content:"";position:absolute;width:6px;height:6px;border-radius:50%;background:var(--gold-hi);box-shadow:0 0 12px var(--gold-hi);top:-3px;left:calc(50% - 3px)}
.fx-fill-art i:nth-child(1){animation:fxSpin 24s linear infinite reverse}
@keyframes fxSpin{to{transform:rotate(360deg)}}
@keyframes fxFillIn{from{opacity:0;transform:translate3d(0,18px,0)}to{opacity:1;transform:none}}
@media (max-width:760px){.fx-fill-wide{padding-right:var(--s5)}.fx-fill-wide .fx-fill-art{opacity:.4}}
@media (prefers-reduced-motion:reduce){.fx-fill,.fx-fill-art i{animation:none}}
/* ---------- footer: Verified business block (SBC seal) ---------- */
/* Saudi Business Center seal: do not move, lazy-load or remove these hosts.
Card markup and look as before. The seal iframe itself is not inside the card: seal.js appends it to once and
it is never moved (a moved iframe reloads); assets/sbc-seal.js sets --sbc-left/--sbc-top so it sits in .sbc-slot. */
.footer .sbc-block{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.footer .sbc-label{font-family:Archivo,var(--f-display),sans-serif;font-weight:600;font-size:11px;letter-spacing:.32em;text-transform:uppercase;color:#C9A24B}
.footer .sbc-card{display:inline-block;background:#EDE8DC;border:1px solid #C9A24B;border-radius:2px;padding:12px;line-height:0}
.footer .sbc-slot{position:relative;width:130px;height:44px}
.footer .sbc-verify-seal{position:absolute;inset:0}
/* the seal iframe grows to show its verification card on hover; sbc-seal.js anchors it to the slot's bottom so it opens upward over the footer */
iframe.sbc-seal-frame{position:absolute !important;top:var(--sbc-top,0px) !important;left:var(--sbc-left,0px) !important;right:auto !important;bottom:auto !important;max-width:none !important;transition:filter .2s ease !important;z-index:60 !important;display:block;border:0;background:transparent;color-scheme:light;filter:grayscale(1) sepia(.45) contrast(1.08) brightness(.98)}
iframe.sbc-seal-frame:hover{filter:none}
/* until placed over a footer card (or with no card on screen) it is not shown, so it never floats */
iframe.sbc-seal-frame:not(.sbc-placed),.sbc-fallback-on iframe.sbc-seal-frame{visibility:hidden}
.footer .sbc-cr{font-family:Spectral,var(--f-serif,serif),serif;font-size:14px;color:#A8A296;margin:0;line-height:1.5}
/* Fallback in the seal's place (same slot, same card) if the seal has not loaded after 5 s */
.sbc-fallback{display:flex;visibility:hidden;position:absolute;top:var(--sbc-top,0px);left:var(--sbc-left,0px);z-index:60;width:130px;height:44px;box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;gap:1px;text-align:center;text-decoration:none;font-family:Archivo,var(--f-display),sans-serif;line-height:1.15;color:#19191C}
.sbc-fallback-on .sbc-fallback.sbc-placed{visibility:visible}
.sbc-fallback .sbc-fb-label{font-size:9px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#5E594F}
.sbc-fallback .sbc-fb-no{font-size:14px;font-weight:700;letter-spacing:.04em}
.sbc-fallback .sbc-fb-verify{font-size:9px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#A07F33}
.sbc-fallback:hover .sbc-fb-verify,.sbc-fallback:focus-visible .sbc-fb-verify{color:#19191C;text-decoration:underline}
.sbc-fallback:focus-visible{outline:2px solid #C9A24B;outline-offset:3px}
/* ↗ and © are interface glyphs here: text form only, never colour emoji (U+FE0E follows each in the markup) */
.sbc-fallback,.sbc-fallback .sbc-fb-verify,.micro{font-variant-emoji:text}
/* ---------- form fields: typed text, example text and labels on either ground ---------- */
.input,select.input,textarea.input{color:var(--fieldtx);-webkit-text-fill-color:var(--fieldtx);caret-color:var(--goldtx-hi);font-weight:500;background-color:var(--ink-800);border-color:var(--fieldline)}
.input:hover{border-color:var(--fieldline-hi)}
.input:focus{border-color:var(--gold);background-color:var(--ink-900);box-shadow:0 0 0 3px rgba(201,162,75,.15)}
.input::placeholder{color:var(--fieldph);-webkit-text-fill-color:var(--fieldph);opacity:1;font-weight:400;font-style:italic}
.input::-webkit-input-placeholder{color:var(--fieldph);opacity:1}
.input::-moz-placeholder{color:var(--fieldph);opacity:1}
select.input option{background:var(--ink-800);color:var(--fieldtx)}
.input:disabled,.input[readonly]{color:var(--cream-dim);-webkit-text-fill-color:var(--cream-dim);opacity:1}
.input:-webkit-autofill,.input:-webkit-autofill:hover,.input:-webkit-autofill:focus{-webkit-text-fill-color:var(--fieldtx);-webkit-box-shadow:0 0 0 1000px var(--ink-800) inset;caret-color:var(--goldtx-hi);transition:background-color 9999s ease-in-out 0s}
.field label,label{color:var(--labeltx)}
/* ---------- fit every screen: no sideways scroll ---------- */
/* keep phones from auto-inflating text, and never let a wide element push the page sideways */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
html,body{overflow-x:clip}
/* phones and small tablets: headline, eyebrow and long words wrap inside the screen */
@media(max-width:600px){
.hero h1{overflow-wrap:break-word}
h1,h2,h3,.lede,.prose,p{overflow-wrap:break-word}
.hero .row .btn{flex:1 1 auto;justify-content:center;text-align:center}
}
/* "Continue with Google" and the thin "or" divider above the email sign-in field
(sign-in page, checkout, free-product gates). Outlined, cream text, square 2px corners. */
.oauth{display:grid;gap:var(--s4)}
.btn-google{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;padding:13px 18px;border:1px solid var(--cream-dim);border-radius:2px;background:transparent;color:var(--cream);font-family:var(--f-display);font-weight:600;font-size:.82rem;letter-spacing:.04em;line-height:1;cursor:pointer;transition:border-color .18s,background-color .18s}
.btn-google svg{flex:none;display:block}
.btn-google:hover{border-color:var(--cream);background:rgba(237,232,220,.04)}
.btn-google:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.btn-google:disabled{opacity:.6;cursor:progress}
.or-rule{display:flex;align-items:center;gap:var(--s3);color:var(--cream-faint);font-family:var(--f-display);font-size:.66rem;font-weight:600;letter-spacing:.24em;text-transform:uppercase}
.or-rule:before,.or-rule:after{content:"";flex:1;height:1px;background:var(--line)}
/* v2 pages (Home, Engagements, Network, Co-Advisors, House Briefs, Intelligence, About): the few pieces the app's
stylesheet has no class for. Everything else on those pages uses the app's own classes (card, btn, sec-head …). */
.v2 .hero h1:not(:where(.eyebrow,.eb)),.v2 .hero p:where(.h1){font-size:clamp(2.6rem,8vw,5rem);line-height:.95}
.v2 .hero .lede em{font-style:italic;color:var(--cream)}
.v2 .row{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:center}
.v2-trust{display:flex;flex-wrap:wrap;gap:var(--s3) var(--s6);margin-top:var(--s6);padding-top:var(--s5);border-top:1px solid var(--line);font-family:var(--f-display);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--cream-dim)}
.v2-trust b{color:var(--goldtx);font-weight:700}
.v2 .card{display:grid;gap:var(--s3);align-content:start}
.v2 .card .cta{display:flex;flex-wrap:wrap;gap:var(--s3) var(--s5);align-items:center;margin-top:auto;padding-top:var(--s2)}
.v2 .card>.badge{justify-self:start}
.v2-door{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(220px,1fr);gap:var(--s6);align-items:center;border:1px solid var(--gold);background:var(--ink-800);padding:var(--s6);border-radius:var(--radius)}
.v2-door .end{text-align:right;display:grid;gap:var(--s4);justify-items:end}
.v2-door h3{font-size:1.3rem;margin-top:var(--s2)}
.v2-door p{color:var(--cream-dim);margin-top:var(--s2)}
.v2-price{font-family:var(--f-display);font-weight:800;font-size:1.5rem;color:var(--goldtx);line-height:1.1}
.v2-price small{display:block;font-weight:500;font-size:.66rem;letter-spacing:.08em;color:var(--cream-faint);margin-top:4px;text-transform:uppercase}
.v2-eng .for{font-family:var(--f-display);font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--cream-faint)}
.v2-eng ul{margin:0;padding-left:1.1em;color:var(--cream-dim);font-size:.95rem;display:grid;gap:4px}
.v2-eng .meta{display:flex;justify-content:space-between;gap:var(--s4);flex-wrap:wrap;border-top:1px solid var(--line);padding-top:var(--s3);align-items:baseline}
.v2-eng .meta .t{font-family:var(--f-display);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cream-dim)}
.v2-eng .meta .p{font-family:var(--f-display);font-weight:700;color:var(--goldtx);text-align:right}
.v2-eng .meta .p small{display:block;font-weight:500;font-size:.62rem;letter-spacing:.06em;color:var(--cream-faint)}
.v2-pair{display:grid;grid-template-columns:1fr 1fr;gap:var(--s6);margin-top:var(--s7);border-top:1px solid var(--line);padding-top:var(--s6)}
.v2-pair h4{font-family:var(--f-display);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--goldtx);margin-bottom:var(--s2)}
.v2-pair p{color:var(--cream-dim);font-size:.95rem}
.v2 .note{margin-top:var(--s5);font-family:var(--f-display);font-size:.64rem;letter-spacing:.12em;text-transform:uppercase;color:var(--cream-faint)}
.v2-watch{border:1px solid var(--line);border-radius:var(--radius)}
.v2-watch .wi{display:grid;grid-template-columns:auto 1fr auto;gap:var(--s4);align-items:center;padding:var(--s4) var(--s5);border-bottom:1px solid var(--line);background:var(--ink-800)}
.v2-watch .wi:last-child{border-bottom:0}
.v2-watch .no{font-family:var(--f-display);font-weight:700;font-size:.72rem;color:var(--goldtx)}
.v2-watch .tx{font-size:.98rem}
.v2-watch .tx span{display:block;color:var(--cream-faint);font-size:.68rem;font-family:var(--f-display);letter-spacing:.08em;text-transform:uppercase;margin-top:2px}
.v2-watch button.pill{cursor:pointer;background:none}
.v2-watch button.pill[disabled]{cursor:default;opacity:.7}
.v2-method{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s3)}
.v2-method div{border:1px solid var(--line);padding:var(--s5);background:var(--ink-800);border-radius:var(--radius)}
.v2-method b{font-family:var(--f-display);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--goldtx);display:block;margin-bottom:6px}
.v2-method span{font-size:.9rem;color:var(--cream-dim)}
.v2-stats .stat b{font-family:var(--f-display);font-weight:800;font-size:2rem;color:var(--goldtx);line-height:1}
.v2-about p{color:var(--cream-dim);max-width:68ch}
.v2-about p+p{margin-top:var(--s4)}
.v2-caps .tile{cursor:pointer;text-align:left;border:0;font:inherit;color:inherit}
.v2-caps .tile:hover,.v2-caps .tile:focus-visible{background:var(--ink-800);outline:1px solid var(--gold)}
.v2-caps .tile b{font-family:var(--f-display);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase}
.v2-caps .tile span{font-size:.84rem;color:var(--cream-faint)}
.v2 form.form{margin-top:var(--s2)}
.v2 .check{display:flex;gap:var(--s2);align-items:flex-start;font-size:.9rem;color:var(--cream-dim)}
.v2 .check input{margin-top:5px}
.v2 .v2-ok{border-left:3px solid var(--gold);background:var(--ink-800);padding:var(--s4);color:var(--cream-dim)}
.v2 .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.v2 .error{color:var(--bad)}
.v2 .sec-gap{margin-top:var(--s7)}
/* Arabic (RTL) toggle: placeholders marked AR until the House supplies the text. */
.lang-toggle{font-family:var(--f-display);font-size:.7rem;letter-spacing:.1em;border:1px solid var(--line-gold);color:var(--cream-dim);padding:6px 12px;border-radius:var(--radius);background:none;cursor:pointer;justify-self:start}
.lang-toggle:hover{color:var(--goldtx);border-color:var(--gold)}
.ar-ph{display:none;border:1px dashed var(--line-gold);padding:var(--s3) var(--s4);color:var(--cream-faint);font-family:var(--f-display);font-size:.8rem;letter-spacing:.06em}
.ar-ph:before{content:"AR · ";color:var(--goldtx)}
html.lang-ar .v2-i18n{direction:rtl;text-align:right}
html.lang-ar .v2-i18n .ar-ph{display:block}
html.lang-ar .v2-i18n [data-en]{display:none}
html.lang-ar .v2-i18n .v2-door .end{text-align:left;justify-items:start}
.verified{border-color:var(--ok);color:var(--ok)}
@media(max-width:820px){
.v2-door,.v2-pair,.v2-method{grid-template-columns:1fr}
.v2-door .end{text-align:left;justify-items:start}
.v2-watch .wi{grid-template-columns:auto 1fr;padding:var(--s3) var(--s4)}
.v2-watch .wi .pill{grid-column:2;justify-self:start}
}
/* The app renders a v2 page as several sibling blocks, so section rules come from here rather than .section+.section. */
.v2 .section{border-top:1px solid var(--line)}
.v2 .section.flush{border-top:0;padding-top:0}
.v2>[data-v2part],.v2>[data-v2slot]{display:contents}
/* Engagements cards: 1 column, 2 from 900px (never 4). Cards stretch to the row height; meta and button sit at the bottom. */
.v2-eng.grid-2{grid-template-columns:minmax(0,1fr);gap:var(--s4);align-items:stretch}
@media(min-width:900px){.v2-eng.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}}
.v2-eng .card{display:flex;flex-direction:column;gap:var(--s3);min-width:0;width:auto;overflow:visible;white-space:normal;overflow-wrap:anywhere}
.v2-eng .card.flag{border:1px solid var(--gold)}
.v2-eng .card>.badge{align-self:flex-start}
.v2-eng ul{list-style:none;padding:0;margin:0;display:block}
.v2-eng li{padding:6px 0;border-bottom:1px solid var(--line);font-size:.92rem;line-height:1.5;color:var(--cream-dim)}
.v2-eng li::before{content:"— ";color:var(--goldtx)}
.v2-eng .meta{margin-top:auto;border-top:0;padding-top:var(--s2);flex-wrap:nowrap;align-items:flex-end}
.v2-eng .meta .t{flex:0 0 auto;max-width:45%}
.v2-eng .meta .p{flex:1 1 auto;min-width:0;text-align:right;font-size:1.1rem;line-height:1.25}
.v2-eng .card .cta{margin-top:var(--s2);padding-top:0}
/* Footer (matches the v2 reference): one hairline, rail · brand + three link columns · copyright line. */
.footer{margin-top:0;padding-block:var(--s6) var(--s5);border-top:1px solid var(--line)}
.footer .frail{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--s2) var(--s4);padding:var(--s4) var(--s5);border:1px solid var(--line);background:var(--ink-800)}
.footer .frail .gold{color:var(--goldtx)}
.footer .frail .ar{font-size:.8rem;letter-spacing:0;text-transform:none}
.footer .cols{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(max-content,1fr));gap:var(--s6);margin-top:var(--s6);align-items:start}
.footer .fcol{display:block;min-width:0}
.footer .fcol h5{font-family:var(--f-display);font-weight:600;font-size:.62rem;line-height:1.4;letter-spacing:.2em;text-transform:uppercase;color:var(--goldtx);margin:0 0 var(--s3)}
.footer .fcol a{padding:0;margin:0 0 8px;line-height:1.4;font-size:.95rem;white-space:nowrap;color:var(--cream-dim)}
.footer .fcol a:hover{color:var(--goldtx)}
.footer .fbrand{display:flex;flex-direction:column;align-items:flex-start;gap:0;min-width:0}
.footer .fbrand .ftag{margin:var(--s3) 0 0;max-width:34ch;font-size:.9rem;line-height:1.5;color:var(--cream-dim)}
.footer .fbrand .ar-mark{margin:4px 0 0;text-align:left;font-size:1rem;line-height:1.5;color:var(--cream-dim)}
.footer .sbc-block{margin-top:var(--s5)}
.footer .bottom{display:block;margin:var(--s6) 0 0;padding:0;border:0}
@media(max-width:899px){
.footer .cols{grid-template-columns:repeat(3,minmax(max-content,1fr))}
.footer .fbrand{grid-column:1/-1}
}
@media(max-width:600px){
.footer .frail{flex-direction:column;align-items:flex-start;padding:var(--s3) var(--s4)}
.footer .cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s5) var(--s4)}
}
/* Staff access (verified @shahinsconsultancy.com accounts): header pill; the Early access bar stays hidden even before the app mounts. */
.nav .staff-pill{font-size:.58rem;padding:3px 9px;white-space:nowrap;border-color:var(--line-gold);color:var(--goldtx)}
html.staff-access .demo-bar{display:none}
/* ---------- phones and touch screens: tap targets and minimum text sizes (desktop unchanged) ---------- */
/* Footer links take the 44px tap area from the shared tap-target rule; here they only drop the desktop gap between them.
Labels (Archivo caps) are 12px at least, with tighter tracking so they keep to one line; body copy is 15px at least.
Exempt: the wordmark's CONSULTANCY line, the Saudi Business Center seal block and the Moyasar payment form. */
@media (max-width:760px),(pointer:coarse){
body{min-height:100dvh}
.footer .fcol a{margin:0}
.badge,.tags .tag,.tag,.btn.sm,.btn,.pill,.label,.link,.toast,th,.kv dt,.kpi .label,.field label,.route-chips,.or-rule,
.nav .links,.nav .burger,.nav .staff-pill,.demo-bar,.doc-foot,.msg .who,.side-nav a,.side-nav .cnt,.wizard-nav span,
.atabs button,.atabs button .num,.chips .tag .n,.card .price small,.sec-head .kicker .n,.step:before,.hist .col .x,
.footer .fcol h5,.lang-toggle,.v2 .note,.v2-price small,.v2-watch .tx span,.v2-watch .no,.v2-eng .for,.v2-eng .meta .t,
.v2-eng .meta .p small,.v2-trust,.v2-method b,.v2-caps .tile b,.v2-pair h4{font-size:12px}
.badge,.tags .tag,.tag,.pill,.btn.sm,.btn,.link,th,.field label,.nav .burger{letter-spacing:.08em}
.micro{font-size:12px;letter-spacing:.1em}
.demo-bar,.demo-bar span{letter-spacing:.03em}
.eyebrow,.hero .eyebrow{font-size:12px;letter-spacing:.18em}
.footer .fcol h5,.v2 .note,.v2-trust,.v2-eng .meta .t{letter-spacing:.1em}
.help,.small,.error,.stat span,.v2 .check,.v2-eng li,.v2-method span,.v2-caps .tile span,.footer .fbrand .ftag{font-size:15px}
}
/* ===================== Home (spine, 13 Oct 2026) =====================
Layout and styles from the reference file (#sec-… sections), scoped to the home page so the app's own .card, .row,
.tile and .bar keep their meaning everywhere else. The page runs full width; each section sets its own .wrap column. */
main .container:has(> [data-v2="home"]){max-width:none;padding:0}
[data-v2="home"]{--hx:cubic-bezier(0.23,1,0.32,1)}
[data-v2="home"] .s{font-family:var(--f-display);font-weight:800;text-transform:uppercase;letter-spacing:-0.01em;line-height:1.04;text-wrap:balance;margin:0;color:var(--cream)}
[data-v2="home"] h2.s{font-size:clamp(1.6rem,3.6vw,2.5rem)}
[data-v2="home"] h2.s::after{content:"";display:block;width:64px;height:4px;margin-top:16px;background:var(--gold)}
[data-v2="home"] h3.s{font-size:1.05rem;font-weight:700;letter-spacing:.04em;line-height:1.2}
[data-v2="home"] .sub{color:var(--cream-dim);margin:0;text-wrap:pretty}
[data-v2="home"] .lead{font-size:1.1875rem;line-height:1.6}
[data-v2="home"] .eb{font-family:var(--f-display);font-weight:600;font-size:.75rem;line-height:1.2;letter-spacing:.3em;text-transform:uppercase;color:var(--goldtx);margin:0}
[data-v2="home"] .meta{font-family:var(--f-display);font-weight:600;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cream-dim)}
[data-v2="home"] .hint{font-size:15px;color:var(--cream-dim);margin:0}
[data-v2="home"] a.tl{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-family:var(--f-display);font-weight:700;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--goldtx)}
[data-v2="home"] .arr{display:inline-block;transition:transform 200ms var(--hx)}
[data-v2="home"] .card{display:block;position:relative;background:var(--ink-800);border:1px solid var(--line);border-radius:2px;padding:24px}
[data-v2="home"] .card>*{position:relative;z-index:1}
[data-v2="home"] .sec{padding-block:96px}
[data-v2="home"] .panel{background:var(--ink-800);border-block:1px solid var(--line)}
[data-v2="home"] .grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
[data-v2="home"] .stack{display:flex;flex-direction:column;align-items:flex-start}
[data-v2="home"] .row{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
[data-v2="home"] .between{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px 64px}
[data-v2="home"] .gbar{width:64px;height:4px;background:var(--gold)}
[data-v2="home"] .lb{margin-bottom:12px}
[data-v2="home"] [hidden]{display:none!important}
@media (hover:hover) and (pointer:fine){[data-v2="home"] a:hover .arr{transform:translateX(3px)}}
/* hero: the dotted Riyadh skyline behind "Decide. Enter. Sell." */
[data-v2="home"] .hero{position:relative;overflow:hidden;padding:0;perspective:none}
[data-v2="home"] .hero::before{display:none}
[data-v2="home"] .hero .cvw{position:absolute;inset:0}
[data-v2="home"] .hcv{display:block;width:100%;height:100%}
[data-v2="home"] .hero .wrap{position:relative;padding-top:96px;padding-bottom:min(44vw,304px)}
[data-v2="home"] .hw{font-size:clamp(2.5rem,8.3vw,5.9rem);line-height:1;letter-spacing:-0.02em;margin:24px 0 0 -0.04em;width:100%;display:flex;flex-wrap:wrap;justify-content:space-between;column-gap:.25em;row-gap:4px;text-shadow:none}
[data-v2="home"] .hw.stack{flex-direction:column;align-items:flex-start}
[data-v2="home"] .blab{position:absolute;left:0;top:0;z-index:2;pointer-events:none;opacity:0;transition:opacity 160ms ease;font-family:var(--f-display);font-weight:700;font-size:.75rem;line-height:1;letter-spacing:.16em;text-transform:uppercase;color:var(--cream);white-space:nowrap;padding:8px 10px;background:var(--ink-800);border:1px solid var(--line);border-bottom:2px solid var(--gold);border-radius:2px}
[data-v2="home"] .blab.show{opacity:1}
/* hero per side (23 Oct 2026): the "Which describes you?" chooser or the member's welcome line, the founding / Founding
Bench line under the buttons and four figures. assets/v2.js keeps every changing line at its tallest version. */
[data-v2="home"] .hchoose{margin-bottom:36px;width:100%}
/* The side chooser (assets/v2.js sideSwitch): the gold eyebrow "Which describes you?" 14px above three words on one
1px line; a 3px gold bar on the line slides to the selected word. No box, separator, background or icon. Home hero:
15px (13px on phones, one line that scrolls sideways); /products, the Score and /network: smaller. */
[data-side-switch]{min-width:0;max-width:100%}
.side-ty{display:flex;flex-direction:column;align-items:flex-start;gap:14px;max-width:100%}
.side-ty .sty-eb{font-family:var(--f-display);font-weight:600;font-size:.75rem;line-height:1.2;letter-spacing:.3em;text-transform:uppercase;color:var(--goldtx)}
.side-ty .sty-w{position:relative;display:flex;flex-wrap:nowrap;gap:24px;max-width:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;box-shadow:inset 0 -1px 0 var(--line)}
.side-ty .sty-w::-webkit-scrollbar{display:none}
.side-ty .sty-o{flex:none;appearance:none;background:none;border:0;padding:0 0 12px;min-height:44px;display:flex;align-items:center;font-family:'Archivo',var(--f-display),Arial,sans-serif;font-weight:700;font-size:12px;line-height:1.2;letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;color:var(--dim);cursor:pointer;transition:color 180ms ease}
.side-ty .sty-o:hover,.side-ty .sty-o:focus-visible,.side-ty .sty-o.on{color:var(--ink)}
.side-ty .sty-o:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.side-ty .sty-bar{position:absolute;left:0;bottom:0;width:0;height:3px;background:var(--gold);pointer-events:none;transition:transform .45s var(--ease),width .45s var(--ease)}
.side-ty .sty-bar.no-tx{transition:none}
.side-ty.is-hero .sty-w{gap:36px}
.side-ty.is-hero .sty-o{font-size:15px}
.side-ty .sty-short{display:none}
@media (max-width:600px){.side-ty .sty-o{font-size:11px}
/* the home hero at phone width: three equal columns that fit the row, short labels, up to two lines each */
.side-ty.is-hero{align-self:stretch;width:100%}
.side-ty.is-hero .sty-w{width:100%;gap:12px;overflow:visible}
.side-ty.is-hero .sty-o{flex:1 1 0;min-width:0;justify-content:center;text-align:center;font-size:12px;letter-spacing:.1em;white-space:normal}
.side-ty.is-hero .sty-full{display:none}.side-ty.is-hero .sty-short{display:inline}}
@media (prefers-reduced-motion:reduce){.side-ty .sty-bar,.side-ty .sty-o{transition:none}}
/* The hero's lines crossfade when the side changes (filter, so the rise animation's opacity is left alone). */
[data-v2="home"] .hero [data-hv]:not(.hchoose){transition:filter 200ms ease}
[data-v2="home"] .hero.h-swap [data-hv]:not(.hchoose){filter:opacity(0)}
@media (prefers-reduced-motion:reduce){[data-v2="home"] .hero [data-hv]{transition:none}}
[data-v2="home"] .btn.is-off{opacity:.45;cursor:not-allowed;pointer-events:none}
[data-v2="home"] .hmem{margin:0;font-family:var(--f-display);font-weight:600;font-size:.8125rem;line-height:1.4;letter-spacing:.14em;text-transform:uppercase;color:var(--goldtx)}
[data-v2="home"] .hslot{margin-top:16px}
[data-v2="home"] .hfr{margin:0;font-family:var(--f-display);font-weight:600;font-size:.75rem;line-height:1.5;letter-spacing:.14em;text-transform:uppercase;color:var(--cream-dim)}
[data-v2="home"] .hfr a{color:inherit;text-decoration:none;border-bottom:1px solid var(--line);transition:color 160ms ease,border-color 160ms ease}
[data-v2="home"] .hfr a:hover{color:var(--goldtx);border-color:currentColor}
[data-v2="home"] .hbf.is-closed,[data-v2="home"][data-side-view="pro"] .hst [data-bench-founding].is-closed{visibility:hidden}
[data-v2="home"] .hst{display:flex;flex-wrap:wrap;gap:16px 44px;margin:28px 0 0}
[data-v2="home"] .hst>div{display:flex;flex-direction:column;gap:6px;min-width:0}
[data-v2="home"] .hst dt{font-family:var(--f-display);font-weight:800;font-size:1.5rem;line-height:1;letter-spacing:-0.01em}
[data-v2="home"] .hst dd{margin:0;font-family:var(--f-display);font-weight:600;font-size:.6875rem;line-height:1.3;letter-spacing:.14em;text-transform:uppercase;color:var(--cream-dim)}
/* Engagements on the Saudi side: Capital-Ready first in the list (data-sa-order), so the first rule moves with it. */
[data-v2="home"][data-side-view="sa"] .g-eng .erow{border-top:1px solid var(--line);padding-top:24px}
[data-v2="home"][data-side-view="sa"] .g-eng .erow[data-sa-order="1"]{border-top:0;padding-top:0}
/* Network on the professional side: the Bench and Talent first, House Match across the row below. */
[data-v2="home"][data-side-view="pro"] .nw-a{grid-row:auto;grid-column:1 / -1;min-height:0}
/* dark band: client strip, 55%, the globe, Vision 2030 figures (ink in both modes) */
[data-v2="home"] .band{border-block:1px solid rgba(237,232,220,.16)}
[data-v2="home"] .band .eb{color:#C9A24B}
[data-v2="home"] .mq{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-image:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent)}
[data-v2="home"] .mq-t{display:flex;width:max-content}
[data-v2="home"] .mq-t a{display:inline-flex;align-items:center;min-height:44px;padding:0 30px;font-family:var(--f-display);font-weight:700;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:#EDE8DC;opacity:.86;white-space:nowrap}
[data-v2="home"] .mq:hover .mq-t,[data-v2="home"] .mq:focus-within .mq-t{animation-play-state:paused}
@keyframes hmq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:no-preference){[data-v2="home"] .mq-t{animation:hmq 52s linear infinite}}
@media (prefers-reduced-motion:reduce){[data-v2="home"] .mq-t{flex-wrap:wrap;width:auto;padding-inline:16px}[data-v2="home"] .mq-t .dup{display:none}[data-v2="home"] .mq{-webkit-mask-image:none;mask-image:none}}
@media (hover:hover) and (pointer:fine){[data-v2="home"] .mq-t a:hover{color:#E0BE6A;opacity:1}}
[data-v2="home"] .led{display:grid;grid-template-columns:minmax(0,4fr) 260px minmax(0,5fr);gap:48px;align-items:end}
[data-v2="home"] .big{font-size:clamp(4.5rem,11vw,8.5rem);line-height:.86;letter-spacing:-0.03em;color:#EDE8DC}
[data-v2="home"] .led-l{margin:20px 0 0;font-size:1.1875rem;line-height:1.5;color:#EDE8DC}
[data-v2="home"] .gl{display:flex;flex-direction:column;align-items:center;gap:14px}
[data-v2="home"] .gcv{display:block;width:260px;height:260px;max-width:100%}
[data-v2="home"] .gl-l{margin:0;font-weight:600;font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;color:#A8A296}
[data-v2="home"] .lrow{display:flex;align-items:baseline;gap:16px;padding:18px 0;border-top:1px solid rgba(237,232,220,.16);font-size:1.1875rem;color:#EDE8DC}
[data-v2="home"] .lrow:last-child{border-bottom:1px solid rgba(237,232,220,.16)}
[data-v2="home"] .lrow i{flex:1 1 auto;min-width:24px;border-bottom:1px dotted rgba(237,232,220,.4);transform:translateY(-5px)}
[data-v2="home"] .lrow .s{font-size:2rem;line-height:1;white-space:nowrap;color:#EDE8DC;text-transform:none}
[data-v2="home"] .led-src{margin:14px 0 0;font-size:.75rem;letter-spacing:.06em;color:#A8A296}
/* Watch List rows: status dot and label, the item, then category and what to do */
[data-v2="home"] .wr{display:grid;grid-template-columns:132px minmax(0,1fr) 24px;gap:24px;align-items:start;padding:22px 12px;margin:0 -12px;border-top:1px solid var(--line);border-radius:2px;color:inherit;transition:background-color 160ms ease,transform 160ms var(--hx)}
[data-v2="home"] .wr:last-child{border-bottom:1px solid var(--line)}
[data-v2="home"] .wr p{margin:0;font-size:18px;line-height:1.45;color:var(--cream)}
[data-v2="home"] .wr small{display:block;margin-top:6px;font-family:var(--f-display);font-size:.8125rem;line-height:1.4;color:var(--cream-dim)}
[data-v2="home"] .wr small b{font-weight:600;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;margin-right:10px}
[data-v2="home"] .wr .arr{justify-self:end;line-height:27px;color:var(--cream-dim)}
[data-v2="home"] a.wr:active{transform:scale(.995)}
@media (hover:hover) and (pointer:fine){[data-v2="home"] a.wr:hover{background:var(--ink-800)}[data-v2="home"] a.wr:hover .arr{color:var(--goldtx)}}
/* Tools: tabs and tiles, each with its own dotted gold drawing */
[data-v2="home"] .tile{display:flex;flex-direction:column;justify-content:space-between;gap:24px;background:var(--ink-900);padding:24px}
[data-v2="home"] .tl-h{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
[data-v2="home"] .tl-h>div{min-width:0}
[data-v2="home"] .tl-d{margin-top:10px;font-size:16px}
[data-v2="home"] .tl-f{gap:12px 16px}
[data-v2="home"] .tl-p{font-size:15px;color:var(--cream-dim)}
[data-v2="home"] .ill{display:block;flex:0 0 auto;width:96px;height:72px}
[data-v2="home"] .ill.ill-s{width:72px;height:54px}
[data-v2="home"] .seats{display:flex;flex-direction:column;gap:10px;max-width:420px}
[data-v2="home"] .seats .meta{margin:0}
[data-v2="home"] .pbar{height:3px;background:var(--ink-700);border-radius:3px;overflow:hidden}
[data-v2="home"] .pbar i{display:block;height:100%;background:var(--gold);transform-origin:left center;transform:scaleX(0);transition:transform 400ms var(--hx)}
/* Engagements: the Diagnostic card stretched to the list, four rows with their drawings */
[data-v2="home"] .g-eng{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:48px;align-items:stretch}
[data-v2="home"] .g-eng .stick{display:flex;flex-direction:column}
[data-v2="home"] .g-eng .dcb{margin-top:auto}
[data-v2="home"] .g-eng>div:last-child{display:flex;flex-direction:column;justify-content:space-between}
[data-v2="home"] .erow{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 24px;padding:24px 0;border-top:1px solid var(--line)}
[data-v2="home"] .erow:first-child{border-top:0;padding-top:0}
[data-v2="home"] .er-t{flex:1 1 220px}
[data-v2="home"] .er-t .lb{display:table}
[data-v2="home"] .er-t .sub{margin-top:8px;font-size:16px}
[data-v2="home"] .er-d{font-size:15px;color:var(--cream-dim);white-space:nowrap}
/* Network: House Match large and dark; Talent and The Bench beside it */
[data-v2="home"] .nw{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:16px}
[data-v2="home"] .nw-a{grid-row:span 2;display:flex;flex-direction:column;justify-content:space-between;gap:40px;padding:32px;min-height:420px;background:#0A0A0B;border-color:rgba(237,232,220,.16);color:#EDE8DC}
[data-v2="home"] .nw-a .s{color:#EDE8DC}
[data-v2="home"] .nw-a .sub{color:#A8A296}
[data-v2="home"] .nwh{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}
[data-v2="home"] .nw-t{font-size:clamp(1.6rem,3vw,2.25rem)!important;font-weight:800!important;letter-spacing:-0.01em!important;line-height:1.04!important}
[data-v2="home"] .nw-b,[data-v2="home"] .nw-c{display:flex;flex-direction:column;justify-content:space-between;gap:24px;padding:28px}
[data-v2="home"] .nw-c{background:var(--ink-800)}
[data-v2="home"] .nw-c .sub{color:var(--cream-dim)}
[data-v2="home"] .nfacts{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
[data-v2="home"] .nfacts li{font-size:15px;line-height:1.4;color:#A8A296;padding-top:12px;border-top:1px solid rgba(237,232,220,.2)}
[data-v2="home"] .nfacts b{display:block;font-family:var(--f-display);font-weight:700;font-size:.95rem;color:#EDE8DC;margin-bottom:4px}
/* About, Selected engagements: the invitation tile spans the rest of the last row (spans set by assets/v2.js) */
.tile-grid-eng .tile-cta{grid-column:auto}
@media (min-width:520px){.tile-grid-eng .tile-cta{grid-column:span var(--span2,1)}}
@media (min-width:760px){.tile-grid-eng .tile-cta{grid-column:span var(--span3,1)}}
@media (min-width:1000px){.tile-grid-eng .tile-cta{grid-column:span var(--span4,1)}}
/* About: three ruled rows (also the About page's method) and four figures */
.v2 .ab3{margin-top:40px;border-bottom:1px solid var(--line)}
.v2 .ab3>div{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:8px 32px;align-items:baseline;padding:22px 0;border-top:1px solid var(--line)}
.v2 .ab3 h3{margin:0;font-family:var(--f-display);font-weight:800;font-size:clamp(1.5rem,3vw,2.125rem);letter-spacing:-0.01em;line-height:1;text-transform:uppercase}
.v2 .ab3 p{margin:0;color:var(--cream-dim);font-size:1.0625rem}
[data-v2="home"] .abf{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-top:40px}
[data-v2="home"] .abf>a{display:flex;flex-direction:column;gap:10px;color:inherit}
[data-v2="home"] .abf b{font-family:var(--f-display);font-weight:800;font-size:clamp(2.25rem,5vw,3.25rem);line-height:.9;letter-spacing:-0.02em;color:var(--goldtx)}
[data-v2="home"] .abf span{color:var(--cream-dim)}
@media (hover:hover) and (pointer:fine){[data-v2="home"] .abf>a:hover span{color:var(--cream)}}
/* Questions: four open answers in two columns, the fifth as a full-width tile */
[data-v2="home"] .qs{background:var(--ink-800);border-block:1px solid var(--line)}
[data-v2="home"] .fq{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 64px}
[data-v2="home"] .fq h3{font-family:var(--f-display);font-weight:700;font-size:1.125rem;line-height:1.3;margin:0;text-transform:none;letter-spacing:0}
[data-v2="home"] .fq p{margin:10px 0 0;color:var(--cream-dim)}
[data-v2="home"] .fq .wide{grid-column:1 / -1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px;padding:24px 28px;background:var(--ink-900)}
/* Closing, and the still skyline strip touching the footer */
[data-v2="home"] .cl-h{font-size:clamp(2.25rem,6vw,4.25rem)!important}
[data-v2="home"] .cl2{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:48px;align-items:end;margin-top:40px}
[data-v2="home"] .cfacts{margin:0;display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px 24px;font-size:16px}
[data-v2="home"] .cfacts dt{font-family:var(--f-display);font-weight:600;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cream-dim);padding-top:4px}
[data-v2="home"] .cfacts dd{margin:0}
.skys{height:96px;overflow:hidden;line-height:0}
.skys canvas{display:block;width:100%;height:100%}
/* entrance */
@keyframes hup{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@keyframes hbar{from{transform:scaleX(.02)}to{transform:scaleX(1)}}
@media (prefers-reduced-motion:no-preference){
[data-v2="home"] .hw span{display:inline-block;animation:hup 700ms var(--hx) both}
[data-v2="home"] .hw span:nth-child(2){animation-delay:70ms}
[data-v2="home"] .hw span:nth-child(3){animation-delay:140ms}
[data-v2="home"] .hero .gbar{transform-origin:left center;animation:hbar 600ms var(--hx) 220ms both}
[data-v2="home"] .in{animation:hup 600ms var(--hx) both}
[data-v2="home"] .in.d1{animation-delay:120ms}
[data-v2="home"] .in.d2{animation-delay:220ms}
}
.fx-pre [data-v2="home"] .hw span,.fx-pre [data-v2="home"] .in,.fx-pre [data-v2="home"] .hero .gbar{animation:none}
/* phones and small tablets */
@media (max-width:900px){
[data-v2="home"] .sec{padding-block:72px}
[data-v2="home"] .grid2,[data-v2="home"] .g-eng,[data-v2="home"] .nw,[data-v2="home"] .fq,[data-v2="home"] .cl2{grid-template-columns:minmax(0,1fr)}
[data-v2="home"] .hw{justify-content:flex-start}
[data-v2="home"] .led{grid-template-columns:minmax(0,1fr);gap:40px}
[data-v2="home"] .led>div:first-child{display:flex;flex-direction:column;align-items:center;text-align:center}
[data-v2="home"] .led .eb,[data-v2="home"] .bandeb,[data-v2="home"] .led-src{text-align:center}
[data-v2="home"] .wr{grid-template-columns:minmax(0,1fr) 24px;gap:8px 16px;padding:18px 0;margin:0}
[data-v2="home"] .wr>div{grid-column:1 / -1;grid-row:2}
[data-v2="home"] .nw-a{min-height:0;padding:24px}
[data-v2="home"] .nfacts{grid-template-columns:minmax(0,1fr);gap:12px}
[data-v2="home"] .nwh{flex-direction:column-reverse;gap:12px}
[data-v2="home"] .ill{width:72px;height:54px}
}
@media (max-width:720px){
.v2 .ab3>div{grid-template-columns:minmax(0,1fr)}
[data-v2="home"] .abf{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 20px}
}
/* "Decide. Enter. Sell." is one line when it fits, otherwise one word per line (dots.js measures; this is the fallback) */
@media (max-width:600px){[data-v2="home"] .hw{flex-direction:column;align-items:flex-start}[data-v2="home"] .hst{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 20px}}
/* ===================== About page: the figures band (spine, 13 Oct 2026) =====================
Ink in both modes, full width. The first three figures open their list below the row (assets/v2.js). */
.v2 .ab-band{margin-inline:calc(50% - 50vw);margin-block:var(--s7) 0;border-block:1px solid rgba(237,232,220,.16)}
.v2 .ab-band+.section{border-top:0}
.v2 .abf4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;padding-block:56px}
.v2 .abn{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:0;border:0;background:none;color:#EDE8DC;font:inherit;text-align:left;cursor:pointer;min-height:44px}
.v2 .abn .num{font-family:var(--f-display);font-weight:800;font-size:clamp(2.5rem,6vw,4rem);line-height:.9;color:#EDE8DC}
.v2 .abn .abl{color:#A8A296;transition:color 160ms ease}
.v2 .abn i{font-style:normal;color:#C9A24B;margin-left:4px}
.v2 .abn.on .abl{color:#EDE8DC}
@media (hover:hover) and (pointer:fine){.v2 .abn:hover .abl{color:#EDE8DC}}
.v2 .abn:focus-visible{outline:2px solid #C9A24B;outline-offset:6px}
.v2 .abp{padding-bottom:56px}
.v2 .abh{margin:0 0 20px;padding-top:24px;border-top:1px solid rgba(237,232,220,.16);font-family:var(--f-display);font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;color:#A8A296}
.v2 .abg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:rgba(237,232,220,.16);border:1px solid rgba(237,232,220,.16)}
.v2 .abg>a,.v2 .abg>div{display:flex;flex-direction:column;gap:6px;padding:18px 20px;background:#0A0A0B;color:#EDE8DC;min-height:44px}
.v2 .abg b{font-family:var(--f-display);font-weight:600}
.v2 .abg span{color:#A8A296;font-size:15px}
.v2 .abg em{font-style:normal;color:#C9A24B;font-size:14px}
@media (hover:hover) and (pointer:fine){.v2 .abg>a:hover b{color:#E0BE6A}}
.v2 .abg.abs{background:none;border:0;gap:0 32px}
.v2 .abg.abs>div{padding:16px 0;border-top:1px solid rgba(237,232,220,.16)}
.v2 .abc{display:flex;flex-wrap:wrap;gap:8px}
.v2 .abc span{padding:6px 12px;border:1px solid rgba(237,232,220,.22);border-radius:2px;font-size:15px;color:#EDE8DC}
@media (max-width:820px){.v2 .abg{grid-template-columns:repeat(2,minmax(0,1fr))}.v2 .abf4{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 20px}}
@media (max-width:520px){.v2 .abg{grid-template-columns:minmax(0,1fr)}}
/* Capital & Programs Map, Family offices tab: clickable cards, the record drawer (full screen on phones), badges and notices. */
.fo-card{cursor:pointer}
.fo-card:hover,.fo-card:focus-visible{border-color:var(--gold)}
.badge.muted{border-color:var(--ink-600);color:var(--cream-faint);border-style:dashed}
.notice.amber{border-left-color:var(--warn);color:var(--warn);font-style:normal}
.fo-scrim{position:fixed;inset:0;background:rgba(10,10,11,.6);z-index:44}
.fo-drawer{position:fixed;top:0;right:0;bottom:0;width:min(560px,100%);overflow-y:auto;background:var(--ink-800);border-left:1px solid var(--ink-600);padding:24px;z-index:45;outline:none}
.fo-drawer h2{font-size:1.5rem}
.fo-drawer dd{overflow-wrap:anywhere}
.fo-src{display:grid;gap:6px;padding-left:18px;overflow-wrap:anywhere}
@media (max-width:640px){.fo-drawer{width:100%;border-left:0;padding:16px}}
/* Capital & Programs Map, free preview: the count line, the blurred locked cards (type and stage only, the lines are
empty bars) and the House Membership block, which sticks to the bottom of the screen on phones. */
.v2-map-count{font-size:1.05rem}
.v2-lock{position:relative;user-select:none;pointer-events:none;opacity:.75}
.v2-lock-l{display:block;height:10px;width:100%;border-radius:2px;background:var(--ink-600);filter:blur(3px)}
.v2-map-cta{border-color:var(--gold);background:var(--ink-800)}
@media (max-width:720px){.v2-map-cta{position:sticky;bottom:0;z-index:20;box-shadow:0 -8px 24px rgba(10,10,11,.35)}}
/* Network hub (/network): the three product cards, built like the home Network cards (dotted gold drawing, gold
eyebrow over the uppercase name, three ledger rows, one gold button). Equal heights: the footer sits at the bottom. */
[data-v2="network"] .nwc{display:flex;flex-direction:column;gap:24px;padding:28px}
[data-v2="network"] .nwc-h{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
[data-v2="network"] .nwc-h>div{min-width:0}
[data-v2="network"] .nwc .lb{margin:0 12px 0 0;vertical-align:middle;letter-spacing:.14em}
[data-v2="network"] .nwc-eb{display:flex;align-items:center;min-height:24px;margin-bottom:8px;font-family:var(--f-display);font-weight:600;font-size:.75rem;line-height:1.2;letter-spacing:.3em;text-transform:uppercase;color:var(--goldtx)}
[data-v2="network"] .nwc-t{margin:0;font-family:var(--f-display);font-weight:800;font-size:1.375rem;letter-spacing:-0.01em;line-height:1.04;text-transform:uppercase;color:var(--cream)}
[data-v2="network"] .nwc .ill{display:block;flex:0 0 auto;width:96px;height:72px}
[data-v2="network"] .nwc-l{list-style:none;margin:0;padding:0;display:grid;gap:12px}
[data-v2="network"] .nwc-l li{font-size:15px;line-height:1.4;color:var(--cream-dim);padding-top:12px;border-top:1px solid var(--line)}
[data-v2="network"] .nwc-l b{display:block;font-family:var(--f-display);font-weight:700;font-size:.95rem;color:var(--cream);margin-bottom:4px}
[data-v2="network"] .nwc-f{margin-top:auto;display:grid;gap:12px}
[data-v2="network"] .nwc-cta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 24px}
[data-v2="network"] .nwc a.tl{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-family:var(--f-display);font-weight:700;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--goldtx)}
[data-v2="network"] .nwc-m{margin:0;font-size:14px;color:var(--cream-dim)}
@media (max-width:900px){[data-v2="network"] .nwc{padding:24px}[data-v2="network"] .nwc .ill{width:72px;height:54px}}
/* The Bench (/network/bench*, assets/bench.js): group tiles with their dotted drawing, the specialty picker, match
cards, the status timeline and the Founding Bench mark (the site's dotted style, in gold). */
.bench-groups .tile{cursor:default;display:flex;flex-direction:column;gap:8px}
.bench-groups .tile:hover{background:inherit;outline:0}
.bench-groups .tile canvas.ill{width:64px;height:48px}
.bench-rules{display:grid;gap:10px;padding-left:20px;margin:0}
.bench-pk{display:grid;gap:10px}
.bench-pk [data-pk-q]{position:sticky;top:0;z-index:1}
.bench-pk-sel{display:flex;flex-wrap:wrap;align-items:center;gap:8px;min-height:36px}
.bench-pk-sel .tags{gap:6px}
.bench-pk-list{display:grid;gap:0;max-height:420px;overflow:auto;border:1px solid var(--line);border-radius:var(--radius)}
.bench-pk details{border-bottom:1px solid var(--line)}
.bench-pk details:last-child{border-bottom:0}
.bench-pk details[hidden]{display:none}
.bench-pk summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:12px;padding:12px;font-family:var(--f-display);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cream-dim)}
.bench-pk summary::-webkit-details-marker{display:none}
.bench-pk summary::after{content:'+';color:var(--goldtx)}
.bench-pk details[open] summary::after{content:'−'}
.bench-pk summary:focus-visible{outline:1px solid var(--gold);outline-offset:-1px}
.bench-pk-n{color:var(--goldtx);margin-right:auto}
.bench-pk details .tags{padding:0 12px 12px;gap:6px}
.bench-pk .tag{min-height:36px;background:none;font:inherit;font-size:.72rem;cursor:pointer}
.bench-pk .tag[hidden]{display:none}
/* Bench forms: helper notes sit in the label, so paired fields share one label row and one input height, top-aligned. */
.bench-form .form-2{align-items:start}
@supports (grid-template-rows:subgrid){.bench-form .form-2{grid-template-rows:auto auto}.bench-form .form-2>.field{grid-row:span 2;grid-template-rows:subgrid}}
@media(max-width:760px){@supports (grid-template-rows:subgrid){.bench-form .form-2{grid-template-rows:none}.bench-form .form-2>.field{grid-row:auto;grid-template-rows:auto auto}}}
.bench-form input.input,.bench-form select.input{height:48px;min-height:48px;box-sizing:border-box}
.bench-form .field>label{line-height:1.4}
.bench-in2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.bench-in2>.input{min-width:0}
/* the drop zone: dashed, the site's 2px corners, gold on focus and while a file is dragged over */
.bench-dz{display:grid;gap:8px}
.bench-dz-area{display:grid;gap:4px;justify-items:start;padding:14px 16px;min-height:48px;box-sizing:border-box;border:1px dashed var(--ink-600);border-radius:var(--radius);cursor:pointer;color:var(--cream-dim);transition:border-color .18s}
.bench-dz-area[hidden]{display:none}
.bench-dz-area:hover,.bench-dz-area:focus-within,.bench-dz.over .bench-dz-area{border-color:var(--gold)}
.bench-dz-area .link:focus-visible{outline:1px solid var(--gold);outline-offset:2px}
.bench-dz-list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.bench-dz-list:empty{display:none}
.bench-dz-list li{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:10px 12px;border:1px solid var(--line);border-radius:var(--radius);font-size:.9rem}
.bench-dz [data-dz-link][hidden]{display:none}
.bench-ref{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin-bottom:8px}
.bench-match{display:grid;gap:10px;align-content:start}
.bench-match .tags .tag.on{background:rgba(201,162,75,.12)}
.bench-score{font-family:var(--f-display);color:var(--goldtx);font-size:.9rem;letter-spacing:.04em}
.bench-brief{margin-bottom:var(--s6,40px)}
.bench-tl{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.bench-tl li{border-top:2px dotted var(--ink-600);padding-top:8px;display:grid;gap:2px;color:var(--cream-faint)}
.bench-tl li.on{border-top-color:var(--gold);color:var(--cream)}
.bench-tl b{font-family:var(--f-display);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase}
.bench-tl span{font-size:.8rem}
.fb-mark{border:2px dotted var(--gold);color:var(--goldtx);background:none;justify-self:start;width:max-content}
@media(max-width:760px){.bench-ref{grid-template-columns:1fr}.bench-tl{grid-template-columns:1fr 1fr}}
/* ===== Shahin's — the shell (spine, 13 Oct 2026) =====
Loaded after the app's stylesheet, fx.css, signin.css and v2.css, so it sets the tokens every page inherits.
Ink #0A0A0B, gold #C9A24B as the only accent, cream #EDE8DC; Archivo (display, uppercase) and Spectral (body);
2px radius; a 64×4 gold underbar under section headings; hairlines, not shadows; a 1080px column with 24px gutters
(16px on phones); body text 16px at least, labels 12px at least.
Two modes. Paper (cream ground) is the default; Ink (ink ground) follows the system dark setting until the visitor
chooses with the round toggle in the header (assets/shell.js saves the choice in html[data-theme]).
The app's token names come from its dark-only days (--ink-900 is "the ground", --cream is "the text"); Paper gives
them Paper values. Gold used as text goes through --goldtx (deep gold on Paper, #C9A24B on Ink) so it reads on both. */
/* ---------- tokens: Paper (default) ---------- */
:root{
color-scheme:light;
--ink-900:#F2EEE4;--ink-800:#FAF7F0;--ink-700:#E8E3D6;--ink-600:#D3CCBC;
--line:rgba(10,10,11,.14);--line-gold:rgba(122,94,31,.4);
--gold:#C9A24B;--gold-hi:#E0BE6A;--gold-deep:#A07F33;--goldtx:#7A5E1F;--goldtx-hi:#5E4815;--ongold:#0A0A0B;
--cream:#0A0A0B;--cream-dim:#4F4B43;--cream-faint:#5E594F;
--sig-up:#7A5E1F;--sig-steady:#4F4B43;--sig-recal:#6B5A36;--sig-grow:#3A6636;--sig-watch:#80590C;--sig-track:#3B5B7C;--sig-caution:#8A4F22;--sig-decline:#8C2F23;
--ok:#3A6636;--warn:#80590C;--bad:#8C2F23;--info:#3B5B7C;
--fieldtx:#0A0A0B;--fieldph:#6B665C;--fieldline:rgba(10,10,11,.22);--fieldline-hi:rgba(10,10,11,.38);--labeltx:#4F4B43;
--orbmix:multiply;--dot:rgba(10,10,11,.04);
/* names used by the reference markup (home page and shared components) */
--bg:var(--ink-900);--card:var(--ink-800);--soft:var(--ink-700);--ink:var(--cream);--dim:var(--cream-dim);--goldhi:#E0BE6A;
--band:#0A0A0B;--bandtx:#EDE8DC;--banddim:#A8A296;--bandline:rgba(237,232,220,.16);
--disp:var(--f-display);--body:var(--f-edit);--ease:cubic-bezier(0.23,1,0.32,1);
--radius:2px;--maxw:1080px;
}
/* ---------- tokens: Ink (chosen, or the system is dark and nothing was chosen) ---------- */
:root[data-theme="ink"]{
color-scheme:dark;
--ink-900:#0A0A0B;--ink-800:#111113;--ink-700:#19191C;--ink-600:#232327;
--line:rgba(237,232,220,.13);--line-gold:rgba(201,162,75,.28);
--goldtx:#C9A24B;--goldtx-hi:#E0BE6A;
--cream:#EDE8DC;--cream-dim:#A8A296;--cream-faint:#8C867A;
--sig-up:#C9A24B;--sig-steady:#A8A296;--sig-recal:#A8936A;--sig-grow:#7FA67A;--sig-watch:#D3A54A;--sig-track:#8FA3B8;--sig-caution:#C98A5A;--sig-decline:#C9786C;
--ok:#7FA67A;--warn:#D39A4A;--bad:#D98A7C;--info:#8FA3B8;
--fieldtx:#FFFFFF;--fieldph:#B4AEA2;--fieldline:#3A3A40;--fieldline-hi:#4A4A52;--labeltx:#CFC9BC;
--orbmix:screen;--dot:rgba(237,232,220,.05);--band:#111113;
}
@media (prefers-color-scheme:dark){
:root:not([data-theme="paper"]){
color-scheme:dark;
--ink-900:#0A0A0B;--ink-800:#111113;--ink-700:#19191C;--ink-600:#232327;
--line:rgba(237,232,220,.13);--line-gold:rgba(201,162,75,.28);
--goldtx:#C9A24B;--goldtx-hi:#E0BE6A;
--cream:#EDE8DC;--cream-dim:#A8A296;--cream-faint:#8C867A;
--sig-up:#C9A24B;--sig-steady:#A8A296;--sig-recal:#A8936A;--sig-grow:#7FA67A;--sig-watch:#D3A54A;--sig-track:#8FA3B8;--sig-caution:#C98A5A;--sig-decline:#C9786C;
--ok:#7FA67A;--warn:#D39A4A;--bad:#D98A7C;--info:#8FA3B8;
--fieldtx:#FFFFFF;--fieldph:#B4AEA2;--fieldline:#3A3A40;--fieldline-hi:#4A4A52;--labeltx:#CFC9BC;
--orbmix:screen;--dot:rgba(237,232,220,.05);--band:#111113;
}
}
/* Ink in both modes: the footer and the dark bands keep the ink ground and cream text. */
.ft,.band{
color-scheme:dark;
--ink-900:#0A0A0B;--ink-800:#111113;--ink-700:#19191C;--ink-600:#232327;
--line:rgba(237,232,220,.16);--line-gold:rgba(201,162,75,.28);
--goldtx:#C9A24B;--goldtx-hi:#E0BE6A;
--cream:#EDE8DC;--cream-dim:#A8A296;--cream-faint:#A8A296;
--bg:#0A0A0B;--card:#111113;--soft:#19191C;--ink:#EDE8DC;--dim:#A8A296;
background:#0A0A0B;color:#EDE8DC;
}
/* ---------- base ---------- */
html,body{background:var(--ink-900)}
body{color:var(--cream);font-family:var(--f-edit);font-size:17px;line-height:1.6;transition:background-color 200ms ease,color 200ms ease}
::selection{background:var(--gold);color:var(--ongold)}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.container,.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:24px}
.wrap{max-width:calc(var(--maxw) + 48px)}
.container{max-width:calc(var(--maxw) + 48px)}
@media (min-width:1600px){:root{--maxw:1080px}}
@media (max-width:760px){.container,.wrap{padding-inline:16px}}
main [id]{scroll-margin-top:80px}
/* type: labels 12px at least, body text 16px at least */
.eyebrow,.micro,.label,.badge,.pill,.tag,th,.field label,.btn,.btn.sm,.link,.wizard-nav span,.doc-foot,.route-chips,.msg .who,.kv dt,
.atabs button,.atabs button .num,.side-nav a,.side-nav .cnt,.chips .tag .n,.tags .tag,.hist .col .x,.demo-bar,.sec-head .kicker .n,
.v2 .note,.v2-watch .tx span,.v2-price small,.v2-eng .for,.v2-eng .meta .t,.v2-eng .meta .p small,.v2-caps .tile b,.v2-trust,.card .price small{font-size:.75rem}
.small,.help,.check,.v2 .check,.error,.kv,table,.stat span,.v2-watch .tx,.v2-eng ul,.v2-pair p,.v2-method span,.v2-caps .tile span,.fx-fill .q,.footer a{font-size:1rem}
/* intro text fills its column: no fixed character-width caps */
.lede,.notice,.hero p,.hero .prose,.sec-head p,.faq .faq-a p,.v2-about p,.fx-fill .q{max-width:none}
/* section headings: the 64×4 gold underbar */
.barred{padding-bottom:16px}
.barred:after{width:64px;height:4px;background:var(--gold)}
/* hairlines, not shadows */
.doc{box-shadow:none}
/* ---------- buttons: gold for the main action, a gold hairline for the rest ---------- */
.btn{position:relative;isolation:isolate;overflow:hidden;min-height:48px;padding:0 22px;border-radius:2px;letter-spacing:.14em;line-height:1;white-space:nowrap;border:0;box-shadow:inset 0 0 0 1px var(--goldtx);background:transparent;color:var(--cream)}
.btn.sm{min-height:40px;padding:0 14px}
.btn.primary{background:var(--gold);color:var(--ongold);box-shadow:none}
.btn.ghost{box-shadow:inset 0 0 0 1px var(--line);color:var(--cream)}
.btn:not(.primary)::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--gold);transform:scaleX(0);transform-origin:left center;transition:transform 320ms var(--ease)}
.btn:hover{color:var(--cream)}
.btn.primary:hover{background:var(--gold);color:var(--ongold)}
@media (hover:hover) and (pointer:fine){
.btn:not(.primary):not(:disabled):hover{color:var(--ongold);box-shadow:inset 0 0 0 1px var(--gold)}
.btn:not(.primary):not(:disabled):hover::before{transform:scaleX(1)}
.btn.primary:hover{background:var(--gold-hi)}
}
.link{color:var(--goldtx)}
/* ---------- cards, tags, status dots ---------- */
.card{background:var(--ink-800);border:1px solid var(--line);border-radius:2px}
.badge.fill{color:var(--ongold)}
/* card label (.lb): a small filled gold tag above the title; a labelled card gets a 2px gold frame, no fill change.
.lb.only is the tag alone, for rows that are not cards (Partner Search and First Customers). */
.lb{display:inline-block;margin:0 0 12px;padding:6px 10px 5px;border-radius:2px;background:var(--gold);color:#0A0A0B;font-family:var(--f-display);font-weight:700;font-size:.75rem;line-height:1;letter-spacing:.14em;text-transform:uppercase;justify-self:start;align-self:flex-start}
.lb:empty{display:none}
.card:has(.lb:not(:empty):not(.only)),.tile:has(.lb:not(:empty):not(.only)){border-color:var(--gold);outline:1px solid var(--gold);outline-offset:-2px}
/* status dots: Watch, Act, Track, Announced */
.ws{display:inline-flex;align-items:center;gap:10px;min-height:27px;font-family:var(--f-display);font-weight:700;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase}
.ws i{position:relative;width:8px;height:8px;border-radius:50%;background:currentColor;flex:0 0 auto}
.t-y{color:var(--warn)}.t-g{color:var(--ok)}.t-b{color:var(--info)}.t-n{color:var(--cream-dim)}.t-r{color:var(--bad)}
@keyframes wsPulse{from{transform:scale(1);opacity:.5}to{transform:scale(2.8);opacity:0}}
@media (prefers-reduced-motion:no-preference){.ws.t-g i::after{content:"";position:absolute;inset:0;border-radius:50%;background:currentColor;animation:wsPulse 1.8s var(--ease) infinite}}
/* tabs */
.tabs{position:relative;display:inline-grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);padding:4px;gap:4px;background:var(--ink-700);border-radius:2px}
.tab{min-height:42px;padding:0 22px;border:0;background:transparent;font-family:var(--f-display);font-weight:700;font-size:.75rem;letter-spacing:.14em;text-indent:.14em;text-transform:uppercase;color:var(--cream-dim);cursor:pointer;border-radius:2px;transition:color 180ms ease,background-color 180ms ease}
.tab.on,.tab[aria-selected="true"]{color:var(--cream);background:var(--ink-800);box-shadow:inset 0 0 0 1.5px var(--gold)}
/* ---------- the early-access line above the header ---------- */
.demo-bar{background:var(--ink-700);color:var(--cream-dim)}
.demo-bar a,.demo-bar button{color:var(--goldtx)}
/* ---------- header ---------- */
.hd{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:color-mix(in srgb,var(--ink-900) 88%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line);transition:box-shadow 180ms ease}
html.scrolled .hd{box-shadow:0 1px 0 var(--line),0 10px 24px -18px rgba(10,10,11,.45)}
.hd>.wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:64px}
.hd .hl{display:flex;align-items:center;gap:40px;min-width:0}
.hd .hr{display:flex;align-items:center;gap:20px;flex:0 0 auto}
.hd .hlogo{display:inline-flex;align-items:center;min-height:44px;flex:0 0 auto}
.lg{display:block;height:24px;width:auto}
.hd .lg-i{display:none}
:root[data-theme="ink"] .hd .lg-p{display:none}
:root[data-theme="ink"] .hd .lg-i{display:block}
@media (prefers-color-scheme:dark){:root:not([data-theme="paper"]) .hd .lg-p{display:none}:root:not([data-theme="paper"]) .hd .lg-i{display:block}}
.hd .nv{display:flex;gap:26px;white-space:nowrap}
.hd .nv a,.hd .navl{position:relative;display:inline-flex;align-items:center;min-height:44px;font-family:var(--f-display);font-weight:600;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cream-dim);transition:color 180ms ease}
.hd .nv a.here,.hd .nv a.spy{color:var(--cream)}
.hd .nv a::after{content:"";position:absolute;left:0;right:0;bottom:9px;height:1.5px;background:var(--gold);transform:scaleX(0);transform-origin:left center;transition:transform 200ms var(--ease)}
.hd .nv a.here::after,.hd .nv a.spy::after{transform:scaleX(1)}
.hd .hcta{min-height:44px;padding:0 16px}
.hd .staff-pill{white-space:nowrap}
.mtog{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;border:0;padding:0;background:transparent;border-radius:999px;cursor:pointer;transition:background-color 180ms ease}
.mdisc{display:block;width:18px;height:18px;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--cream);background:linear-gradient(90deg,var(--cream) 50%,transparent 50%);transition:transform 320ms cubic-bezier(0.77,0,0.175,1)}
html.th-ink .mdisc{transform:rotate(180deg)}
.mbtn,.mnav{display:none}
.hd .prog{height:2px;margin-bottom:-2px;background:var(--gold);transform:scaleX(0);transform-origin:left center;pointer-events:none}
@supports (animation-timeline:scroll()){
@media (prefers-reduced-motion:no-preference){
.hd .prog{animation:hdProg linear both;animation-timeline:scroll(root block)}
}
}
@keyframes hdProg{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media (prefers-reduced-motion:reduce){.hd .prog{display:none}}
@media (hover:hover) and (pointer:fine){
.hd .nv a:hover,.hd .navl:hover{color:var(--cream)}
.hd .nv a:hover::after{transform:scaleX(1)}
.mtog:hover{background:var(--ink-700)}
}
/* phones and small tablets: logo, Take the Score, toggle, menu button; the menu opens over the page */
@media (max-width:900px){
.hd .nv,.hd .navl,.hd .hr .staff-pill{display:none}
.hd .hr{gap:4px}
.hd .hl{flex:0 0 auto}
.hd .hcta{padding:0 10px;letter-spacing:.1em;margin-right:4px}
.mbtn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:44px;padding:0;border:0;background:none;color:var(--cream);cursor:pointer}
.mbtn span,.mbtn span::before,.mbtn span::after{display:block;width:20px;height:2px;background:currentColor;transition:transform 200ms var(--ease),background-color 200ms ease}
.mbtn span{position:relative}
.mbtn span::before,.mbtn span::after{content:"";position:absolute;left:0}
.mbtn span::before{transform:translateY(-6px)}
.mbtn span::after{transform:translateY(6px)}
.mbtn.open span{background:transparent}
.mbtn.open span::before{transform:rotate(45deg)}
.mbtn.open span::after{transform:rotate(-45deg)}
.mnav.open{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;max-height:calc(100vh - 64px);overflow-y:auto;background:var(--ink-900);border-block:1px solid var(--line);box-shadow:0 18px 30px -18px rgba(10,10,11,.35);padding:4px 16px 12px}
.mnav a{display:flex;align-items:center;min-height:48px;border-bottom:1px solid var(--line);font-family:var(--f-display);font-weight:700;font-size:.8125rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cream)}
.mnav a:last-child{border-bottom:0}
}
/* signed in as staff: the Staff access pill has its own slot between About and Account, and the row may use the full
width; where the row is too narrow for it (below 1212px) the header switches to the menu, which carries the pill */
@media (min-width:1212px){.hd>.wrap:has(.staff-pill){max-width:none}}
.hd:has(.staff-pill) .hl{flex:0 0 auto}
.mnav .staff-pill{align-self:flex-start;margin:12px 0 8px}
@media (max-width:1211px){
.hd:has(.staff-pill) .nv,.hd:has(.staff-pill) .navl,.hd:has(.staff-pill) .hr .staff-pill{display:none}
.hd:has(.staff-pill) .hr{gap:4px}
.hd:has(.staff-pill) .hl{flex:0 0 auto}
.hd:has(.staff-pill) .hcta{padding:0 10px;letter-spacing:.1em;margin-right:4px}
.hd:has(.staff-pill) .mbtn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:44px;padding:0;border:0;background:none;color:var(--cream);cursor:pointer}
.hd:has(.staff-pill) .mbtn span,.hd:has(.staff-pill) .mbtn span::before,.hd:has(.staff-pill) .mbtn span::after{display:block;width:20px;height:2px;background:currentColor;transition:transform 200ms var(--ease),background-color 200ms ease}
.hd:has(.staff-pill) .mbtn span{position:relative}
.hd:has(.staff-pill) .mbtn span::before,.hd:has(.staff-pill) .mbtn span::after{content:"";position:absolute;left:0}
.hd:has(.staff-pill) .mbtn span::before{transform:translateY(-6px)}
.hd:has(.staff-pill) .mbtn span::after{transform:translateY(6px)}
.hd:has(.staff-pill) .mbtn.open span{background:transparent}
.hd:has(.staff-pill) .mbtn.open span::before{transform:rotate(45deg)}
.hd:has(.staff-pill) .mbtn.open span::after{transform:rotate(-45deg)}
.hd:has(.staff-pill) .mnav.open{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;max-height:calc(100vh - 64px);overflow-y:auto;background:var(--ink-900);border-block:1px solid var(--line);box-shadow:0 18px 30px -18px rgba(10,10,11,.35);padding:4px 16px 12px}
.hd:has(.staff-pill) .mnav a{display:flex;align-items:center;min-height:48px;border-bottom:1px solid var(--line);font-family:var(--f-display);font-weight:700;font-size:.8125rem;letter-spacing:.14em;text-transform:uppercase;color:var(--cream)}
.hd:has(.staff-pill) .mnav a:last-child{border-bottom:0}
.hd:has(.staff-pill) .mbtn{width:44px}
}
/* phones up to 600px: the logo, Take the Score, the toggle and the menu button fit the 390px row (were 15px over) */
@media (max-width:600px){.hd>.wrap{gap:12px}.hd .hcta{padding:0 8px;letter-spacing:.06em;margin-right:0}.hd .hr{gap:2px}}
@media (max-width:389px){.hd .hcta{display:none}}
/* ---------- footer: two lines and the disclaimer, ink in both modes ---------- */
.footer.ft{margin-top:0;padding:0;border-top:1px solid rgba(237,232,220,.16)}
.f2{padding-top:40px;padding-bottom:28px}
.f2r{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 32px}
.f2r+.f2r{margin-top:20px;padding-top:16px;border-top:1px solid rgba(237,232,220,.16)}
.f2l{display:flex;flex-wrap:wrap;align-items:center;gap:0 24px}
.ft .f2logo{display:inline-flex;align-items:center;min-height:44px}
.ft .lg{height:40px}
.ft .f2l a{display:inline-flex;align-items:center;min-height:44px;font-family:var(--f-edit);font-size:15px;color:#A8A296;transition:color 160ms ease}
.ft .f2l a.f2m{font-family:var(--f-display);font-weight:600;font-size:.8125rem;letter-spacing:.12em;text-transform:uppercase;color:#EDE8DC}
.ft .f2c{font-size:15px;color:#A8A296}
.ft .f2d{margin:16px 0 0;font-size:14px;color:#A8A296}
.ft .f2fb{margin-top:8px;font-size:13px}
.ft .f2fb a{color:#A8A296;text-decoration:underline;text-underline-offset:3px}
@media (hover:hover) and (pointer:fine){.ft .f2fb a:hover{color:#E0BE6A}}
.ft a:focus-visible{outline:2px solid #E0BE6A;outline-offset:4px}
@media (hover:hover) and (pointer:fine){.ft .f2l a:hover,.ft .f2l a.f2m:hover{color:#E0BE6A}}
/* the official Saudi Business Center seal, in its own small slot on the second line */
.ft .sbc-block{display:inline-flex;align-items:center;min-height:44px}
.ft .sbc-card{display:block;background:none;border:0;padding:0;line-height:0}
.ft .sbc-slot{display:block;width:130px;height:44px}
/* no card behind the seal: it reads straight on the ink footer. The seal's own frame is transparent (fx.css keeps its
color-scheme light, the same as the seal page, so no browser paints an opaque canvas behind it). */
html .sbc-fallback{background:transparent;color:#EDE8DC}
html .sbc-fallback .sbc-fb-label{color:#A8A296}
html .sbc-fallback .sbc-fb-verify{color:#C9A24B}
html .sbc-fallback:hover .sbc-fb-verify,html .sbc-fallback:focus-visible .sbc-fb-verify{color:#E0BE6A}
@media (max-width:760px){
.f2r{flex-direction:column;align-items:flex-start;gap:4px}
.f2l{gap:0 20px}
}
/* ---------- page heads: the soft gold glow behind a hero bleeds past the column and fades at every edge ---------- */
.hero:before{inset:0 -120px -48px;background:radial-gradient(700px 460px at 85% 0%,rgba(201,162,75,.12),transparent 70%);-webkit-mask-image:radial-gradient(140% 100% at 60% 0%,#000 45%,transparent 100%);mask-image:radial-gradient(140% 100% at 60% 0%,#000 45%,transparent 100%)}
.v2-door .lb{display:table}
/* ---------- inner pages (step 4): page head, drawings, card labels ---------- */
/* page head: gold label (.eyebrow), the title, and the 64×4 gold underbar beneath it. The home page has its own hero. */
main .hero :is(h1:not(:where(.eyebrow,.eb)),p:where(.h1)):not(.hw)::after{content:"";display:block;width:64px;height:4px;margin-top:20px;background:var(--gold)}
/* the dotted gold drawings (assets/dots.js) and the House Art Library icons (.ill[data-icon], assets/art/), the same on every page an item appears */
.ill{display:block;flex:0 0 auto;width:96px;height:72px}
.ill.ill-s{width:72px;height:54px}
[data-icon]>svg{display:block;width:100%;height:100%}
/* a card or panel header with its icon on the right (as the Home cards' .tl-h): never over the text */
.ill-hd{display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
.ill-hd>:first-child{min-width:0}
@media (max-width:900px){.ill-hd>.ill:not(.ill-s){width:72px;height:54px}}
/* product cards: the label on the left, the drawing on the right, above the card's own content */
.shc-h{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;min-height:0}
.shc-h .lb{margin:0}
/* product pages: the drawing sits to the right of the title */
.hero>.ill-hero{position:absolute;right:0;top:var(--s8);width:144px;height:108px}
@media (max-width:760px){.hero>.ill-hero{width:96px;height:72px;top:var(--s6)}}
/* the "flagship" frame is retired: the named card labels are the only highlights */
.card.flag{border-color:var(--line)}
.hero:has(>.ill-hero)>:is(h1:not(:where(.eyebrow)),p:where(.h1)),.hero:has(>.ill-hero)>.lede{padding-right:168px}
@media (max-width:760px){.hero:has(>.ill-hero)>:is(h1:not(:where(.eyebrow)),p:where(.h1)){padding-right:108px}.hero:has(>.ill-hero)>.lede{padding-right:0}}
/* ---------- glyphs used as interface furniture: always text, never colour emoji ----------
↗ (U+2197) and © (U+00A9) have emoji forms that iOS can pick; each is followed by U+FE0E in the markup, and these
rules ask for the text form as well. (→, ←, · and the status dots have no emoji form; the dots are drawn in CSS.) */
.ft .f2l a,.tl,.lede a,.abg b,.sbc-fallback,.sbc-fb-verify,.micro,.v2 .tile a{font-variant-emoji:text}
/* ---------- touch targets: every control at least 44×44 (screen-fit pass, 13 Oct 2026) ---------- */
@media (max-width:900px){.mbtn{width:44px}}
.tab{min-height:44px}
/* phones: three tabs share 358px at 390px wide, so less side padding and tracking keep "Membership" inside its tab */
@media (max-width:600px){.tab{padding:0 8px;letter-spacing:.1em;text-indent:.1em}}
.ft .f2l a{min-width:44px;justify-content:center}
/* buttons wrap their label (two balanced lines) instead of clipping it in a narrow column; the header's Score button
stays on one line */
.btn{white-space:normal;text-wrap:balance;text-align:center;line-height:1.25;padding-block:12px}
.btn.sm{min-height:44px;padding-block:10px}
.hd .hcta{white-space:nowrap}
/* tags used as filters or tabs, and text-style links that act as controls: 44px tall at every width (the app's own
rule applied only on touch screens) */
a.tag,button.tag{display:inline-flex;align-items:center;min-height:44px}
a.link,a.micro,a.small,.demo-bar a,.demo-bar button{display:inline-flex;align-items:center;min-height:44px;min-width:44px}
.demo-bar .container{min-height:44px}
/* The side switch: Entering Saudi Arabia / Saudi company (assets/v2.js sideSwitch), and the Saudi-path Score's PDF
(assets/saudi-path.js prints the result with the site furniture hidden). */
@media print{.sa-printing header,.sa-printing footer,.sa-printing nav,.sa-printing [data-side-switch],.sa-printing .sa-noprint{display:none!important}}
/* Page headings (23 Oct 2026): on Home, Engagements, About and Products the page's is the small gold line above the
title (.eyebrow, or .eb on Home), drawn as that line was; the title under it is a
, drawn as the h1 was
(the app stylesheet's h1 rules, repeated here; the v2 and page-head rules name it too). */
h1:where(.eyebrow,.eb){line-height:inherit;text-wrap:wrap}
p:where(.h1){font-family:var(--f-display);color:var(--cream);line-height:1.04;letter-spacing:-.01em;margin:0;text-wrap:balance;font-size:clamp(2rem,5vw,3.25rem);font-weight:800;text-transform:uppercase}
/* House Membership (/products/house-membership), 18 Oct 2026: the approved design, ported from its reference file.
Its own tokens are scoped to .hm: night (ink) by default, day (paper) when the header toggle chooses Paper. The site's
token names used inside the page (FAQ, links) are mapped onto them. The door plays only while html.hm-door is set
(assets/boot.js on a first visit this session, without reduced motion); otherwise the arch is already in place.
Motion uses cubic-bezier(.16,1,.3,1) and stops for prefers-reduced-motion. */
.hm{--ink:#0a0a0b;--ink2:#111113;--ink3:#19191c;--ink4:#232327;--cream:#ede8dc;--dim:#a8a296;--faint:#6e695f;--gold:#c9a24b;--goldhi:#e0be6a;--bronze:#8c7a56;--golddeep:#a07f33;--line:rgba(237,232,220,0.10);--ongold:#0a0a0b;--db:1;--arch-in:#0a0a0b;
--ink-900:var(--ink);--ink-800:var(--ink2);--ink-700:var(--ink3);--ink-600:var(--ink4);--cream-dim:var(--dim);--cream-faint:var(--faint);--goldtx:var(--gold);--goldtx-hi:var(--goldhi);
--hm-ease:cubic-bezier(.16,1,.3,1);--fd:'Archivo',var(--f-display,Arial),Arial,sans-serif;--fb:'Spectral',var(--f-edit,Georgia),Georgia,serif;
color-scheme:dark;background:var(--ink);color:var(--cream);font-family:var(--fb);font-size:17px;line-height:1.6;margin-block:calc(-1 * var(--hm-pad, 0px)) 0}
:root[data-theme="paper"] .hm{--ink:#f4efe4;--ink2:#ebe4d4;--ink3:#e2dac7;--ink4:#cfc5ae;--cream:#14130f;--dim:#4a463d;--faint:#6b665b;--gold:#8a6a22;--goldhi:#7a5c18;--bronze:#9a8660;--golddeep:#9c7c32;--line:rgba(20,19,15,0.12);--ongold:#fbf7ee;--db:2.2;--arch-in:#1a1814;color-scheme:light}
html.hm-notx .hm *,html.hm-notx .hm *::before,html.hm-notx .hm *::after{transition:none !important}
/* The page runs edge to edge under the site header; the app's 1080px column is undone for each band. */
body:has(.hm){overflow-x:clip}
:root:has(.hm) .container.rise:has(> .v2 > [data-v2part] > .hm){max-width:none;padding-inline:0}
.hm > section{position:relative;width:100%}
.hm a{color:var(--gold)}.hm a:hover{color:var(--goldhi)}
.hm h1,.hm h2,.hm h3{text-wrap:balance;text-transform:none}
.hm p,.hm li,.hm td,.hm summary{text-wrap:pretty}
.hm p{margin:0}
.hm ul{margin:0;padding:0;list-style:none}
.hm-col{max-width:1080px;margin:0 auto;padding-inline:24px;box-sizing:content-box}
.hm-sec .hm-col{padding-block:96px}
.hm-line{border-top:1px solid var(--line)}
.hm-sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hm-stack6{display:flex;flex-direction:column;gap:6px}
.hm-stack16{display:flex;flex-direction:column;gap:16px}
.hm-stack32{display:flex;flex-direction:column;gap:32px}
.hm-stack40{display:flex;flex-direction:column;gap:40px}
.hm-stack48{display:flex;flex-direction:column;gap:48px}
.hm-head{display:flex;flex-direction:column;gap:12px}
.hm-kicker{font-family:var(--fd);font-size:.72rem;font-weight:600;letter-spacing:.14em;color:var(--gold)}
.hm-h2{margin:0;font-family:var(--fd);font-weight:800;font-size:clamp(1.5rem,3.4vw,2.2rem);line-height:1.04;letter-spacing:0;color:var(--cream)}
.hm-h2::after{content:none !important}
.hm-bar{width:64px;height:4px;background:var(--gold)}
.hm-label{font-family:var(--fd);font-size:.56rem;letter-spacing:.22em;color:var(--faint)}
.hm-dim{color:var(--dim)}
.hm-big{font-size:1.1875rem;color:var(--dim);max-width:28em}
.hm-w36{max-width:36em}
/* ---------- dot art ---------- */
.hm .dot{position:absolute;border-radius:999px;animation:hmDotIn 1800ms cubic-bezier(.2,.8,.2,1) both}
.hm .dot.live{animation:hmDotIn 1800ms cubic-bezier(.2,.8,.2,1) both,hmTwinkle 5s ease-in-out infinite}
@keyframes hmDotIn{from{transform:translate(var(--dx),var(--dy)) scale(.3);opacity:0}}
@keyframes hmTwinkle{0%,100%{opacity:var(--o)}50%{opacity:calc(var(--o) * .35)}}
.hm .float{animation:hmFloat 9s ease-in-out infinite}
@keyframes hmFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.hm .drift{animation:hmDrift 140s linear infinite}
@keyframes hmDrift{to{transform:translateX(-1400px)}}
.hm .spin{animation:hmSpin 40s linear infinite;transform-origin:50% 50%}
@keyframes hmSpin{to{transform:rotate(360deg)}}
@keyframes hmSpinBack{to{transform:rotate(-360deg)}}
.hm .pulse{animation:hmPulse 2600ms ease-in-out infinite}
@keyframes hmPulse{0%,100%{box-shadow:0 0 0 0 rgba(201,162,75,.5)}60%{box-shadow:0 0 0 8px rgba(201,162,75,0)}}
.hm .key{animation:hmKeyGlow 2800ms ease-in-out 1800ms infinite}
@keyframes hmKeyGlow{0%,100%{box-shadow:0 0 8px 2px rgba(224,190,106,.5)}50%{box-shadow:0 0 24px 8px rgba(224,190,106,.9)}}
.hm .sheen{animation:hmSheen 3200ms ease-in-out infinite}
@keyframes hmSheen{0%,100%{filter:drop-shadow(0 0 0 rgba(224,190,106,0))}50%{filter:drop-shadow(0 0 6px rgba(224,190,106,.8))}}
.hm .tdot{animation:hmTyping 1400ms ease-in-out infinite both}
@keyframes hmTyping{0%,100%{opacity:.2}40%{opacity:1}}
/* Arches and drawings: gold outside, a dark doorway inside (dark in day mode too). */
.hm .af{fill:var(--gold)}
.hm .ai{fill:var(--arch-in)}
.hm svg .g{fill:none;stroke:var(--gold);stroke-linecap:round}
.hm svg .c{fill:none;stroke:var(--cream);stroke-linecap:round}
/* ---------- buttons ---------- */
.hm-btn{font-family:var(--fd);font-size:.72rem;font-weight:700;letter-spacing:.14em;line-height:1.2;background:var(--gold);color:var(--ongold) !important;padding:0 28px;min-height:54px;border:1px solid var(--gold);border-radius:2px;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:10px;box-sizing:border-box;position:relative;white-space:nowrap}
.hm-btn-soon{border-color:var(--ink4);background:var(--ink2);color:var(--faint) !important}
.hm-btn-soon:hover{color:var(--dim) !important}
.hm-btn-soon .dotf{width:6px;height:6px;border-radius:999px;background:var(--faint)}
.hm-btn-soon .soon{position:absolute;top:-9px;right:10px;font-size:.5rem;font-weight:700;letter-spacing:.18em;color:var(--ongold);background:var(--gold);border-radius:2px;padding:3px 7px;line-height:1.2}
.hm .btnG{transition:transform 160ms var(--hm-ease),filter 160ms ease-out}
.hm .btnG:active{transform:scale(.97)}
@media (hover:hover){.hm .btnG:hover{filter:brightness(1.08)}}
/* ---------- hero and the door ---------- */
.hm-hero{overflow:hidden}
.hm-hero-in{padding-block:72px 40px;display:flex;flex-wrap:wrap;align-items:center;gap:48px}
.heroText{flex:1 1 480px;max-width:600px;min-width:0;display:flex;flex-direction:column;gap:24px}
.hm-eyebrow{font-family:var(--fd);font-size:.6875rem;font-weight:600;letter-spacing:.32em;color:var(--gold)}
.hm-h1{margin:0;font-family:var(--fd);font-weight:800;font-size:clamp(2.6rem,6vw,4.4rem);line-height:.98;letter-spacing:-.01em;color:var(--cream)}
.hm-h1::after{content:none !important}
.hm-lede{font-size:1.1875rem;color:var(--dim);max-width:30em}
.heroBtns{display:flex;gap:12px;flex-wrap:wrap}
.hm-stats{display:flex;gap:32px;flex-wrap:wrap;font-family:var(--fd)}
.hm-stats div{display:flex;flex-direction:column;gap:4px}
/* The four stats stay on one row from tablet up (the longest label runs a few px past the 600px column). */
@media (min-width:761px){.hm-stats{flex-wrap:nowrap}.hm-stats div{flex:none}}
.hm-stats div span:first-child{font-size:1.8rem;font-weight:800;line-height:1}
.hm-stats div span:last-child{font-size:.62rem;letter-spacing:.14em;color:var(--dim)}
.hm-rise{transition:opacity 800ms ease-out,transform 800ms var(--hm-ease)}
html.hm-door .hm-hero:not(.is-open) .hm-rise{opacity:0;transform:translateY(10px)}
.hm-sky{position:relative;height:158px;max-width:1400px;margin:0 auto;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.hm-sky .drift{position:absolute;left:0;top:0;width:2800px;height:158px}
.hm-gate{display:none;position:absolute;inset:0;z-index:20;pointer-events:none}
html.hm-door .hm-gate{display:block}
.hm-hero.is-gone .hm-gate{display:none}
.gateL,.gateR{position:absolute;top:0;width:50%;height:100%;background:var(--ink);transition:transform 1500ms cubic-bezier(.65,0,.25,1) 150ms}
.gateL{left:0}.gateR{right:0}
.hm-hero.is-open .gateL{transform:translateX(-101%)}
.hm-hero.is-open .gateR{transform:translateX(101%)}
.gateL .seam,.gateR .seam{position:absolute;top:0;bottom:0;width:2px;background-image:radial-gradient(circle,var(--gold) 1.2px,transparent 1.6px);background-size:2px 9px;background-repeat:repeat-y;opacity:.8}
.gateL .glint,.gateR .glint{position:absolute;top:28px;width:220px;height:22px;background-image:radial-gradient(circle,var(--gold) 1.3px,transparent 1.7px);background-size:11px 11px;opacity:.5}
.gateL .seam,.gateL .glint{right:0}.gateR .seam,.gateR .glint{left:0}
.gateL .glint{-webkit-mask-image:linear-gradient(to left,#000,transparent);mask-image:linear-gradient(to left,#000,transparent)}
.gateR .glint{-webkit-mask-image:linear-gradient(to right,#000,transparent);mask-image:linear-gradient(to right,#000,transparent)}
:root[data-theme="paper"] .gateL span,:root[data-theme="paper"] .gateR span{opacity:1}
/* The key: centred on the closed door; then it glides right of the headline (transform only) as a dotted arch. */
.keyWrap{position:absolute;z-index:21;left:calc(50% - 38px);top:calc(50% - 38px);width:76px;height:76px;transform-origin:50% 50%;transform:translate3d(0,0,0) scale(1);backface-visibility:hidden;pointer-events:none}
.hm-hero.is-open .keyWrap,html:not(.hm-door) .hm-hero .keyWrap{transform:translate3d(380px,var(--keyDY,-48px),0) scale(4)}
html.hm-door .hm-hero.is-open .keyWrap{transition:transform 1300ms cubic-bezier(.65,0,.25,1) 900ms,opacity 400ms ease-out}
.gateKey{display:block;position:relative;background:none;border:0;padding:12px;width:76px;height:76px;box-sizing:border-box;margin:0;cursor:pointer;border-radius:999px;transition:transform 200ms var(--hm-ease);visibility:hidden}
html.hm-door .hm-hero:not(.is-open) .gateKey{visibility:visible;pointer-events:auto;animation:hmPulse 2600ms ease-in-out infinite}
html.hm-door .hm-hero:not(.is-open) .gateKey:hover{transform:scale(1.06)}
.hm-hero.is-open .gateKey,html:not(.hm-door) .hm-hero .gateKey{visibility:visible;pointer-events:none;animation:none}
.gateKey svg{display:block;transition:filter 200ms ease-out}
.gateKey:hover svg,.gateKey:focus-visible svg{filter:drop-shadow(0 0 10px rgba(224,190,106,.75))}
.gateKey:focus-visible{outline:2px solid var(--goldhi);outline-offset:4px}
.gateKey .k1,.gateKey .k3{fill:var(--gold)}
.gateKey .k2{fill:#0a0a0b}
:root[data-theme="paper"] .gateKey .k2{fill:#1a1814}
.gateKey .kd{fill:var(--gold);opacity:.6}
:root[data-theme="paper"] .gateKey .kd{opacity:.9}
html.hm-door .gateKey path,html.hm-door .gateKey rect{transition:fill 700ms ease-out 1400ms,stroke 700ms ease-out 1400ms,opacity 700ms ease-out 1400ms}
.hm-hero.is-open .gateKey .k1,html:not(.hm-door) .hm-hero .gateKey .k1{fill:url(#hmKeyDots);stroke:var(--gold);stroke-width:1.2;stroke-dasharray:.1 4;stroke-linecap:round}
.hm-hero.is-open .gateKey .k2,html:not(.hm-door) .hm-hero .gateKey .k2{fill:var(--ink);stroke:var(--gold);stroke-width:1;stroke-dasharray:.1 4;stroke-linecap:round;opacity:.6}
.hm-hero.is-open .gateKey .k3,html:not(.hm-door) .hm-hero .gateKey .k3{opacity:.85}
:root[data-theme="paper"] .hm-hero.is-open .gateKey .k2,:root[data-theme="paper"]:not(.hm-door) .hm-hero .gateKey .k2{fill:var(--ink2);fill-opacity:1;stroke:var(--gold);stroke-width:1.4;opacity:1}
:root[data-theme="paper"] .hm-hero.is-open .gateKey .k3,:root[data-theme="paper"]:not(.hm-door) .hm-hero .gateKey .k3{fill:var(--goldhi);opacity:1}
.hm-hero.is-open .gateKey svg,html:not(.hm-door) .hm-hero .gateKey svg{filter:none}
.keyTip{position:absolute;left:50%;top:calc(100% + 10px);transform:translate(-50%,-4px);opacity:0;white-space:nowrap;pointer-events:none;transition:opacity 200ms ease-out,transform 200ms var(--hm-ease);display:flex;flex-direction:column;align-items:center;gap:4px;background:var(--ink2);border:1px solid rgba(201,162,75,.28);border-radius:2px;padding:10px 14px}
.keyTip b{font-family:var(--fd);font-size:.62rem;font-weight:700;letter-spacing:.24em;color:var(--goldhi)}
.keyTip span{font-family:var(--fb);font-size:.82rem;color:var(--dim)}
.gateKey:hover .keyTip,.gateKey:focus-visible .keyTip{opacity:1;transform:translate(-50%,0)}
.hm-hero.is-open .keyTip,html:not(.hm-door) .hm-hero .keyTip{display:none}
.keyRing{display:none}
.keyCap{position:absolute;z-index:21;left:calc(50% + 380px);top:calc(42% + 104px);transform:translateX(-50%);white-space:nowrap;font-family:var(--fd);font-size:.56rem;font-weight:600;letter-spacing:.3em;color:var(--faint);opacity:0;pointer-events:none}
.hm-hero.is-open .keyCap,html:not(.hm-door) .hm-hero .keyCap{opacity:1}
html.hm-door .hm-hero.is-open .keyCap{transition:opacity 700ms ease-out 2100ms}
@media (max-width:1100px){.hm-hero.is-open .keyWrap,html:not(.hm-door) .hm-hero .keyWrap,.keyCap{opacity:0 !important}}
/* ---------- 01 · the orbit ---------- */
.hm-headrow{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px}
.hm-side{max-width:24em;color:var(--dim);font-size:.95rem}
.orbitStage{position:relative;width:100%;height:500px;overflow:hidden}
.hm-hint{position:absolute;left:50%;transform:translateX(-50%);top:4px;z-index:2;display:inline-flex;align-items:center;gap:8px;font-family:var(--fd);font-size:.62rem;font-weight:700;letter-spacing:.2em;color:var(--dim);white-space:nowrap;border:1px solid var(--line);border-radius:999px;padding:6px 13px}
.hm-hint .pulse{width:5px;height:5px;border-radius:999px;background:var(--gold)}
.hm-legend{position:absolute;right:0;bottom:8px;z-index:2;display:inline-flex;flex-direction:column;align-items:flex-start;gap:10px;font-family:var(--fd);font-size:.56rem;font-weight:700;letter-spacing:.18em;color:var(--faint);white-space:nowrap}
.hm-legend span{display:inline-flex;align-items:center;gap:7px}
.hm-legend i{width:11px;height:11px;border-radius:999px;border:2px solid var(--gold);box-sizing:border-box}
.hm-legend i.dotted{border-style:dotted}
.hm-glow{position:absolute;left:50%;top:48%;width:900px;height:420px;transform:translate(-50%,-50%);border-radius:999px;background:radial-gradient(ellipse,rgba(201,162,75,.10) 0%,rgba(201,162,75,0) 65%)}
.orbitCore{--os:1;position:absolute;left:50%;top:45%;width:0;height:0;transform-style:preserve-3d;transform:perspective(1400px) scale(var(--os)) rotateX(70deg) rotateZ(-4deg)}
.hm-rings{position:absolute;left:-560px;top:-480px;width:1120px;height:960px}
:root[data-theme="paper"] .hm-rings circle{opacity:1}
.hm-centre{position:absolute;left:0;top:0;width:0;height:0;transform-style:preserve-3d;transform:rotateZ(4deg) rotateX(-70deg)}
.hm-centre svg{position:absolute;left:-42px;top:-42px;display:block}
.hm .orbit{position:absolute;left:0;top:0;border-radius:999px;transform-style:preserve-3d;animation:hmSpin linear infinite;will-change:transform;backface-visibility:hidden}
.hm .nodeAt{position:absolute;left:50%;top:50%;width:0;height:0;transform-style:preserve-3d}
.hm .counter{position:absolute;left:0;top:0;width:0;height:0;transform-style:preserve-3d;animation:hmSpinBack linear infinite;will-change:transform;backface-visibility:hidden}
.hm .untilt{position:absolute;left:0;top:0;width:0;height:0;transform-style:preserve-3d;transform:rotateZ(4deg) rotateX(-70deg)}
.orbitStage:has(.node:hover) .orbit,.orbitStage:has(.node:hover) .counter,.orbitStage:has(.node:focus-visible) .orbit,.orbitStage:has(.node:focus-visible) .counter{animation-play-state:paused}
.hm .node{position:absolute;left:-21px;top:-21px;width:42px;height:42px;box-sizing:border-box;border-radius:999px;background:var(--ink);border:2px dotted var(--gold);display:flex;align-items:center;justify-content:center;cursor:pointer;padding:0;transition:border-color 200ms ease-out,box-shadow 200ms ease-out}
.hm .node.mo{background:var(--ink3);border-style:solid}
.hm .node svg{display:block}
.hm .node .ng{display:block;width:32px;height:24px}
.hm .node > span{position:absolute;top:50px;left:50%;transform:translateX(-50%);white-space:nowrap;font-family:var(--fd);font-size:.56rem;font-weight:700;letter-spacing:.2em;transition:opacity 200ms ease-out;opacity:0;color:var(--dim);pointer-events:none}
.hm .node.on{border-color:var(--goldhi)}
.hm .node.on,.hm .node:hover,.hm .node:focus-visible{border-color:var(--goldhi);box-shadow:0 0 0 6px rgba(201,162,75,.12),0 0 24px rgba(224,190,106,.45)}
.hm .node.on > span{opacity:1;color:var(--goldhi)}
.hm .node:hover > span,.hm .node:focus-visible > span{opacity:1}
.hm .node:focus-visible{outline:2px solid var(--goldhi);outline-offset:3px}
:root[data-theme="paper"] .hm .node{box-shadow:0 1px 0 rgba(20,19,15,.06)}
/* The live card */
.liveCard{background:var(--ink2);border:1px solid rgba(201,162,75,.28);border-radius:2px;padding:32px;display:grid;gap:32px;align-items:start;grid-template-columns:120px minmax(0,1fr) minmax(240px,320px)}
.lc-a{display:flex;flex-direction:column;gap:10px}
.lc-n{font-family:var(--fd);font-weight:800;font-size:2.6rem;line-height:1;color:var(--gold)}
.lc-ring,.lbl,.lc-when{font-family:var(--fd);font-size:.56rem;font-weight:700;letter-spacing:.22em;color:var(--faint)}
.lc-a svg{display:block}
.lc-a .lc-g{display:block;width:96px;height:72px}
.lc-b{display:flex;flex-direction:column;gap:12px;min-width:0}
.lc-t{font-family:var(--fd);font-weight:700;font-size:1.4rem;letter-spacing:.02em;text-transform:uppercase;line-height:1.1}
.lc-b p{font-size:1rem;color:var(--dim);max-width:42em}
.lc-c{display:flex;flex-direction:column;border-left:1px solid var(--line);padding-left:24px}
.lc-free{display:flex;flex-direction:column;gap:4px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.lc-free > span:last-child{font-size:.92rem;color:var(--dim)}
.lc-mem{display:flex;flex-direction:column;gap:4px;padding:12px 0}
.lc-mem .lbl{color:var(--gold)}
.lc-mem > span:last-child{font-size:.92rem;color:var(--cream)}
.hm i.tick,.hm-tbl td i{display:inline-block;width:12px;height:3px;background:var(--gold);margin-right:8px;vertical-align:middle}
.lc-mem s{color:var(--faint);margin-right:8px}
.lc-mem b{font-family:var(--fd);font-size:.56rem;font-weight:700;letter-spacing:.14em;color:var(--gold);margin-left:8px;vertical-align:middle}
.lc-when{font-weight:600;letter-spacing:.14em;padding-top:8px;border-top:1px solid var(--line)}
/* Chip rows, one per ring */
.hm-chips{display:flex;flex-direction:column;gap:10px}
.hm-chips .grp{display:flex;flex-wrap:wrap;gap:6px 22px;align-items:center}
.hm-chips .gn{font-family:var(--fd);font-size:.5rem;font-weight:700;letter-spacing:.26em;color:var(--faint);flex:1 1 100%}
.hm .chipBtn{font-family:var(--fd);font-size:.56rem;font-weight:700;letter-spacing:.16em;padding:6px 0 4px;border:0;border-bottom:2px solid transparent;border-radius:0;cursor:pointer;background:transparent;color:var(--dim);min-height:0;transition:background-color 180ms ease-out,color 180ms ease-out,border-color 180ms ease-out,transform 160ms var(--hm-ease)}
.hm .chipBtn.mo{color:var(--gold)}
.hm .chipBtn:hover{color:var(--cream)}
.hm .chipBtn.on{color:var(--cream);border-bottom-color:var(--gold)}
.hm .chipBtn:active{transform:scale(.97)}
/* ---------- Ask the House ---------- */
.hm-ask{background:var(--ink2);border-block:1px solid rgba(201,162,75,.28);overflow:hidden;scroll-margin-top:64px}
.hm-ask-glow{position:absolute;left:50%;top:50%;width:900px;height:900px;transform:translate(-50%,-50%);border-radius:999px;background:radial-gradient(circle,rgba(201,162,75,.10) 0%,rgba(201,162,75,0) 60%)}
.hm-ask-in{padding-block:96px;display:flex;flex-wrap:wrap;gap:48px;align-items:center;position:relative}
.hm-ask-copy{flex:1 1 440px;min-width:0;display:flex;flex-direction:column;gap:24px}
.hm-ask-top{display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.hm-ring{position:relative;width:220px;height:220px;flex:none}
.hm-ring > div{position:absolute;inset:0}
.hm-typing{display:flex;align-items:center;justify-content:center;gap:10px}
.hm-typing span{width:12px;height:12px;border-radius:999px;background:var(--goldhi)}
.hm-ask-head{display:flex;flex-direction:column;gap:14px;flex:1 1 200px;min-width:0}
.hm-badge{align-self:flex-start;font-family:var(--fd);font-size:.62rem;font-weight:600;letter-spacing:.14em;color:var(--gold);border:1px solid var(--gold);padding:8px 12px;border-radius:999px}
/* The pay-now block closes the left column; when the columns stack it follows the chat demo. */
@media (min-width:961px){
.hm-ask-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:48px;row-gap:24px}
.hm-ask-copy{grid-column:1;grid-row:1}
.hm-chat{grid-column:2;grid-row:1 / span 2;align-self:center}
.hm-ask-pay{grid-column:1;grid-row:2}
}
.hm-ask-pay{flex:1 1 100%;min-width:0;display:flex;flex-direction:column;align-items:flex-start}
.hm-ask-now{font-size:.95rem;color:var(--dim);max-width:30em}
.hm-ask-join{margin-top:24px;padding:0 24px;white-space:normal;text-align:center}
@media (max-width:760px){.hm-ask-join{align-self:stretch}}
.hm-h2-ask{font-size:clamp(1.8rem,3.6vw,2.6rem);line-height:1}
.hm-ask-lead{margin-top:24px !important;font-size:1.1875rem;color:var(--cream);max-width:28em}
.hm-ask-copy .hm-dim{max-width:30em}
.hm-ticks{display:flex;flex-direction:column;gap:10px;font-size:.92rem}
.hm-ticks li{display:flex;gap:12px;align-items:baseline}
.hm-ticks i{width:16px;height:3px;background:var(--gold);flex:none;position:relative;top:-4px}
.hm-chat{flex:1 1 420px;min-width:0;background:var(--ink);border:1px solid rgba(201,162,75,.28);border-radius:18px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 30px 80px rgba(0,0,0,.5)}
:root[data-theme="paper"] .hm-chat{box-shadow:0 30px 80px rgba(20,19,15,.12)}
.hm-chat-hd{padding:14px 20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:12px;font-family:var(--fd);font-size:.62rem;font-weight:600;letter-spacing:.14em;color:var(--dim)}
.hm-chat-hd .gold{color:var(--gold)}
.hm-chat-hd .pulse{display:inline-block;width:6px;height:6px;border-radius:999px;background:var(--gold);margin-right:8px;vertical-align:middle}
.hm-chat-bd{padding:24px 20px;display:flex;flex-direction:column;gap:20px}
.askThread{display:flex;flex-direction:column;gap:20px;min-height:300px;transition:opacity 420ms var(--hm-ease)}
.askThread.fade{opacity:0}
.askThread .qb{align-self:flex-end;max-width:85%;background:var(--ink3);border:1px solid rgba(201,162,75,.28);border-radius:16px 16px 4px 16px;padding:12px 16px;font-size:.95rem}
.askThread .ab{display:flex;flex-direction:column;gap:12px;max-width:95%}
.askThread .who{font-family:var(--fd);font-size:.56rem;letter-spacing:.22em;color:var(--gold)}
.askThread .ab p{font-size:.95rem;color:var(--cream)}
.askThread sup{color:var(--gold)}
.askThread .srcs{display:flex;flex-wrap:wrap;gap:8px}
.askThread .src{display:inline-flex;align-items:center;gap:8px;font-family:var(--fd);font-size:.6rem;letter-spacing:.1em;color:var(--dim);border:1px solid var(--line);background:var(--ink2);padding:6px 12px;border-radius:999px}
.askThread .src b{color:var(--gold);font-weight:700}
.askThread .src i{width:6px;height:6px;border-radius:999px}
.askThread .send{font-family:var(--fd);font-size:.6rem;font-weight:700;letter-spacing:.14em;color:var(--ongold);background:var(--gold);padding:8px 14px;border-radius:999px}
.askThread .disc{font-size:.8rem !important;font-style:italic;color:var(--faint) !important}
.askThread .read{display:inline-flex;align-items:center;gap:6px;font-family:var(--fd);font-size:.6rem;letter-spacing:.12em;color:var(--dim)}
.askThread .read i{width:5px;height:5px;border-radius:999px;background:var(--gold);animation:hmAskBlink 1s ease-in-out infinite}
.askThread .read i:nth-child(2){animation-delay:.15s}.askThread .read i:nth-child(3){animation-delay:.3s}
.askThread .read span{margin-left:6px}
@keyframes hmAskBlink{0%,100%{opacity:.25}50%{opacity:1}}
.hm .askIn{animation:hmAskIn 520ms var(--hm-ease) both}
@keyframes hmAskIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.hm-chat-ft{border-top:1px solid var(--line);padding-top:16px;display:flex;flex-direction:column;gap:10px}
.hm-input{display:flex;align-items:center;gap:10px;border:1px solid var(--ink4);border-radius:999px;padding:5px 5px 5px 18px;background:var(--ink2)}
.hm-input input{flex:1;min-width:0;background:transparent;border:0;outline:0;box-shadow:none;color:var(--cream);font-family:var(--fb);font-size:.95rem;padding:8px 0;min-height:0}
.hm-input input::placeholder{color:var(--faint)}
.hm .askBtn{font-family:var(--fd);font-size:.62rem;font-weight:700;letter-spacing:.14em;background:var(--gold);color:var(--ongold);border:0;border-radius:999px;padding:12px 18px;cursor:pointer;white-space:nowrap}
.hm .askBtn.press{transform:scale(.94);filter:brightness(1.15)}
.hm-chat-note{font-family:var(--fd);font-size:.56rem;letter-spacing:.14em;color:var(--faint)}
/* ---------- 02 · House Verified ---------- */
.hm-hv{display:flex;flex-wrap:wrap;gap:48px;align-items:center}
.hm-seal-wrap{flex:0 1 300px;display:flex;justify-content:center}
.hm-seal{position:relative;width:280px;height:280px}
.hm-seal > .spin{position:absolute;inset:0}
.hm-seal-arch{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.hm-hv-copy{flex:1 1 420px;min-width:0;display:flex;flex-direction:column;gap:24px}
.hm-list{display:flex;flex-direction:column}
.hm-list li{padding:14px 0;border-top:1px solid var(--line);display:flex;gap:16px;align-items:baseline}
.hm-list li:last-child{border-bottom:1px solid var(--line)}
.hm-list li > span:last-child{font-size:.95rem}
.hm-list .k{font-family:var(--fd);font-size:.62rem;letter-spacing:.14em;color:var(--gold);flex:none;width:90px}
.hm-list-s .k{font-size:.56rem;font-weight:700;letter-spacing:.18em;width:52px;padding-top:4px}
.hm-list-s li > span:last-child{font-size:1rem}
.hm-list .k.end{color:var(--faint)}
.hm-where{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:16px}
.hm-card{background:var(--ink2);border:1px solid var(--line);border-radius:2px;padding:20px;display:flex;flex-direction:column;gap:12px}
.hm-card .hm-label{letter-spacing:.18em}
.hm-prof{display:flex;align-items:center;gap:10px}
.hm-prof .ph{width:40px;height:40px;border-radius:2px;background:var(--ink3);border:1px solid var(--ink4);flex:none}
.hm-prof > div{display:flex;flex-direction:column;min-width:0}
.hm-card .nm{display:flex;align-items:center;gap:6px;font-family:var(--fd);font-weight:700;font-size:.95rem}
.hm-card .nm svg{flex:none}
.hm-card h3{margin:0}
.hm-card .sub{font-size:.85rem;color:var(--dim)}
.hm-sig{font-size:.9rem}
.hm-sig em{font-style:italic}
.hm-sig .mark{display:inline-flex;align-items:center;gap:8px;font-family:var(--fd);font-size:.56rem;font-weight:700;letter-spacing:.18em;color:var(--gold)}
/* ---------- 03 · Free vs Member ---------- */
.hm-tbl{overflow-x:auto;border:1px solid var(--line);border-radius:2px;-webkit-overflow-scrolling:touch}
.hm-tbl table{width:100%;min-width:620px;border-collapse:collapse;font-size:.92rem}
.hm-tbl th,.hm-tbl td{text-align:left;padding:16px;border:0;vertical-align:top;background:none}
.hm-tbl thead tr{background:var(--ink2)}
.hm-tbl thead th{font-family:var(--fd);font-size:.66rem;font-weight:700;letter-spacing:.14em;color:var(--gold);text-transform:none}
.hm-tbl thead th.nm{color:var(--dim)}
.hm-tbl tbody tr{border-top:1px solid var(--line);transition:background-color 180ms ease-out}
.hm-tbl tbody th{font-family:var(--fb);font-size:inherit;font-weight:500;letter-spacing:0;text-transform:none;color:var(--cream)}
.hm-tbl tbody td{color:var(--dim)}
.hm-tbl tbody td:last-child{color:var(--cream)}
.hm-tbl td i{margin-right:10px}
.hm-tbl tbody tr:hover td{background:none}
@media (hover:hover){.hm-tbl tbody tr:hover{background:var(--ink2)}}
/* ---------- 04 · Price ---------- */
.hm-price{background:var(--ink2);scroll-margin-top:64px}
.hm-months{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end;min-height:84px}
.hm-months .m{display:flex;flex-direction:column;gap:8px;align-items:flex-start;padding:10px;border-radius:2px;border:1px solid transparent}
.hm-months .m.dec{border-color:var(--gold);background:var(--ink)}
.hm-months .cells{display:grid;grid-template-columns:repeat(5,6px);gap:4px}
.hm-months .cells span{display:block;width:6px;height:6px;border-radius:999px}
.hm-months .ml{font-family:var(--fd);font-size:.62rem;font-weight:600;letter-spacing:.14em;color:var(--gold)}
.hm-months .m.past .ml{color:var(--faint)}
/* Two cards on one grid: label, price, VAT line, body and small print share rows, so they line up side by side;
stacked, each card keeps its own five rows. */
.hm-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(340px,100%),1fr));gap:0 24px}
.hm-found,.hm-std{grid-row:span 5;display:grid;grid-template-rows:subgrid;row-gap:14px;min-width:0;border-radius:2px;padding:32px;margin-bottom:24px;position:relative;align-content:start}
@supports not (grid-template-rows:subgrid){.hm-found,.hm-std{display:flex;flex-direction:column;gap:14px}}
.hm-found{background:var(--ink);border:1px solid var(--gold)}
.hm-std{border:1px solid var(--line)}
.hm-row1{display:flex;align-items:center;min-height:24px}
.hm-tag{display:inline-block;max-width:100%;box-sizing:border-box;font-family:var(--fd);font-size:.56rem;font-weight:700;letter-spacing:.18em;line-height:1.4;background:var(--gold);color:var(--ongold);padding:5px 10px;border-radius:999px}
.hm .amt{font-family:var(--fd);font-weight:800;font-size:2.6rem;line-height:1;align-self:end}
.hm .amt span{white-space:nowrap;font-size:.72rem;font-weight:600;letter-spacing:.14em;color:var(--dim)}
.hm-std .amt{color:var(--dim)}
.hm-found .sm,.hm-std .sm{font-size:.92rem}
.hm-found .body,.hm-std .body{display:flex;flex-direction:column;gap:14px}
.hm-found .tx,.hm-std .tx{font-size:.95rem}
.hm-std .tx,.hm-std .lab{color:var(--dim)}
.hm-std .lab{font-family:var(--fd);font-size:.62rem;font-weight:600;letter-spacing:.14em}
.hm-join{margin-top:auto;padding:0 24px;white-space:normal;text-align:center}
.hm-found .fine{font-family:var(--fd);font-size:.56rem;letter-spacing:.18em;color:var(--faint);text-align:center;align-self:start}
.hm-std .foot{font-size:.85rem;color:var(--faint);align-self:start}
.hm-countdown{font-family:var(--fd);font-size:.72rem;font-weight:700;letter-spacing:.14em;color:var(--gold);margin:0 0 -16px !important}
.hm-heroline{font-family:var(--fd);font-size:.62rem;font-weight:600;letter-spacing:.14em;color:var(--dim);margin-top:-12px !important}
.lc-pay{font-size:.85rem;color:var(--dim);padding-bottom:12px}
/* ---------- 05 · If you leave, 06 · Questions ---------- */
.hm-leave{display:flex;flex-wrap:wrap;gap:64px}
.hm-leave-a{flex:1 1 320px;display:flex;flex-direction:column;gap:24px;min-width:0}
.hm-leave-b{flex:1 1 420px;display:flex;flex-direction:column;gap:24px;min-width:0}
.hm .faq{display:flex;flex-direction:column}
.hm .faq .faq-item{border-top:1px solid var(--line);padding:18px 0}
.hm .faq .faq-item:last-child{border-bottom:0}
.hm .faq summary{list-style:none;cursor:pointer;min-height:0;display:flex;justify-content:space-between;gap:16px;font-family:var(--fd);font-size:.85rem;font-weight:700;letter-spacing:.06em;line-height:1.4;text-transform:none;color:var(--cream)}
.hm .faq summary::-webkit-details-marker{display:none}
.hm .faq summary::after{content:"+";color:var(--gold);flex:none;transition:transform 240ms var(--hm-ease)}
.hm .faq details[open] summary::after{transform:rotate(45deg)}
.hm .faq .faq-a{padding:0}
.hm .faq .faq-a p{margin:12px 0 0;color:var(--dim);max-width:40em}
.hm{interpolate-size:allow-keywords}
.hm details::details-content{block-size:0;overflow:hidden;transition:block-size 320ms var(--hm-ease),content-visibility 320ms allow-discrete}
.hm details[open]::details-content{block-size:auto}
/* ---------- breakpoints (as in the reference) ---------- */
@media (max-width:1180px){.orbitCore{--os:.84}}
@media (max-width:1000px){
.orbitCore{--os:.66}.orbitStage{height:440px}
.liveCard{grid-template-columns:110px minmax(0,1fr)}
.lc-c{grid-column:1 / -1;border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:16px}
}
@media (max-width:760px){
.orbitHint{display:none !important}
.orbitCore{--os:.4}.orbitStage{height:300px}
.liveCard{grid-template-columns:1fr;padding:24px;gap:20px}
.heroBtns > a{flex:1 1 220px}
.hm-sec .hm-col,.hm-ask-in{padding-block:72px}
.hm-col{padding-inline:16px}
.hm-ring{width:160px;height:160px}
.hm-ring > div{transform:scale(.727);transform-origin:0 0}
.hm-ring > .hm-typing{transform:none}
}
@media (max-width:720px){.hm .dot{animation:none}}
/* Off screen or with the tab hidden (assets/house-membership.js), the endless loops rest; a dot still flying in
(hmDotIn) finishes. While the door plays, its two leaves sit on their own layers before they move. */
.hm-idle .drift,.hm-idle .spin,.hm-idle .float,.hm-idle .orbit,.hm-idle .counter,.hm-idle .sheen,.hm-idle .pulse,
html.hm-hidden .hm .drift,html.hm-hidden .hm .spin,html.hm-hidden .hm .float,html.hm-hidden .hm .orbit,html.hm-hidden .hm .counter,html.hm-hidden .hm .sheen,html.hm-hidden .hm .pulse{animation-play-state:paused}
.hm-idle .dot.live,html.hm-hidden .hm .dot.live{animation-play-state:running,paused}
html.hm-door .hm-hero:not(.is-gone) .gateL,html.hm-door .hm-hero:not(.is-gone) .gateR{will-change:transform}
@media (max-width:400px){.hm-ask-top .hm-ring{display:none}.hm-ask-lead{margin-top:0 !important}}
/* ---------- reduced motion and print: everything still, everything shown ---------- */
@media (prefers-reduced-motion:reduce){
.hm .dot,.hm .live,.hm .float,.hm .drift,.hm .spin,.hm .orbit,.hm .counter,.hm .pulse,.hm .key,.hm .sheen,.hm .tdot,.hm .askIn,.hm .gateKey,.askThread .read i{animation:none !important}
.hm .btnG,.hm .chipBtn,.hm details::details-content,.hm-rise,.keyWrap,.keyCap{transition:none !important}
.hm-gate{display:none !important}
}
@media print{.hm-gate{display:none !important}.hm .hm-rise{opacity:1 !important;transform:none !important}}
/* The House Membership band on the home page (between Tools and Engagements; entrants and Saudi companies, not for
members): the arch, the 64×4 bar, three outcomes, the price block with the countdown, two buttons. */
.hm-band{margin:0;font-size:16px}
.hm-band-in{display:grid;grid-template-columns:auto minmax(0,1fr) minmax(0,1.1fr);gap:40px 56px;align-items:center;padding-block:72px}
.hm-band-arch{width:84px;height:84px}
.hm-band-what{display:flex;flex-direction:column;gap:18px}
.hm-band-out li{font-family:var(--fd);font-size:.8125rem;font-weight:600;letter-spacing:.06em;color:var(--cream);padding:8px 0;border-top:1px solid var(--line)}
.hm-band-out li:first-child{border-top:0;padding-top:0}
.hm-band-price{display:flex;flex-direction:column;gap:10px}
.hm-band-amt{font-family:var(--fd);font-size:.875rem;font-weight:600;letter-spacing:.04em;color:var(--dim)}
.hm-band-amt b{font-size:1.75rem;font-weight:800;letter-spacing:0;color:var(--cream);margin-right:4px}
.hm-band .hm-countdown{margin:0 !important}
.hm-band-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin-top:10px}
.hm-band-more{font-family:var(--fd);font-size:.72rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px}
@media (max-width:900px){.hm-band-in{grid-template-columns:minmax(0,1fr);gap:28px;padding-block:56px}.hm-band-arch{width:64px;height:64px}.hm-band-arch svg{width:64px;height:64px}}
/* The hero's
is the gold line above the title (23 Oct 2026), drawn as that line was; the title is a
. */
.hm h1.hm-eyebrow{text-transform:uppercase;line-height:inherit;text-wrap:wrap}
.hm p.hm-h1{text-wrap:balance}