/* Counsel home (Option G). Everything below the hero lives inside #hg; the rules are the
   mockup's, scoped to the wrapper, with the site's global element styling neutralised first. */
#hg { line-height:normal; font-feature-settings:normal; font-variation-settings:normal; text-rendering:auto; }
#hg *::before, #hg *::after { box-sizing:content-box; }
#hg button { transition:none !important; }
#hg button:hover { opacity:1; transform:none; }
#hg section[id] { scroll-margin-top:88px; }
#hg h1, #hg h2, #hg h3, #hg h4 { margin:0; font-weight:inherit; letter-spacing:normal; line-height:normal; font-size:inherit; font-family:inherit; }
#hg p, #hg li { line-height:normal; }
#hg em { color:inherit; font-weight:inherit; }
#hg strong, #hg b { font-weight:bold; }
#hg a { color:inherit; text-decoration:none; }
#hg footer { position:static; }
#hg img, #hg svg { max-width:none; }
#hg { --bg:#F7F5F0; --surface:#F4F2EC; --putty:#DDD8CF;
  --ink:#1B1B1B; --ink-soft:#44413B; --muted:#6F6A62; --whisper:#A7A096;
  --border:#DDD8CF; --border-light:#E8E3DA;
  --ocean:#6E7D91; --ocean-w:#E8EAED; --green:#5A6B57; --green-light:#E8ECDF;
  --gold:#C9A56A; --gold-text:#8a6d3f; --purple:#5b3fa6; --purple-wash:#F1EEF8;
  --band:#16140f; --band-text:#F3F0E8; --band-soft:rgba(245,243,238,.72);
  --band-dim:rgba(245,243,238,.45); --band-hair:rgba(255,255,255,.09); --champagne:#CDBB98;
  --sans:'DM Sans',system-ui,sans-serif; --serif:'Cormorant Garamond',Georgia,serif; }
