/* ============================================================
   fam.matthewjankowski.com — family-archive layer over the
   lodge design system (style.css). Same parchment/Deco idiom.
   ============================================================ */

.wrap{max-width:1080px;margin:0 auto;padding:0 20px 64px;}
.site-header{text-align:center;padding:42px 16px 10px;}
.site-header .kicker{font-family:'Oswald',sans-serif;letter-spacing:.28em;font-size:.72rem;color:var(--ink-muted);margin:0 0 10px;}
.site-title{font-family:'Cinzel Decorative','Cinzel',serif;font-weight:900;font-size:clamp(2rem,5.5vw,3.4rem);margin:.1em 0;color:var(--ink-primary);}
.site-sub{font-family:'Cinzel',serif;letter-spacing:.14em;color:var(--brass-deep);font-size:.95rem;margin:.2em 0 14px;}
.deco-rule{height:3px;background:linear-gradient(90deg,transparent,var(--brass) 20%,var(--brass) 80%,transparent);margin:10px auto;max-width:720px;position:relative;}
.deco-rule::after{content:"◆";position:absolute;left:50%;top:50%;transform:translate(-50%,-52%);color:var(--brass);background:var(--surface-0);padding:0 10px;font-size:.8rem;}
.site-nav{margin:16px 0 4px;display:flex;gap:6px;justify-content:center;flex-wrap:wrap;}
.site-nav a{font-family:'Oswald',sans-serif;letter-spacing:.12em;text-transform:uppercase;font-size:.82rem;color:var(--ink-secondary);text-decoration:none;padding:8px 16px;border:1px solid var(--rule-hairline);border-radius:2px;background:var(--surface-1);}
.site-nav a.active,.site-nav a:hover{color:var(--brass-deep);border-color:var(--brass);background:var(--surface-2);}

.card{background:var(--surface-1);border:1px solid var(--rule-hairline);border-radius:3px;box-shadow:0 1px 0 rgba(32,26,18,.06),0 6px 22px rgba(32,26,18,.07);padding:26px 30px;margin:22px 0;}
.lede p{font-family:'Lora',serif;font-size:1.06rem;line-height:1.75;color:var(--ink-primary);}
.dropcap::first-letter{font-family:'Cinzel Decorative',serif;font-size:3.2em;float:left;line-height:.85;padding:.04em .12em 0 0;color:var(--oxblood);}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px;}
.btn{display:inline-block;font-family:'Oswald',sans-serif;letter-spacing:.1em;text-transform:uppercase;font-size:.85rem;background:var(--brass);color:#fff;padding:11px 20px;border-radius:2px;text-decoration:none;border:1px solid var(--brass-deep);}
.btn:hover{background:var(--brass-deep);}
.btn.ghost{background:transparent;color:var(--brass-deep);}
.btn.ghost:hover{background:var(--surface-2);}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;}
.tile{text-decoration:none;color:inherit;transition:transform .12s ease;}
.tile:hover{transform:translateY(-2px);}
.tile h3{font-family:'Cinzel',serif;color:var(--oxblood);margin:0 0 8px;}
.tile p{font-family:'Lora',serif;color:var(--ink-secondary);line-height:1.6;margin:0;font-size:.95rem;}
.contribute-banner h3{font-family:'Cinzel',serif;color:var(--verdigris);margin-top:0;}
.contribute-banner p{font-family:'Lora',serif;line-height:1.7;color:var(--ink-secondary);}
.site-footer{text-align:center;margin-top:40px;color:var(--ink-muted);font-family:'Lora',serif;font-size:.9rem;}
.site-footer .fine{font-size:.78rem;}

/* ---------- TREE ---------- */
.branch{margin:34px 0;}
.branch>h2{font-family:'Cinzel',serif;font-size:1.5rem;color:var(--ink-primary);border-bottom:2px solid var(--brass);padding-bottom:8px;margin-bottom:2px;}
.branch>.sub{font-family:'Lora',serif;font-style:italic;color:var(--ink-muted);margin:6px 0 16px;}
.group{margin:14px 0 22px;}
.group>h4{font-family:'Oswald',sans-serif;letter-spacing:.14em;text-transform:uppercase;font-size:.78rem;color:var(--brass-deep);margin:0 0 10px;}
.people{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;}
.pcard{background:var(--surface-2);border:1px solid var(--rule-hairline);border-left:4px solid var(--brass);border-radius:2px;padding:12px 14px;cursor:pointer;transition:box-shadow .12s;}
.pcard:hover{box-shadow:0 4px 14px rgba(32,26,18,.15);}
.pcard.direct{border-left-color:var(--oxblood);}
.pcard .nm{font-family:'Cinzel',serif;font-weight:700;font-size:1.0rem;color:var(--ink-primary);}
.pcard .dt{font-family:'Oswald',sans-serif;font-size:.78rem;letter-spacing:.06em;color:var(--ink-muted);margin-top:3px;}
.pcard .rl{font-family:'Lora',serif;font-style:italic;font-size:.8rem;color:var(--oxblood);margin-top:4px;}
.pcard .ac{font-family:'Oswald',sans-serif;font-size:.7rem;color:var(--verdigris);margin-top:5px;letter-spacing:.08em;}
.pcard.living .dt{color:var(--verdigris);}

