/* Beacon Harbor Law demo — isolated brand (prefix bh-, no Lofty tokens). */
:root{
  --bh-harbor:#1E3A5F;
  --bh-beacon:#C77F3A;
  --bh-paper:#F4F0E6;
  --bh-ink:#1A2230;
  --bh-slate:#5C6670;
  --bh-line:#D8D0BE;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:#E5DECB;color:var(--bh-ink);
  font-family:Georgia,"Times New Roman",serif;line-height:1.55}

.bh-header{display:flex;align-items:center;gap:14px;background:var(--bh-harbor);color:var(--bh-paper);padding:16px 24px}
.bh-mark{width:40px;height:40px;flex:none}
.bh-header h1{margin:0;font-size:1.25rem;letter-spacing:.5px}
.bh-tag{margin:2px 0 0;font-family:Arial,sans-serif;font-size:.7rem;text-transform:uppercase;letter-spacing:.12em;color:#9DB1C6}

.bh-main{max-width:54rem;margin:0 auto;padding:22px 16px 40px}
.bh-controls{display:flex;flex-wrap:wrap;gap:18px;align-items:center;margin-bottom:22px}
.bh-ctrl-label{font-family:Arial,sans-serif;font-size:.74rem;font-weight:700;color:var(--bh-harbor);
  text-transform:uppercase;letter-spacing:.08em;display:block;margin-bottom:.35rem}
.bh-btnrow{display:flex;flex-wrap:wrap;gap:6px}
.bh-btn{font-family:Arial,sans-serif;font-size:.82rem;padding:.4rem .7rem;cursor:pointer;background:#fff;
  color:var(--bh-harbor);border:1.5px solid var(--bh-harbor);border-radius:2px}
.bh-btn.is-on{background:var(--bh-harbor);color:var(--bh-paper)}
.bh-btn:focus-visible,.bh-toggle input:focus-visible{outline:2px solid var(--bh-beacon);outline-offset:2px}
.bh-toggle{font-family:Arial,sans-serif;font-size:.82rem;display:flex;align-items:center;gap:.4rem;cursor:pointer;color:var(--bh-ink)}

.bh-stage{margin:0;display:flex;flex-direction:column;align-items:center;
  background:#cfc6b0;padding:34px 16px;border:1px solid var(--bh-line)}
.bh-caption{margin-top:18px;font-family:Arial,sans-serif;font-size:.78rem;color:#6A6450;text-align:center}

.bh-piecewrap{position:relative}
/* paper pieces */
.bh-paper-piece{position:relative;background:var(--bh-paper);box-shadow:6px 6px 0 0 rgba(30,58,95,.18);
  border:1px solid var(--bh-line)}
.bh-letterhead{width:300px;height:388px;padding:26px}
.bh-card{width:340px;height:198px;padding:22px}
.bh-envelope{width:380px;height:200px;padding:24px}
.bh-signature{width:360px;background:#fff;padding:20px}

.bh-lh-head{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--bh-harbor);padding-bottom:10px}
.bh-piece-mark{width:34px;height:46px;flex:none}
.bh-firm{font-size:1rem;color:var(--bh-harbor);letter-spacing:.06em;margin:0}
.bh-firm-sub{font-family:Arial,sans-serif;font-size:.6rem;letter-spacing:.16em;color:var(--bh-slate);margin:2px 0 0;text-transform:uppercase}
.bh-lines{margin-top:22px}
.bh-lines span{display:block;height:7px;background:var(--bh-line);margin-bottom:10px;border-radius:1px}
.bh-lines span:nth-child(3){width:70%}
.bh-foot{position:absolute;left:26px;right:26px;bottom:18px;border-top:1px solid var(--bh-harbor);
  padding-top:6px;font-family:Arial,sans-serif;font-size:.56rem;color:var(--bh-slate);display:flex;justify-content:space-between}

.bh-card-name{font-size:1.05rem;color:var(--bh-harbor);margin:14px 0 0}
.bh-card-role{font-family:Arial,sans-serif;font-size:.68rem;color:var(--bh-slate);text-transform:uppercase;letter-spacing:.1em;margin:2px 0 0}
.bh-card-contact{font-family:Arial,sans-serif;font-size:.66rem;color:var(--bh-ink);margin-top:14px;line-height:1.7}
.bh-emboss{position:absolute;right:22px;bottom:22px;width:54px;height:54px;border-radius:50%;
  border:1.5px dashed #B9B098;display:flex;align-items:center;justify-content:center;
  font-family:Arial,sans-serif;font-size:.52rem;text-align:center;color:#9A9078}

.bh-env-return{display:flex;align-items:center;gap:8px}
.bh-env-win{position:absolute;left:24px;bottom:36px;width:150px;height:42px;background:rgba(30,58,95,.06);border:1px solid var(--bh-line)}

.bh-sig-row{display:flex;align-items:center;gap:14px}
.bh-sig-name{font-size:1rem;color:var(--bh-harbor);margin:0}
.bh-sig-meta{font-family:Arial,sans-serif;font-size:.7rem;color:var(--bh-ink);line-height:1.6;margin:4px 0 0}
.bh-sig-rule{height:2px;background:var(--bh-beacon);margin:12px 0;width:60px}
.bh-sig-adv{font-family:Arial,sans-serif;font-size:.58rem;color:var(--bh-slate);margin-top:8px}

/* grid overlay */
.bh-piecewrap.show-grid .bh-paper-piece::after{content:"";position:absolute;inset:0;pointer-events:none;
  background-image:linear-gradient(rgba(30,58,95,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(30,58,95,.16) 1px,transparent 1px);
  background-size:16px 16px}

/* spec annotations */
.bh-annote{display:none;position:absolute;font-family:Arial,sans-serif;font-size:.6rem;
  color:#fff;background:var(--bh-beacon);padding:2px 6px;border-radius:2px;white-space:nowrap;z-index:2}
.bh-piecewrap.show-spec .bh-annote{display:block}
.bh-annote::before{content:"";position:absolute;width:8px;height:8px;background:var(--bh-beacon);
  transform:rotate(45deg);left:-3px;top:50%;margin-top:-4px}

.bh-footer{background:var(--bh-harbor);color:var(--bh-paper);text-align:center;padding:18px 16px;
  font-family:Arial,sans-serif;font-size:.78rem}
.bh-footer a{color:var(--bh-beacon)}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