#hg, #hg * { margin:0; padding:0; box-sizing:border-box; }
#hg { font-family:var(--sans); background:var(--bg); color:var(--ink); font-size:15px; -webkit-font-smoothing:antialiased; }
#hg em { font-family:var(--serif); font-style:italic; }
#hg .sec { padding:110px 6vw; }
#hg .door { display:inline-flex; align-items:center; gap:9px; margin-top:16px; padding:9px 14px; border:1px solid var(--border); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; font-weight:600; color:var(--ink); text-decoration:none; transition:border-color .25s ease, gap .25s ease; }
#hg .door:hover { border-color:var(--ink); gap:13px; }
#hg .door .bi { font-size:11px; color:var(--gold-text); }
#hg .ground { max-width:1240px; margin:0 auto; display:grid; grid-template-columns:0.8fr 1.55fr; gap:4vw; align-items:center; }
#hg .g-photos { display:grid; grid-template-columns:1fr 1fr; gap:14px; align-items:start; }
#hg .g-col { display:grid; gap:14px; }
#hg .g-photos figure { margin:0; overflow:hidden; background:var(--surface); }
#hg .g-photos figure.r43 { aspect-ratio:4/3; }
#hg .g-photos figure.r32 { aspect-ratio:3/2; }
#hg .g-photos img { width:100%; height:100%; object-fit:cover; display:block; transition:transform 1.6s ease; }
#hg .g-photos figure:hover img { transform:scale(1.03); }
@media (max-width:900px) {
  #hg .ground { grid-template-columns:1fr; }
}
#hg .trio { max-width:1180px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr 1fr; border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
#hg .tr-col { padding:40px 40px 42px 38px; border-left:1px solid var(--border); }
#hg .tr-col:first-child { border-left:0; padding-left:34px; }
#hg .tr-top { display:flex; align-items:baseline; gap:12px; margin-bottom:22px; font-family:var(--serif); font-size:23px; letter-spacing:-0.005em; color:var(--ink); }
#hg .tr-n { font-variant-numeric:tabular-nums; font-size:23px; letter-spacing:.04em; color:var(--ink); }
#hg .tr-tag { color:var(--ink); font-weight:500; }
#hg .tr-ico { font-size:26px; color:var(--gold); display:block; margin-bottom:18px; }
#hg .tr-title { font-family:var(--serif); font-size:26px; letter-spacing:-0.012em; color:var(--ocean); margin-bottom:10px; }
#hg .tr-title em { font-style:italic; }
#hg .tr-body { font-size:13.5px; line-height:1.7; color:var(--ink-soft); margin:0; min-height:2.6em; }
#hg .trio .door { margin-top:18px; }
@media (max-width:900px) {
  #hg .trio { grid-template-columns:1fr; }
  #hg .tr-col { border-left:0; border-top:1px solid var(--border); }
}
#hg .eyebrow { font-size:10.5px; letter-spacing:.26em; text-transform:uppercase; color:var(--gold-text); font-weight:600; margin-bottom:18px; }
#hg .h2 { font-family:var(--serif) !important; font-weight:300 !important; font-size:clamp(34px,4.4vw,58px); letter-spacing:-0.015em !important; line-height:1.08; }
#hg .lede { font-family:var(--serif); font-size:clamp(16px,1.5vw,20px); line-height:1.6; color:var(--ink-soft); max-width:60ch; margin-top:18px; }
#hg .lede .mark { color:var(--ink); font-weight:500; text-decoration:underline; text-decoration-color:var(--gold); text-decoration-thickness:1.5px; text-underline-offset:7px; }
#hg .cta { display:inline-flex; align-items:center; gap:10px; background:var(--ink); color:var(--band-text); font-size:12.5px; letter-spacing:.14em; text-transform:uppercase; font-weight:600; padding:15px 30px; text-decoration:none; margin-top:26px; }
#hg .cta.hg-ghost { background:transparent; color:var(--ink); border:1px solid var(--border); }
#hg .rv { opacity:0; transform:translateY(26px); transition:opacity .8s cubic-bezier(.2,.6,.2,1), transform .8s cubic-bezier(.2,.6,.2,1); }
#hg .rv.in { opacity:1; transform:none; }
/* vignette cards — no app chrome; a soft artifact, not a screenshot */
#hg .vig { border:1px solid var(--border); background:var(--bg); padding:26px 34px 28px; box-shadow:0 30px 80px -30px rgba(27,27,27,.20), 0 6px 20px -10px rgba(27,27,27,.08); position:relative; min-height:330px; }
#hg .vig .hg-wm { position:absolute; right:24px; top:20px; display:inline-flex; align-items:center; gap:11px; font-family:var(--serif); font-weight:500; font-size:15px; letter-spacing:.26em; text-transform:uppercase; color:var(--muted); }
#hg .vig .hg-wm img { width:26px; height:26px; object-fit:contain; opacity:.85; }
#hg .vig.dark .hg-wm { color:var(--band-dim); }
#hg .vig.dark .hg-wm img { filter:invert(1) brightness(1.6); opacity:.7; }
#hg .vig .vlbl { font-size:9.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); font-weight:600; margin-bottom:20px; }
#hg .vig.dark { background:var(--band); border-color:rgba(255,255,255,.12); color:var(--band-text); }
#hg .vig.dark .hg-wm { color:var(--band-dim); }
#hg .vig.dark .vlbl { color:var(--band-dim); }
/* V1 — the reading: serif lines with a sweeping gold read-mark */
#hg .read-p { font-family:var(--serif); font-size:clamp(18px,1.8vw,24px); line-height:1.75; letter-spacing:-0.005em; max-width:52ch; }
#hg .read-p .hl { background-image:linear-gradient(to right, rgba(201,165,106,.32), rgba(201,165,106,.32)); background-repeat:no-repeat; background-size:0% 38%; background-position:0 78%; transition:background-size 1.6s cubic-bezier(.3,.5,.2,1); }
#hg .vig.play .read-p .hl { background-size:100% 38%; }
#hg .vig.play .read-p .hl:nth-of-type(2) { transition-delay:1.2s; }
#hg .vig.play .read-p .hl:nth-of-type(3) { transition-delay:2.4s; }
#hg .read-coda { font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-text); font-weight:600; margin-top:22px; opacity:0; transition:opacity .8s ease 3.4s; }
#hg .vig.play .read-coda { opacity:1; }
#hg .sc-head { display:flex; align-items:baseline; gap:18px; margin-bottom:18px; padding-bottom:12px; border-bottom:1px solid var(--border-light); }
#hg .sc-n { font-size:11px; letter-spacing:.2em; color:var(--muted); font-weight:500; }
#hg .sc-t { font-family:var(--serif) !important; font-size:clamp(24px,2.4vw,32px); font-weight:400 !important; letter-spacing:-0.012em !important; margin:0; line-height:1.1; }
#hg .sc-s { font-family:var(--serif); font-style:italic; font-size:15.5px; color:var(--muted); margin-top:4px; }
#hg .vig.dark .sc-head { border-bottom-color:rgba(243,240,232,.12); }
#hg .vig.dark .sc-t { color:var(--band-text); }
#hg .vig.dark .sc-s, #hg .vig.dark .sc-n { color:var(--band-dim); }
#hg .room-demo { display:grid; grid-template-columns:1fr 1.1fr; gap:48px; align-items:start; }
#hg .rd-lbl { font-size:9.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--muted); font-weight:600; margin-bottom:10px; display:flex; align-items:center; gap:8px; }
#hg .rd-live { color:var(--gold-text); display:inline-flex; align-items:center; gap:6px; }
#hg .rd-live::before { content:''; width:6px; height:6px; border-radius:50%; background:var(--gold); animation:hg-rdPulse 1.6s ease-in-out infinite; }
@keyframes hg-rdPulse { 50% { opacity:.25; } }
#hg .sk-bar.dk { background:color-mix(in srgb, var(--ink) 9%, transparent); }
#hg .ov-grid { display:grid; grid-template-columns:1fr 1.1fr; gap:32px; align-items:start; }
#hg .ov-h { font-family:var(--serif); font-size:22px; letter-spacing:-0.01em; margin-bottom:10px; }
#hg .ov-row { display:grid; grid-template-columns:10px 64px 1fr; gap:12px; align-items:center; padding:10px 0; border-top:1px solid var(--border-light); }
#hg .ov-d { width:8px; height:8px; border-radius:50%; display:block; }
#hg .ov-k { font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); font-weight:600; }
#hg .ov-v { font-family:var(--serif); font-size:16.5px; color:var(--ink); }
#hg .ov-q { border-left:3px solid var(--purple); background:var(--purple-wash); padding:14px 16px 16px; }
#hg .ov-ql { font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--purple); font-weight:600; }
#hg .ov-qt { font-family:var(--serif); font-style:italic; font-size:16.5px; margin-top:6px; line-height:1.4; }
#hg .ov-doors { display:flex; gap:8px; margin-top:14px; }
#hg .ov-doors span { display:inline-flex; align-items:center; white-space:nowrap; padding:6px 11px; border:1px solid var(--border); background:var(--surface); font-family:var(--sans); font-size:11px; font-weight:500; color:var(--ink); }
#hg .jr-flow { display:flex; align-items:center; gap:14px; margin-bottom:16px; }
#hg .jf { font-size:10px; letter-spacing:.16em; text-transform:uppercase; font-weight:700; color:var(--muted); display:inline-flex; align-items:center; gap:8px; }
#hg .jf::before { content:''; width:7px; height:7px; border-radius:50%; border:1.5px solid var(--gold); background:var(--bg); }
#hg .jf.hg-on { color:var(--ink); }
#hg .jf.hg-on::before { background:var(--gold); }
#hg .jf-line { flex:0 0 34px; height:1px; background:var(--border); }
#hg .jr-grid2 { display:grid; grid-template-columns:1.15fr 1fr; gap:36px; align-items:stretch; }
#hg .pt { font-family:var(--serif); font-size:19px; font-weight:400; letter-spacing:0.01em; color:var(--ink); display:flex; align-items:baseline; gap:12px; margin-bottom:10px; line-height:1.1; }
#hg .pt-who { margin-left:auto; align-self:center; display:inline-flex; align-items:center; gap:10px; }
#hg .pt-who i { width:32px; height:32px; border-radius:50%; background:var(--ocean); color:#fff; font-family:var(--serif); font-style:normal; font-weight:500; font-size:12.5px; letter-spacing:.05em; display:inline-flex; align-items:center; justify-content:center; }
#hg .pt-who b { display:block; font-family:var(--serif); font-weight:500; font-size:14.5px; letter-spacing:0; color:var(--ink); line-height:1.1; }
#hg .pt-who small { display:block; font-family:var(--sans); font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin-top:3px; font-weight:500; }
#hg .pt-sub { font-family:var(--serif); font-size:14.5px; font-weight:500; letter-spacing:0.01em; color:var(--ink-soft); }
#hg .jr-prompt { display:flex; align-items:baseline; gap:12px; border-left:3px solid var(--purple); background:var(--purple-wash); padding:9px 14px; margin:2px 0 14px; }
#hg .jr-pk { font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--purple); font-weight:700; white-space:nowrap; }
#hg .jr-prompt em { font-family:var(--serif); font-style:italic; font-size:15.5px; color:var(--ink); }
#hg .jr-text { font-family:var(--serif); font-size:17.5px; line-height:1.55; margin-bottom:6px; color:var(--ink); max-width:44ch; }
#hg .jr-foot { display:flex; gap:8px; margin-top:20px; flex-wrap:wrap; }
#hg .iw { border-left:3px solid var(--purple); background:var(--purple-wash); padding:16px 20px 18px; display:flex; flex-direction:column; }
#hg .hg-iw-nav { display:flex; gap:22px; border-bottom:1px solid color-mix(in srgb, var(--purple) 18%, var(--border)); margin-top:2px; }
#hg .hg-iw-tab { font-family:var(--serif); font-size:17px; color:var(--muted); padding:0 0 8px; position:relative; }
#hg .hg-iw-tab.hg-active { color:var(--ink); }
#hg .hg-iw-tab.hg-active::after { content:''; position:absolute; left:0; right:0; bottom:-1px; height:2px; background:var(--ink); }
#hg .iw-rail { display:flex; gap:14px; margin-top:12px; font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; font-weight:700; color:var(--muted); }
#hg .iw-rail .hg-on { color:var(--purple); }
#hg .iw-panel { padding:10px 0 4px; }
#hg .iwp-k { font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--purple); font-weight:700; margin-bottom:5px; }
#hg .iwp-v { font-family:var(--serif); font-size:17px; line-height:1.45; color:var(--ink); }
#hg .iwp-v2 { font-size:12.5px; color:var(--ink-soft); }
#hg .iw-wrap { margin-top:auto; padding-top:16px; display:flex; gap:8px; flex-wrap:wrap; }
#hg .iw-private { display:inline-flex; align-items:center; gap:7px; padding:4px 10px 5px; border:1px solid color-mix(in srgb, var(--purple) 32%, var(--border)); background:var(--bg); font-family:var(--serif); font-size:14px; font-weight:500; letter-spacing:0.01em; color:var(--purple); }
#hg .iw-private i { font-size:11px; }
#hg .jr-cap { font-family:var(--serif); font-size:17px; line-height:1.55; color:var(--ink-soft); margin:18px 0 0; max-width:none; }
#hg .pnl { border:1px solid var(--border-light); background:var(--surface); padding:20px 22px 20px; display:flex; flex-direction:column; }
#hg .pnl.hg-oc { border:0; border-left:3px solid var(--ocean); background:var(--ocean-w); }
#hg .pr { display:grid; grid-template-columns:132px 1fr; gap:14px; padding:10px 0; border-top:1px solid color-mix(in srgb, var(--ink) 8%, transparent); align-items:start; }
#hg .pk { font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); font-weight:700; padding-top:4px; display:flex; align-items:center; }
#hg .pnl.hg-oc .pk { color:var(--ocean); }
#hg .pv { font-family:var(--serif); font-size:16px; line-height:1.45; color:var(--ink); }
#hg .pv .hg-muted { color:var(--muted); }
#hg .pnl-foot { display:flex; gap:8px; flex-wrap:wrap; margin-top:auto; padding-top:16px; }
#hg .pt-sub.live { display:inline-flex; align-items:center; gap:7px; color:var(--gold-text); }
#hg .pt-sub.live i { width:7px; height:7px; border-radius:50%; background:var(--gold); animation:hg-rdPulse 1.6s ease-in-out infinite; }
#hg .jf.hg-done::before { background:var(--gold); }
#hg .jf.hg-done { color:var(--muted); }
#hg .st-dot { background:var(--ocean); transition:background 1s ease; }
#hg .vig[data-stage="2"] .st-dot { background:var(--gold); }
#hg .vig[data-stage="3"] .st-dot { background:var(--green); }
#hg .st-state { display:block; font-family:var(--sans); font-size:9.5px; letter-spacing:.12em; text-transform:uppercase; font-weight:700; color:var(--gold-text); margin-top:5px; white-space:nowrap; }
#hg .room { margin-top:6px; background:var(--band); color:var(--band-text); border:1px solid rgba(255,255,255,.06); font-family:var(--sans); }
#hg .rm-top { display:flex; justify-content:space-between; align-items:center; padding:9px 12px; border-bottom:1px solid var(--band-hair); }
#hg .rm-brand { font-family:var(--serif); font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--band-dim); }
#hg .rm-timer { display:inline-flex; align-items:center; gap:6px; font-size:10.5px; letter-spacing:.06em; color:var(--band-soft); font-variant-numeric:tabular-nums; }
#hg .rm-timer i { width:6px; height:6px; border-radius:50%; background:var(--gold); animation:hg-rdPulse 1.6s ease-in-out infinite; }
#hg .rm-body { display:grid; grid-template-columns:1.25fr 1fr; }
#hg .rm-video { padding:12px; border-right:1px solid var(--band-hair); display:flex; flex-direction:column; gap:10px; }
#hg .rm-tiles { position:relative; aspect-ratio:4/3; }
#hg .rm-tile { position:absolute; inset:0; background:var(--band-3); border:1px solid var(--band-hair); display:flex; align-items:center; justify-content:center; }
#hg .rm-tile.small { inset:auto 8px 8px auto; width:34%; aspect-ratio:4/3; background:var(--band-2); }
#hg .rm-av { font-family:var(--serif); font-size:20px; color:var(--champagne); letter-spacing:.06em; }
#hg .rm-tile.small .rm-av { font-size:12px; }
#hg .rm-lbl { position:absolute; left:8px; bottom:6px; font-size:9px; letter-spacing:.1em; text-transform:uppercase; color:var(--band-dim); }
#hg .rm-ctl { display:flex; justify-content:center; gap:8px; }
#hg .rm-ctl i { width:26px; height:26px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:11px; background:var(--band-2); border:1px solid var(--band-hair); color:var(--band-soft); }
#hg .rm-ctl i.end { color:#e2b1a6; border-color:rgba(226,177,166,.3); }
#hg .rm-side { padding:12px 14px 14px; display:flex; flex-direction:column; gap:8px; }
#hg .rm-sig { font-family:var(--serif); font-size:14px; color:var(--band-text); display:flex; justify-content:space-between; align-items:baseline; }
#hg .rm-sig em { font-style:italic; }
#hg .rm-sig span { font-size:9px; letter-spacing:.16em; text-transform:uppercase; color:var(--band-dim); font-family:var(--sans); }
#hg .rm-tabs { display:flex; gap:14px; border-bottom:1px solid var(--band-hair); font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--band-dim); }
#hg .rm-tabs span { padding:4px 0 6px; }
#hg .rm-tabs .hg-on { color:var(--champagne); box-shadow:inset 0 -1.5px 0 var(--champagne); }
#hg .rm-line { font-size:11px; line-height:1.45; color:var(--band-soft); display:grid; grid-template-columns:36px 1fr; gap:8px; }
#hg .rm-line b { font-weight:500; color:var(--champagne); font-variant-numeric:tabular-nums; }
#hg .rm-btn { margin-top:auto; text-align:center; font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; font-weight:600; color:var(--band-text); border:1px solid rgba(255,255,255,.22); padding:7px 8px; }
#hg .bf-short { padding:8px 0 4px; }
#hg .sh-row { display:grid; grid-template-columns:82px 1fr 16px; gap:12px; align-items:center; padding:8px 0; border-top:1px solid var(--border-light); }
#hg .sh-when { font-size:10.5px; letter-spacing:.06em; color:var(--muted); font-variant-numeric:tabular-nums; }
#hg .sh-row b { display:block; font-family:var(--serif); font-size:16px; font-weight:500; letter-spacing:-0.005em; }
#hg .sh-row span:not(.sh-when) { display:block; font-size:11px; color:var(--muted); margin-top:2px; }
#hg .sh-row i { color:var(--green); font-size:14px; }
#hg .sh-row.quiet b, #hg .sh-row.quiet .sh-when { color:var(--muted); }
#hg .sh-row.quiet i { color:var(--muted); }
#hg .pnl.dk { background:var(--band-2); border:1px solid var(--band-hair); }
#hg .ent .pt { color:var(--band-text); }
#hg .ent .pt-sub { color:var(--band-dim); }
#hg .ent .pr { border-top-color:var(--band-hair); }
#hg .ent .pk { color:var(--champagne); }
#hg .ent .pv { color:var(--band-text); }
#hg .ent .pv .hg-muted { color:var(--band-dim); }
#hg .ent .chip-quiet { background:transparent; border-color:rgba(255,255,255,.18); color:var(--band-soft); }
#hg .room2 { background:var(--band); color:var(--band-text); border:1px solid rgba(255,255,255,.06); font-family:var(--sans); margin-top:4px; --band-2:#1C1914; --band-3:#211D17; --room-red:#7C2D2D; }
#hg .r2-top { display:flex; align-items:center; gap:14px; padding:10px 16px; border-bottom:1px solid var(--band-hair); }
#hg .r2-brand { display:inline-flex; align-items:center; gap:9px; }
#hg .r2-brand img { width:20px; height:20px; object-fit:contain; filter:invert(1); opacity:.9; }
#hg .r2-brand b { display:block; font-family:var(--serif); font-weight:500; font-size:11px; letter-spacing:.24em; text-transform:uppercase; color:var(--band-text); line-height:1.15; }
#hg .r2-brand small { display:block; font-size:7.5px; letter-spacing:.3em; text-transform:uppercase; color:var(--band-dim); font-weight:500; margin-top:2px; }
#hg .r2-nav { display:inline-flex; gap:14px; margin-left:8px; font-size:10.5px; letter-spacing:.04em; color:var(--band-dim); }
#hg .r2-nav .hg-on { color:var(--band-text); }
#hg .r2-right { margin-left:auto; display:inline-flex; align-items:center; gap:14px; }
#hg .r2-badge { display:inline-flex; align-items:center; gap:6px; font-size:9.5px; font-weight:600; color:var(--champagne); border:1px solid rgba(205,187,152,.4); padding:4px 9px; }
#hg .r2-badge .bi { font-size:10px; opacity:.8; }
#hg .r2-timer { display:inline-flex; align-items:center; gap:7px; font-size:11px; color:var(--band-soft); font-variant-numeric:tabular-nums; }
#hg .r2-timer i { width:6px; height:6px; border-radius:50%; background:#b83232; }
#hg .r2-end { font-size:10.5px; font-weight:500; letter-spacing:.06em; color:var(--band-text); border:1px solid rgba(255,255,255,.3); padding:6px 14px; }
#hg .r2-shell { display:grid; grid-template-columns:1fr 300px; }
#hg .r2-video { display:flex; flex-direction:column; border-right:1px solid var(--band-hair); }
#hg .r2-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:16px 16px 0; flex:1; min-height:0; }
#hg .r2-tile { position:relative; min-height:0; border:1px solid var(--band-hair); overflow:hidden; background:var(--band-2); }
#hg .r2-tile img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
#hg .r2-tile.analyzed { outline:1px solid var(--champagne); outline-offset:-1px; }
#hg .r2-lbl { position:absolute; left:10px; bottom:10px; font-size:10px; letter-spacing:.04em; color:var(--band-soft); background:rgba(20,18,14,.72); padding:4px 9px; }
#hg .r2-an { position:absolute; top:8px; right:8px; display:inline-flex; align-items:center; gap:5px; font-size:8.5px; letter-spacing:.08em; text-transform:uppercase; font-weight:600; color:var(--champagne); border:1px solid var(--champagne); background:rgba(20,18,14,.8); padding:0 9px; height:22px; }
#hg .r2-an .bi { font-size:8px; }
#hg .r2-ctl { display:flex; justify-content:center; gap:11px; padding:11px 0 12px; }
#hg .r2-ctl i { width:36px; height:36px; display:inline-flex; align-items:center; justify-content:center; font-size:13px; background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.22); color:var(--band-soft); }
#hg .r2-ctl i.end { background:var(--room-red); border-color:var(--room-red); color:#F3F0E8; }
#hg .r2-panel { display:flex; flex-direction:column; font-size:11px; }
#hg .r2-sig { font-family:var(--serif); font-size:15.5px; display:flex; justify-content:space-between; align-items:baseline; padding:10px 16px 6px; }
#hg .r2-sig em { font-style:italic; }
#hg .r2-sig span { font-family:var(--sans); font-size:8.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--band-dim); font-weight:600; }
#hg .r2-tabs { display:flex; align-items:center; gap:18px; padding:0 16px; border-bottom:1px solid var(--band-hair); font-size:9.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--band-dim); font-weight:500; }
#hg .r2-tabs span { padding:0 0 9px; }
#hg .r2-tabs .hg-on { color:var(--band-text); box-shadow:inset 0 -2px 0 var(--champagne); }
#hg .r2-tabs .gear { margin-left:auto; letter-spacing:0; font-size:11px; padding-bottom:8px; }
#hg .r2-sec { padding:9px 16px; border-bottom:1px solid rgba(255,255,255,.055); }
#hg .r2-sec:last-child { border-bottom:0; }
#hg .r2-lbl2 { display:flex; justify-content:space-between; align-items:baseline; font-size:8.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--band-dim); font-weight:600; margin-bottom:7px; }
#hg .r2-moment { border:1px solid rgba(255,255,255,.13); background:rgba(255,255,255,.022); padding:8px 11px; }
#hg .r2-mh { display:flex; align-items:baseline; gap:8px; margin-bottom:4px; }
#hg .r2-mh b { font-size:9px; font-weight:600; color:var(--champagne); letter-spacing:.08em; font-variant-numeric:tabular-nums; }
#hg .r2-mh span { font-size:9px; color:var(--band-dim); text-transform:uppercase; letter-spacing:.12em; }
#hg .r2-mq { font-family:var(--serif); font-style:italic; font-size:13.5px; color:var(--band-text); line-height:1.4; margin-bottom:6px; }
#hg .r2-ms { display:flex; flex-wrap:wrap; gap:5px; }
#hg .r2-ms span { font-size:9px; padding:2px 7px; border:1px solid rgba(255,255,255,.14); color:var(--band-soft); display:inline-flex; align-items:center; gap:4px; }
#hg .r2-ms .alert { border-color:rgba(205,187,152,.55); color:var(--champagne); }
#hg .r2-ms .nlp { color:var(--band-dim); }
#hg .r2-li { padding:8px 0 0; }
#hg .r2-li .hg-h { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:2px; }
#hg .r2-li .hg-h b { font-size:8.5px; letter-spacing:.14em; text-transform:uppercase; font-weight:600; color:var(--champagne); }
#hg .r2-li .hg-h span { font-size:9.5px; color:var(--band-dim); font-variant-numeric:tabular-nums; }
#hg .r2-li p { font-size:10.5px; color:var(--band-soft); line-height:1.5; margin:0; }
#hg .r2-delta { display:flex; justify-content:space-between; align-items:baseline; gap:12px; padding:3px 0; border-bottom:1px solid rgba(255,255,255,.05); font-size:10.5px; }
#hg .r2-delta:last-child { border-bottom:0; }
#hg .r2-delta span { color:var(--band-soft); }
#hg .r2-delta b { font-weight:400; color:var(--band-text); text-align:right; }
#hg .r2-delta b.up { color:var(--champagne); }
#hg .room2 .sk-caret { background:var(--band-text); height:11px; }
#hg .jr-grid { display:grid; grid-template-columns:1.05fr 1fr; gap:56px; align-items:center; }
#hg .jr-mock { border:1px solid var(--border-light); background:var(--surface); padding:26px 28px 24px; }
#hg .sk-head { width:36%; height:13px; background:color-mix(in srgb, var(--ink) 17%, transparent); margin-bottom:20px; transform:scaleX(0); transform-origin:left; transition:transform .8s cubic-bezier(.3,.6,.2,1) .15s; }
#hg .sk-bar { height:10px; background:color-mix(in srgb, var(--ink) 9%, transparent); margin:13px 0; transform:scaleX(0); transform-origin:left; transition:transform .9s cubic-bezier(.3,.6,.2,1); }
#hg .jr-mock .sk-bar:nth-of-type(2) { transition-delay:.4s; }
#hg .jr-mock .sk-bar:nth-of-type(3) { transition-delay:.75s; }
#hg .sk-last { display:flex; align-items:center; gap:6px; margin:13px 0 0; }
#hg .sk-last .sk-bar { transition-delay:1.1s; }
#hg .sk-caret { width:2px; height:16px; background:var(--gold-text); animation:hg-skblink 1.1s steps(1) infinite; }
@keyframes hg-skblink { 50% { opacity:0; } }
#hg .vig.play .sk-head, #hg .vig.play .sk-bar { transform:scaleX(1); }
@media (max-width:900px) {
  #hg .jr-grid { grid-template-columns:1fr; gap:28px; }
}
/* V2 — the thread: dated fragments joined by a drawn line */
#hg .thr { position:relative; padding-left:26px; }
#hg .thr svg { position:absolute; left:6px; top:8px; height:calc(100% - 14px); width:2px; overflow:visible; }
#hg .thr-line { stroke:var(--purple); stroke-width:1.5; fill:none; stroke-dasharray:400; stroke-dashoffset:400; }
#hg .vig.play .thr-line { animation:hg-draw 2.6s ease forwards .3s; }
@keyframes hg-draw { to { stroke-dashoffset:0; } }
#hg .frag { border:1px solid var(--border-light); background:var(--surface); padding:13px 17px; margin-bottom:14px; max-width:520px; opacity:0; transform:translateX(10px); transition:opacity .7s ease, transform .7s ease; }
#hg .vig.play .frag { opacity:1; transform:none; }
#hg .vig.play .frag:nth-of-type(2) { transition-delay:.8s; }
#hg .vig.play .frag:nth-of-type(3) { transition-delay:1.6s; }
#hg .frag .fd { font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); font-weight:600; margin-bottom:4px; }
#hg .frag .ft { font-family:var(--serif); font-style:italic; font-size:15px; line-height:1.5; color:var(--ink-soft); }
#hg .thr-coda { font-family:var(--serif); font-size:17px; margin-top:8px; opacity:0; transition:opacity .8s ease 2.6s; }
#hg .vig.play .thr-coda { opacity:1; }
/* V3 — the room: a breathing presence */
#hg .ring-wrap { display:flex; flex-direction:column; align-items:center; gap:26px; padding:12px 0; }
#hg .ring { width:120px; height:120px; border-radius:50%; border:1.5px solid rgba(205,187,152,.55); position:relative; animation:hg-breathe 5.2s ease-in-out infinite; }
#hg .ring::after { content:''; position:absolute; inset:14px; border-radius:50%; border:1px solid rgba(205,187,152,.25); }
@keyframes hg-breathe { 0%,100% { transform:scale(1); opacity:.75; } 50% { transform:scale(1.07); opacity:1; } }
#hg .room-line { font-family:var(--serif); font-size:clamp(17px,1.7vw,22px); color:var(--ink); max-width:34ch; line-height:1.5; }
#hg .room-chip { display:inline-block; border:1px solid var(--border); background:var(--surface); padding:9px 16px; font-size:11.5px; color:var(--ink-soft); }
/* V4 — the settling: one claim resolving */
#hg .recap-grid { display:grid; grid-template-columns:1.2fr 1fr; gap:44px; align-items:start; }
#hg .recap { border-left:3px solid var(--green); background:var(--green-light); padding:18px 22px 20px; }
#hg .rc-arc { font-family:var(--serif); font-size:18px; letter-spacing:-0.005em; line-height:1.35; margin:2px 0 12px; }
#hg .rc-row { display:grid; grid-template-columns:150px 1fr; gap:12px; padding:9px 0; border-top:1px solid color-mix(in srgb, var(--green) 22%, transparent); }
#hg .rc-k { font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--green); font-weight:700; padding-top:3px; }
#hg .rc-v { font-family:var(--serif); font-size:16px; line-height:1.45; }
#hg .rc-chips { display:flex; gap:8px; margin-top:14px; }
#hg .chip-sage { display:inline-flex; align-items:center; gap:6px; font-size:11px; font-weight:600; color:var(--green); border:1px solid color-mix(in srgb, var(--green) 40%, transparent); background:var(--bg); padding:5px 11px; }
#hg .chip-quiet { display:inline-flex; align-items:center; gap:7px; font-size:11px; color:var(--muted); border:1px solid var(--border); background:var(--bg); padding:5px 11px; }
#hg .settle { max-width:560px; }
#hg .st-row { display:flex; align-items:baseline; gap:16px; border:1px solid var(--border-light); padding:18px 22px; }
#hg .st-dot { width:8px; height:8px; border-radius:50%; background:var(--ocean); transition:background 1s ease; }
#hg .vig[data-stage="2"] .st-dot { background:var(--gold); }
#hg .vig[data-stage="3"] .st-dot { background:var(--green); }
#hg .st-t { font-family:var(--serif); font-size:17px; }
#hg .st-state { margin-left:auto; font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; font-weight:600; color:var(--muted); }
#hg .settle-coda { font-size:12px; color:var(--muted); margin-top:16px; line-height:1.6; }
/* theater */
#hg .theater { max-width:1040px; margin:0 auto; }
#hg .th-stage { display:grid; }
#hg .th-slide { grid-area:1 / 1; opacity:0; transition:opacity 1.6s cubic-bezier(.4,0,.2,1); pointer-events:none; display:flex; }
#hg .th-slide > .vig { flex:1; display:flex; flex-direction:column; }
#hg .th-slide > .vig > .jr-grid2 { flex:1; }
#hg .th-slide.hg-on { opacity:1; pointer-events:auto; }
#hg .th-rail { display:flex; margin-top:22px; border-top:1px solid var(--border); }
#hg .th-tab { flex:1; text-align:left; background:none; border:none; padding:14px 4px 0; cursor:pointer; font-family:var(--sans); }
#hg .th-tab .tt { font-size:11px; letter-spacing:.14em; text-transform:uppercase; font-weight:600; color:var(--muted); }
#hg .th-tab .ts { font-family:var(--serif); font-size:14px; color:var(--ink-soft); margin-top:3px; }
#hg .th-tab .bar { height:2px; background:var(--border-light); margin-bottom:12px; position:relative; overflow:hidden; }
#hg .th-tab .bar i { position:absolute; left:0; top:0; bottom:0; width:0; background:var(--ink); }
#hg .th-tab.hg-on .tt { color:var(--ink); }
#hg .th-tab.hg-on .bar i { animation:hg-fill 13s linear forwards; }
@keyframes hg-fill { to { width:100%; } }
/* marquee — professional,每 line true */
#hg .mq-band { border-top:1px solid var(--border); border-bottom:1px solid var(--border); overflow:hidden; padding:26px 0; background:var(--surface); }
#hg .mq { display:flex; gap:72px; width:max-content; animation:hg-drift 48s linear infinite; }
#hg .mq:hover { animation-play-state:paused; }
#hg .mq span { font-family:var(--serif); font-size:19px; color:var(--ink-soft); white-space:nowrap; }
#hg .mq span b { color:var(--ink); font-weight:500; }
@keyframes hg-drift { to { transform:translateX(-50%); } }
#hg .arch { border-top:1px solid var(--border); border-bottom:1px solid var(--border); max-width:980px; margin:0 auto; padding:44px 0; text-align:center; }
#hg .arch p { font-family:var(--serif); font-size:clamp(16px,1.6vw,21px); line-height:1.65; color:var(--ink-soft); }
#hg .ip { font-family:var(--serif); font-style:italic; font-size:16px; letter-spacing:-0.005em; color:var(--ink-soft); font-weight:400; display:inline-flex; align-items:center; }
#hg .trust { display:flex; align-items:center; justify-content:center; gap:30px; flex-wrap:wrap; margin-top:22px; }
#hg .cert { display:inline-flex; align-items:center; gap:10px; }
#hg .cert .bi { font-size:24px; color:var(--ink); }
#hg .cert .hg-ct { display:flex; flex-direction:column; line-height:1.15; text-align:left; }
#hg .cert .hg-ct b { font-family:var(--sans); font-size:13.5px; font-weight:700; letter-spacing:.02em; color:var(--ink); }
#hg .cert .hg-ct span { font-size:11px; color:var(--muted); }
#hg .quote-band { background:var(--band); padding:130px 6vw; text-align:center; position:relative; overflow:hidden; }
#hg .quote-band .enso { position:absolute; left:50%; top:50%; width:520px; height:520px; margin:-260px 0 0 -260px; opacity:.06; animation:hg-spin 90s linear infinite; }
@keyframes hg-spin { to { transform:rotate(360deg); } }
#hg .quote-band blockquote { font-family:var(--serif); font-weight:300; font-size:clamp(24px,3vw,40px); line-height:1.4; color:var(--band-text); max-width:26ch; margin:0 auto; position:relative; }
#hg .quote-band cite { display:block; font-family:var(--sans); font-style:normal; font-size:10.5px; letter-spacing:.22em; text-transform:uppercase; color:var(--champagne); margin-top:26px; }
#hg .split { display:grid; grid-template-columns:1fr 1fr; gap:6vw; align-items:center; max-width:1280px; margin:0 auto; }
#hg .ben { display:grid; grid-template-columns:24px 1fr; gap:16px; padding:18px 0; border-top:1px solid var(--border-light); align-items:start; }
#hg .ben i { font-size:16px; color:var(--gold-text); margin-top:5px; }
#hg .ben b { display:block; font-family:var(--serif); font-size:21px; font-weight:500; letter-spacing:-0.012em; line-height:1.15; color:var(--ink); margin-bottom:3px; }
#hg .ben > div { font-family:var(--serif); font-size:17px; line-height:1.5; letter-spacing:-0.005em; color:var(--muted); }
#hg .ben.on-dark { border-top-color:rgba(243,240,232,.14); }
#hg .ben.on-dark > div { color:var(--band-dim); }
#hg .ben.on-dark i { color:var(--champagne); }
#hg .ben.on-dark b { color:var(--band-text); }
#hg .split.rev > .txt { order:2; }
#hg .split.rev > .fr { order:1; }
#hg .foot { background:var(--band); color:var(--band-dim); padding:56px 6vw 44px; font-size:11px; letter-spacing:.08em; }
#hg .foot .frow { display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap; }
#hg .foot .frow + .frow { margin-top:26px; padding-top:22px; border-top:1px solid rgba(243,240,232,.12); }
#hg .foot .fbrand { display:flex; align-items:center; gap:16px; }
#hg .foot .fbrand img { width:42px; height:42px; object-fit:contain; filter:invert(1) brightness(1.6); opacity:.9; }
#hg .foot .fm { font-size:18px; letter-spacing:.26em; }
#hg .foot a { color:var(--band-dim); text-decoration:none; border-bottom:1px solid rgba(243,240,232,.22); margin-left:18px; }
#hg .foot a:hover { color:var(--band-soft); border-bottom-color:var(--band-soft); }
#hg .foot .fm { font-family:var(--serif); letter-spacing:.24em; text-transform:uppercase; color:var(--band-soft); }
#hg .spine { position:absolute; left:clamp(0px,1.8vw,28px); width:96px; z-index:6; pointer-events:none; }
#hg .spine svg { display:block; }
#hg .sp-rail { stroke:color-mix(in srgb, var(--gold) 20%, transparent); }
#hg .sp-draw { stroke:url(#spGrad); }
#hg .sp-head { stroke:var(--gold); filter:drop-shadow(0 0 5px color-mix(in srgb, var(--gold) 70%, transparent)); }
#hg .sp-tipdot { fill:var(--gold); filter:drop-shadow(0 0 6px color-mix(in srgb, var(--gold) 85%, transparent)); }
#hg .sp-halo { display:none; }
@keyframes hg-spPulse { 0%,100% { transform:scale(1); opacity:.9; } 50% { transform:scale(1.5); opacity:.2; } }
#hg .sp-node circle.core { fill:none; stroke:var(--gold); stroke-width:1.5; transition:fill .4s ease, stroke-width .3s ease; }
#hg .sp-node.hg-on circle.core { fill:none; }
#hg .sp-node.dock circle.core { fill:none; stroke-width:2; }
#hg .sp-node circle.bloom { fill:none; stroke:var(--gold); stroke-width:1.5; opacity:0; transform-box:fill-box; transform-origin:center; }
#hg .sp-node.hg-on circle.bloom { animation:hg-spBloom .9s cubic-bezier(.2,.6,.2,1) forwards; }
@keyframes hg-spBloom { 0% { opacity:.8; transform:scale(.4); } 100% { opacity:0; transform:scale(2.7); } }
@media (max-width:1000px) {
  #hg .spine { display:none; }
}
@media (prefers-reduced-motion: reduce) {
  #hg .rv { transition:none !important; opacity:1 !important; transform:none !important; }
  #hg, #hg * { animation:none !important; transition:none !important; }
  #hg .sp-draw { stroke-dashoffset:0 !important; }
  #hg .sp-head, #hg .sp-tip { display:none !important; }
  #hg .sp-node circle.core { fill:var(--gold-text) !important; }
  #hg .read-p .hl { background-size:100% 38% !important; }
  #hg .read-coda, #hg .frag, #hg .thr-coda { opacity:1 !important; transform:none !important; }
}