/* detail panel */
.panel-back{position:fixed;inset:0;background:rgba(32,26,18,.45);display:none;z-index:40;}
.panel{position:fixed;top:0;right:0;bottom:0;width:min(560px,94vw);background:var(--surface-1);border-left:2px solid var(--brass);z-index:50;transform:translateX(102%);transition:transform .22s ease;overflow-y:auto;padding:26px 28px 40px;}
.panel.open{transform:none;}
.panel-back.open{display:block;}
.panel .close{position:absolute;top:14px;right:16px;font-size:1.5rem;background:none;border:none;color:var(--ink-muted);cursor:pointer;}
.panel h2{font-family:'Cinzel',serif;color:var(--ink-primary);margin:4px 0 2px;}
.panel .dates{font-family:'Oswald',sans-serif;letter-spacing:.08em;color:var(--brass-deep);}
.panel .role{font-family:'Lora',serif;font-style:italic;color:var(--oxblood);margin:4px 0 14px;}
.panel .living-note{font-family:'Lora',serif;color:var(--verdigris);border:1px dashed var(--verdigris);padding:10px 14px;border-radius:2px;}
.factline{border-top:1px solid var(--rule-hairline);padding:10px 0;font-family:'Lora',serif;}
.factline .fl{font-family:'Oswald',sans-serif;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-deep);}
.factline .fv{color:var(--ink-primary);line-height:1.55;margin:2px 0;}
.factline .fs{font-size:.78rem;color:var(--ink-muted);}
.factline a.doc{color:var(--verdigris);font-size:.82rem;text-decoration:underline;}
.panel .thumbs{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0;}
.panel .thumbs img{height:86px;border:1px solid var(--rule-strong);border-radius:2px;cursor:pointer;background:#fff;}

/* contributions */
.contrib{margin-top:20px;border-top:2px solid var(--brass);padding-top:14px;}
.contrib h3{font-family:'Cinzel',serif;color:var(--verdigris);margin:0 0 6px;font-size:1.05rem;}
.contrib textarea{width:100%;min-height:90px;font-family:'Lora',serif;font-size:.95rem;background:var(--surface-2);border:1px solid var(--rule-strong);border-radius:2px;padding:10px;box-sizing:border-box;}
.contrib input[type=text]{width:100%;font-family:'Lora',serif;font-size:.95rem;background:var(--surface-2);border:1px solid var(--rule-strong);border-radius:2px;padding:8px 10px;margin:8px 0;box-sizing:border-box;}
.contrib .hp{display:none;}
.contrib button{margin-top:6px;}
.contrib .status{font-family:'Oswald',sans-serif;font-size:.8rem;letter-spacing:.06em;margin-top:8px;color:var(--verdigris);}
.contrib .status.err{color:var(--oxblood-bright);}
.memories .mem{background:var(--surface-2);border-left:3px solid var(--verdigris);padding:10px 14px;margin:8px 0;font-family:'Lora',serif;}
.memories .mem .who{font-family:'Oswald',sans-serif;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-muted);margin-top:6px;}

/* ---------- TIMELINE ---------- */
.tl{position:relative;margin:30px 0;padding-left:26px;}
.tl::before{content:"";position:absolute;left:8px;top:0;bottom:0;width:3px;background:linear-gradient(180deg,var(--brass),var(--oxblood));border-radius:2px;}
.tl-ev{position:relative;margin:0 0 26px;}
.tl-ev::before{content:"";position:absolute;left:-24px;top:10px;width:13px;height:13px;border-radius:50%;background:var(--surface-2);border:3px solid var(--brass);}
.tl-ev.era1::before{border-color:var(--era-1);} .tl-ev.era2::before{border-color:var(--era-2);}
.tl-ev.era3::before{border-color:var(--era-3);} .tl-ev.era4::before{border-color:var(--era-4);}
.tl-ev.era5::before{border-color:var(--era-5);}
.tl-ev .yr{font-family:'Cinzel',serif;font-weight:700;color:var(--brass-deep);font-size:1.05rem;}
.tl-ev h3{font-family:'Cinzel',serif;margin:.15em 0 .3em;color:var(--ink-primary);font-size:1.2rem;}
.tl-ev p{font-family:'Lora',serif;line-height:1.7;color:var(--ink-secondary);margin:.3em 0;}
.tl-ev .tl-assets img{height:110px;border:1px solid var(--rule-strong);border-radius:2px;margin:6px 8px 0 0;cursor:pointer;background:#fff;}
.tl-ev .addmem{font-family:'Oswald',sans-serif;font-size:.74rem;letter-spacing:.1em;text-transform:uppercase;color:var(--verdigris);background:none;border:1px solid var(--verdigris);border-radius:2px;padding:5px 10px;cursor:pointer;margin-top:8px;}
.tl-ev .addmem:hover{background:var(--surface-2);}

/* ---------- GALLERY ---------- */
.ggroup h2{font-family:'Cinzel',serif;border-bottom:2px solid var(--brass);padding-bottom:6px;color:var(--ink-primary);}
.gg{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px;margin:16px 0 30px;}
.gg figure{margin:0;background:var(--surface-2);border:1px solid var(--rule-hairline);padding:8px;border-radius:2px;}
.gg img{width:100%;display:block;border:1px solid var(--rule-hairline);cursor:pointer;background:#fff;}
.gg figcaption{font-family:'Lora',serif;font-size:.72rem;color:var(--ink-muted);margin-top:6px;line-height:1.4;}

/* lightbox */
.lb{position:fixed;inset:0;background:rgba(20,16,10,.92);display:none;z-index:90;align-items:center;justify-content:center;flex-direction:column;padding:20px;}
.lb.open{display:flex;}
.lb img{max-width:96vw;max-height:88vh;border:2px solid var(--brass);background:#fff;}
.lb .cap{color:#e8dfc8;font-family:'Lora',serif;margin-top:10px;font-size:.9rem;text-align:center;}
.lb .x{position:absolute;top:14px;right:20px;font-size:2rem;color:#e8dfc8;background:none;border:none;cursor:pointer;}

@media (max-width:640px){ .card{padding:18px;} .panel{padding:20px 16px 36px;} }