:root{--forest:#173e30;--forest2:#244d39;--moss:#315d45;--cream:#f6f1e5;--paper:#fcfaf5;--gold:#c5a46d;--ink:#2f382e;--muted:#68746b;--line:#deded1}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);font-family:'DM Sans',sans-serif;color:var(--ink);line-height:1.65}a{color:inherit}button{font:inherit}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:'Libre Baskerville',Georgia,serif;font-weight:400;line-height:1.25}em{font-weight:400;color:var(--gold)}.wrap{width:min(1140px,calc(100% - 48px));margin:auto}.skip{position:absolute;left:-9999px;top:10px;background:white;padding:12px;z-index:100}.skip:focus{left:10px}.site-header{position:relative;z-index:9;background:var(--forest);color:var(--cream);border-bottom:1px solid #ffffff24}.nav{min-height:88px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{font-family:Georgia,serif;text-decoration:none;letter-spacing:3px;font-size:23px;line-height:1;display:flex;align-items:center;gap:12px}.brand-mark{border:1px solid var(--gold);width:43px;height:43px;border-radius:50%;display:grid;place-items:center;color:var(--gold);font-size:30px}.brand-sub{display:block;font:600 9px 'DM Sans',sans-serif;letter-spacing:3.2px;color:#c7cdbb;margin-top:8px}nav{display:flex;align-items:center;gap:28px}nav a{font-size:12px;letter-spacing:.6px;text-decoration:none;color:#ecf1e5}nav a:hover,.footer a:hover{color:var(--gold)}.nav-outline{padding:11px 17px;border:1px solid #9aaf91;border-radius:2px}.menu-button{display:none}.hero{min-height:665px;position:relative;overflow:hidden;background:radial-gradient(circle at 76% 43%,#2b5c44,var(--forest) 53%,#102c23);color:var(--cream)}.hero-inner{position:relative;z-index:2;padding:92px 0 65px}.eyebrow,.kicker{font-weight:700;font-size:11px;letter-spacing:2.6px;color:var(--moss);margin-bottom:28px}.eyebrow{color:#d8cba9;display:flex;gap:14px;align-items:center}.gold-line{width:33px;height:1px;background:var(--gold)}h1{font-size:clamp(45px,5.1vw,73px);letter-spacing:-2px;max-width:750px;margin-bottom:27px}h1 em{font-style:italic}.hero p{max-width:532px;color:#dae2d4;line-height:1.9;font-size:15px}.hero-actions{display:flex;flex-wrap:wrap;gap:15px;margin:32px 0 66px}.button{min-height:49px;display:inline-flex;align-items:center;justify-content:center;gap:23px;padding:12px 23px;text-decoration:none;font-size:12px;font-weight:700;letter-spacing:.3px}.button.gold{background:var(--gold);color:#1e3427}.button.gold:hover{background:#e3c58e}.button.simple{border:1px solid #7f9983;color:var(--cream)}.button.simple:hover{background:#ffffff10}.hero-verse{font-family:Georgia,serif;font-style:italic;color:#d4dabb;font-size:14px}.hero-verse span{font-family:'DM Sans',sans-serif;font-size:10px;letter-spacing:1.3px;font-style:normal;padding-left:10px;color:#adbbab}.hero-tree{position:absolute;width:54%;height:100%;right:-10%;bottom:-7%;opacity:.7}.intro-section,.roots-section,.timeline-section,.records-section{padding:103px 0}.story-grid{display:grid;grid-template-columns:1fr 1fr;gap:75px}.story-grid h2,.section-heading h2,.roots-copy h2,.contribute-inner h2{font-size:clamp(32px,4vw,50px);letter-spacing:-1.2px}.story-grid h2 em,.section-heading h2 em,.roots-copy h2 em,.contribute-inner h2 em{font-style:italic;color:#97825b}.short-rule{height:2px;width:55px;background:var(--gold);margin-top:29px}.story-copy p,.roots-copy p{font-size:14px;line-height:2;color:#5a665e}.story-copy p strong,.roots-copy p strong{color:var(--forest)}.inline-link{display:inline-block;margin-top:10px;font-size:12px;font-weight:700;text-decoration:none;border-bottom:1px solid var(--gold);padding-bottom:5px;color:var(--forest)}.tree-section{background:#eef0e8;padding:92px 0 97px}.section-heading{margin-bottom:43px}.section-heading.center{text-align:center}.section-heading p:last-child{color:var(--muted);font-size:14px;max-width:625px;margin:14px auto 0}.tree-tools{display:flex;justify-content:center;gap:25px;font-size:11px;color:#657467;flex-wrap:wrap;margin-bottom:26px}.dot{display:inline-block;width:9px;height:9px;border-radius:100%;margin-right:6px;background:var(--gold)}.dot.living{background:#a9b5a3}.tree-scroll{overflow-x:auto;padding:12px 0 24px}.tree-layout{min-width:580px;display:flex;align-items:center;flex-direction:column}.tree-row{display:flex;align-items:center;gap:14px;justify-content:center}.person{border:1px solid #d1d9cc;border-radius:4px;background:#fffefa;width:225px;min-height:113px;cursor:pointer;box-shadow:0 7px 23px #20372b0b;padding:16px 12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;color:var(--ink)}.person:hover,.person:focus-visible{border-color:var(--gold);outline:2px solid transparent;box-shadow:0 5px 25px #173e3030}.person.featured{background:var(--forest);color:white;border-color:var(--forest)}.person small{font-size:9px;text-transform:uppercase;letter-spacing:1.5px;color:#8a957c}.person.featured small{color:#d9c49b}.person strong{font:normal 17px/1.35 Georgia,serif}.person span{font-size:11px;color:#79877b}.person.featured span{color:#c8d3bd}.join{font:italic 22px Georgia,serif;color:#9d9c81}.tree-connector{height:36px;width:1px;background:#a7b7a3;position:relative}.tree-connector:after{content:'';position:absolute;bottom:0;left:-3px;border:4px solid transparent;border-top-color:#a7b7a3}.person-detail{display:flex;align-items:flex-start;gap:22px;background:#fffefa;border:1px solid #d9dfd1;padding:27px 31px;margin:26px auto 0;max-width:775px}.detail-icon{color:#a88d5f;font-size:37px}.person-detail small{font-size:9px;font-weight:700;letter-spacing:2px;color:var(--moss)}.person-detail h3{font-size:23px;margin:8px 0 8px}.person-detail p{font-size:13px;color:#59695d;line-height:1.8;margin-bottom:8px}.person-detail a{font-size:12px;color:var(--moss);font-weight:700;text-decoration:none}.person-detail a[hidden]{display:none}.tree-note,.source-note{font-size:11px;line-height:1.7;color:#7d887d;text-align:center;max-width:700px;margin:20px auto 0}.roots-grid{display:grid;grid-template-columns:1.08fr .92fr;align-items:center;gap:85px}.roots-art{background:#e2decc;box-shadow:16px 16px 0 #eae9dc}.roots-art svg{width:100%;display:block}.art-caption{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:20px 22px;background:#e0d9c7;font-size:11px;font-weight:700;letter-spacing:1.3px;color:var(--forest)}.art-caption span{font-size:9px;color:#79765f}.roots-copy h2{margin-bottom:28px}.timeline-section{background:var(--cream)}.timeline{max-width:850px}.timeline-item{display:grid;grid-template-columns:150px 1fr;gap:35px;border-top:1px solid #d3d6c9;padding:26px 0}.timeline-item:last-child{border-bottom:1px solid #d3d6c9}.year{font:25px Georgia,serif;color:var(--moss)}.timeline h3{font-size:20px;margin:0 0 9px}.timeline p{font-size:13px;color:#69756d;margin:0}.record-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.record-card{border:1px solid var(--line);padding:30px 26px;background:white;min-height:270px;display:flex;flex-direction:column}.record-number{font-size:10px;letter-spacing:1.5px;color:#a18963;font-weight:700;margin-bottom:20px}.record-card h3{font-size:20px;margin-bottom:10px}.record-card p{font-size:12px;color:#657068;line-height:1.85;flex:1}.record-card a{font-size:11px;font-weight:700;color:var(--forest);text-decoration:none}.contribute-section{background:var(--forest);color:var(--cream);padding:105px 0}.contribute-inner{display:grid;grid-template-columns:1fr .7fr;gap:120px;align-items:center}.kicker.light{color:#d5c29b}.contribute-inner h2 em{color:var(--gold)}.contribute-inner>div>p:not(.kicker){font-size:14px;color:#d3decf;max-width:500px;line-height:1.9}.contribute-inner .button{margin-top:14px}.contribute-inner .email-note{font-size:11px!important;color:#b7c5b5!important}.quote-art{border:1px solid #7b9078;padding:40px 46px;text-align:center}.quote-art>span{font:70px Georgia,serif;color:var(--gold);line-height:1}.quote-art p{font:italic 24px/1.6 Georgia,serif}.quote-rule{width:38px;height:1px;background:var(--gold);margin:26px auto}.quote-art{font-size:10px;letter-spacing:2px;color:#c3cdb8}.footer{background:#102d23;color:#d5dbd1}.footer-main{padding:50px 0;display:flex;align-items:flex-start;justify-content:space-between}.footer-brand{text-decoration:none;color:white;font:28px Georgia,serif;letter-spacing:2px}.footer-brand span{color:var(--gold);font-size:19px;letter-spacing:0}.footer-main p{font-size:12px;color:#a9b9ad;margin-top:15px}.footer-links{display:flex;gap:22px;flex-wrap:wrap}.footer-links a{text-decoration:none;font-size:12px}.footer-bottom{border-top:1px solid #ffffff1b;padding:20px 0;display:flex;justify-content:space-between;gap:15px;font-size:10px;color:#98aa9f}@media(max-width:850px){.wrap{width:min(100% - 34px,1140px)}.nav{min-height:74px}.menu-button{display:block;color:#f5f1e7;background:transparent;border:1px solid #6f8976;padding:9px 13px;cursor:pointer}.site-header nav{display:none;position:absolute;top:74px;left:0;right:0;background:#173e30;padding:22px 25px 30px;flex-direction:column;align-items:stretch;gap:12px;box-shadow:0 15px 25px #0002}.site-header nav.open{display:flex}.site-header nav a{padding:9px}.hero{min-height:600px}.hero-inner{padding:75px 0 56px}.hero-tree{opacity:.25;width:85%;right:-32%}.story-grid,.roots-grid,.contribute-inner{grid-template-columns:1fr;gap:34px}.intro-section,.roots-section,.timeline-section,.records-section{padding:70px 0}.tree-section{padding:70px 0}.roots-grid{gap:45px}.record-grid{grid-template-columns:1fr}.record-card{min-height:0}.contribute-section{padding:75px 0}.contribute-inner{gap:43px}.footer-main{gap:30px}}@media(max-width:560px){.brand{font-size:19px;letter-spacing:2px}.brand-mark{width:37px;height:37px}.hero h1{letter-spacing:-1px}.hero-verse span{display:block;padding:6px 0}.hero-actions{margin-bottom:40px}.hero-tree{width:110%;right:-57%}.timeline-item{grid-template-columns:80px 1fr;gap:18px}.year{font-size:21px}.person-detail{padding:19px;gap:12px}.detail-icon{font-size:23px}.footer-main,.footer-bottom{flex-direction:column}.art-caption{font-size:9px}.art-caption span{font-size:8px}.quote-art{padding:28px}.tree-tools{justify-content:flex-start;gap:9px}.tree-scroll{margin-right:-17px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Vector icons render consistently across iOS, Android, and desktop. */
.icon-sprite{position:absolute;width:0;height:0;overflow:hidden}
.icon{width:1.15em;height:1.15em;display:inline-block;vertical-align:-.15em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.brand-mark .icon{width:27px;height:27px;stroke-width:1.5}
.icon-inline{width:1em;height:1em;margin-left:2px}
.icon-menu{margin-left:8px;width:18px;height:18px;vertical-align:middle}
.detail-icon .icon{width:34px;height:34px}
.nav-outline{display:inline-flex;align-items:center;gap:3px}
html{scroll-padding-top:24px}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
@media(max-width:560px){
  .wrap{width:calc(100% - 32px)}
  .brand{font-size:18px;letter-spacing:1.7px}
  .brand-sub{font-size:8px;letter-spacing:2.1px}
  .brand-mark{flex:0 0 37px}
  h1{font-size:clamp(36px,10vw,50px)}
  .hero{min-height:0}
  .hero-inner{padding:69px 0 50px}
  .eyebrow{font-size:9px;letter-spacing:1.7px}
  .button{max-width:100%;white-space:normal;text-align:center}
  .tree-scroll{overflow-x:visible;margin-right:0;padding:10px 0 20px}
  .tree-layout{width:100%;min-width:0}
  .tree-row{width:100%;gap:8px}
  .tree-row:first-child .person{width:calc((100% - 32px)/2);max-width:225px;padding:12px 5px}
  .tree-row:not(:first-child) .person{width:min(100%,275px)}
  .tree-row:first-child .person strong{font-size:clamp(13px,3.65vw,17px)}
  .person small{font-size:8px;letter-spacing:.7px}
  .person span{font-size:10px}
  .join{font-size:17px;flex:0 0 16px;text-align:center}
  .tree-note{margin-top:12px}
  .person-detail h3{font-size:20px}
  .roots-art{box-shadow:8px 8px 0 #eae9dc}
  .art-caption{flex-wrap:wrap}
  .footer-bottom{gap:8px}
}
@media(max-width:360px){.menu-button{padding:8px;font-size:12px}.brand{font-size:16px}.brand-mark{width:32px;height:32px;flex-basis:32px}.brand-mark .icon{width:22px;height:22px}.brand-sub{letter-spacing:1.3px}.tree-row:first-child .person strong{font-size:12px}}

/* Surname-focused multibranch family tree */
.tree-layout{min-width:0;width:100%}.tree-row{flex-wrap:wrap}.tree-children{width:100%;gap:10px}.tree-children .person{width:calc(25% - 8px);min-width:165px}.tree-label{text-align:center;font-size:12px;color:var(--moss);font-weight:700;letter-spacing:.5px;margin:0 0 16px}.tree-separator{margin:30px auto 20px;border-top:1px solid #cbd7c8;padding-top:21px;max-width:550px}.record-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:760px){.tree-children .person{width:calc(50% - 6px);min-width:0}.record-grid{grid-template-columns:1fr}.tree-row .person{max-width:calc(50% - 15px)}.tree-children .person{max-width:none}}
@media(max-width:420px){.tree-children .person{padding:12px 7px}.tree-children .person strong{font-size:14px}.tree-row:not(.tree-children) .person{width:calc(50% - 15px)}.tree-row:not(.tree-children):has(> .person:only-child) .person{width:100%;max-width:280px}}

/* Highlight the verified surname-continuation branch without diminishing other descendants. */
.dot.surname{background:#b99355}.person.surname-line{border:2px solid #b99355;background:#faf3df;box-shadow:0 5px 20px #8b6c3c20}.person.surname-line small{color:#705423}.person.surname-line span{color:#5a624f}.descendants{width:100%;align-items:stretch}.descendant-card{border:1px dashed #afbcaa;border-radius:4px;background:#f8f9f4;width:225px;min-height:113px;padding:15px 12px;display:flex;flex-direction:column;gap:6px;align-items:center;justify-content:center;text-align:center;color:#536457}.descendant-card strong{font:normal 17px/1.35 Georgia,serif;color:#24392d}.descendant-card span:last-child{font-size:11px}.branch-overline{font-size:9px;letter-spacing:1.4px;text-transform:uppercase;color:#758a79}.descendants .person{max-width:225px}@media(max-width:560px){.descendants{gap:9px}.descendants .person,.descendant-card{width:calc(50% - 5px)!important;max-width:none!important;min-width:0}.descendant-card{padding:12px 7px}.descendant-card strong,.descendants .person strong{font-size:14px}.descendant-card span:last-child{font-size:10px}}

/* Four children in a responsive, accessible two-column mobile grid. */
.descendants{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;justify-items:stretch}.descendants .person{width:100%;max-width:none;min-width:0;min-height:118px}.descendants .person strong{overflow-wrap:anywhere}@media(max-width:760px){.descendants{grid-template-columns:repeat(2,minmax(0,1fr))}.descendants .person{max-width:none;width:100%!important}}

/* Keep both parents distinct and all four children clearly visible on small screens. */
.family-couple{flex-wrap:wrap;width:100%}.family-couple .person{max-width:225px}.descendants .person{display:flex!important;visibility:visible!important;opacity:1!important}@media(max-width:560px){.family-couple{gap:8px}.family-couple .person{width:calc(50% - 18px)!important;max-width:none!important;min-width:0}.family-couple .person strong{font-size:clamp(13px,3.6vw,17px)}.family-couple .join{font-size:18px}.descendants{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.descendants .person{width:100%!important;max-width:none!important;min-width:0}}

/* Biographical references for living generations */
.profile-sources{margin-top:3.5rem;padding-top:2.25rem;border-top:1px solid rgba(49,93,69,.22)}
.profile-sources .section-heading{margin-bottom:1.5rem}
.profile-sources .section-heading h2{font-size:clamp(1.6rem,3.2vw,2.6rem)}
@media(max-width:600px){.profile-sources{margin-top:2.4rem;padding-top:1.5rem}}

/* Family cards run oldest to youngest in DOM order and remain readable on phones. */
@media (max-width: 600px) {
  .tree-scroll { overflow-x: visible; margin-right: 0; padding: 4px 0 14px; }
  .tree-layout { min-width: 0; width: 100%; }
  .tree-children, .descendants { display: flex; flex-direction: column; align-items:stretch; gap: 8px; width: 100%; max-width: 410px; margin-inline:auto; }
  .tree-children .person, .descendants .person { width: 100% !important; max-width: none !important; min-height: 80px; padding: 12px 15px; gap: 2px; }
  .tree-children .person strong, .descendants .person strong { font-size: 17px; overflow-wrap:normal; }
  .tree-children .person small, .descendants .person small { font-size: 9px; }
  .tree-children .person span, .descendants .person span { font-size: 10px; }
  .tree-children .person + .person, .descendants .person + .person { position:relative; }
  .tree-label { margin-top: 5px; margin-bottom: 13px; }
  .tree-separator { line-height:1.65; margin-top:26px; }
  .person-detail { margin-top: 18px; }
}

/* Mobile genealogy: spouses form one visual unit; generations follow below. */
@media (max-width:600px) {
  .tree-layout > .tree-row.tree-couple,
  .tree-layout > .tree-row.family-couple {
    display:flex; flex-direction:column; flex-wrap:nowrap;
    align-items:center; justify-content:center;
    gap:0; width:100%; margin:0 auto;
  }
  .tree-layout > .tree-row.tree-couple > .person,
  .tree-layout > .tree-row.family-couple > .person {
    width:min(100%,340px)!important; max-width:340px!important;
    min-height:100px; padding:16px 14px; flex:none;
  }
  .tree-layout > .tree-row.tree-couple > .person strong,
  .tree-layout > .tree-row.family-couple > .person strong {
    font-size:clamp(17px,4.7vw,21px); overflow-wrap:break-word;
  }
  .tree-layout > .tree-row.tree-couple > .join,
  .tree-layout > .tree-row.family-couple > .join {
    display:flex; align-items:center; justify-content:center;
    width:42px; height:36px; flex:none; font-size:21px;
    color:#947e55; margin:0; line-height:1;
  }
  .tree-layout > .tree-connector {height:30px}
  .tree-layout > .tree-row.tree-couple + .tree-connector,
  .tree-layout > .tree-row.family-couple + .tree-connector {margin-top:0}
  .tree-layout > .tree-row.tree-couple > .person:first-child,
  .tree-layout > .tree-row.family-couple > .person:first-child {order:0}
  .tree-layout > .tree-row.tree-couple > .join,
  .tree-layout > .tree-row.family-couple > .join {order:1}
  .tree-layout > .tree-row.tree-couple > .person:last-child,
  .tree-layout > .tree-row.family-couple > .person:last-child {order:2}
}
