:root{--forest:#0d2a24;--forest2:#173f35;--cream:#f8f3e8;--sand:#e9ddc4;--ochre:#c9813a;--ink:#292722;--sage:#829386;--line:#d7c6a8}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:Arial,Helvetica,sans-serif}
a{color:inherit;text-decoration:none}
.site-header{height:104px;padding:12px clamp(28px,4.5vw,72px) 0;display:flex;align-items:center;justify-content:space-between;background:var(--forest);color:var(--cream);border-bottom:1px solid rgba(201,129,58,.55);position:relative;z-index:10}
.site-header:before{content:"";position:absolute;left:0;right:0;top:7px;height:4px;opacity:.7;background:radial-gradient(circle,var(--ochre) 1.2px,transparent 1.5px) 0 0/9px 4px repeat-x}
.brand{font:500 34px Georgia,serif}
nav{display:flex;align-items:center;gap:clamp(18px,2.5vw,42px);font-size:15px}
nav a{padding:14px 0;position:relative}
nav a:after{content:"";position:absolute;left:0;right:100%;bottom:6px;height:2px;background:var(--ochre);transition:right .2s}
nav a:hover:after,nav a.active:after{right:0}
.hero{min-height:calc(100vh - 104px);padding:76px clamp(38px,4.5vw,72px) 80px;display:grid;grid-template-columns:minmax(420px,39fr) minmax(620px,61fr);gap:48px;align-items:center;overflow:hidden;position:relative;background:radial-gradient(circle at 18% 12%,rgba(55,107,83,.18),transparent 28%),radial-gradient(circle at 72% 74%,rgba(0,0,0,.2),transparent 36%),var(--forest);color:var(--cream)}
.hero-copy{position:relative;z-index:2;max-width:590px}
.eyebrow,.kicker{color:var(--ochre);text-transform:uppercase;letter-spacing:.22em;font-size:12px;font-weight:700}
.eyebrow:before{content:"";display:inline-block;width:32px;height:1px;margin:0 13px 4px 0;background:var(--ochre)}
h1,h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;margin:0}
h1{font-size:clamp(58px,4.9vw,79px);line-height:.98;letter-spacing:-.035em;margin:28px 0}
.intro{max-width:540px;color:#f2eadb;font-size:21px;line-height:1.55}
.actions{display:flex;gap:14px;margin-top:34px;flex-wrap:wrap}
.button{min-height:60px;padding:0 30px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--sand);border-radius:4px;font-size:16px;transition:.2s}
.button:hover{transform:translateY(-2px)}
.button.primary{background:var(--ochre);border-color:var(--ochre);color:white}
.button.secondary{color:var(--cream)}
.button.secondary:hover{background:rgba(255,255,255,.08)}
.privacy{margin-top:28px;color:#a9b7ae;font-size:11px}
.filmstrip{min-height:620px;display:flex;align-items:center;gap:12px;padding:58px 0;position:relative}
.filmstrip:before,.filmstrip:after{content:"";position:absolute;left:0;right:0;height:21px;opacity:.65;background:repeating-linear-gradient(90deg,#071a16 0 15px,transparent 15px 23px);border-top:2px solid rgba(201,129,58,.25);border-bottom:2px solid rgba(201,129,58,.25)}
.filmstrip:before{top:52px}.filmstrip:after{bottom:51px}
.photo{position:relative;z-index:2;flex:1;height:390px;margin:0;border:5px solid #e8d5af;border-radius:12px;box-shadow:0 15px 36px rgba(0,0,0,.32)}
.photo.annie{height:500px;flex:.94}
.photo img{width:100%;height:100%;display:block;object-fit:cover;border-radius:7px;filter:sepia(.15) contrast(1.02)}
.photo.group img{object-fit:contain;background:#e8d5af}
.photo figcaption{position:absolute;left:-8px;right:-8px;bottom:-45px;text-align:center;color:var(--sand);font:italic 18px Georgia,serif}
.story,.ancestry,.gallery,.webmail,footer{padding-left:clamp(28px,7vw,112px);padding-right:clamp(28px,7vw,112px)}
.story{padding-top:105px;padding-bottom:105px;display:grid;grid-template-columns:1fr 1fr;gap:10vw;background:var(--forest2);color:var(--cream)}
.story h2,.webmail h2{font-size:clamp(44px,5vw,72px);line-height:1;color:var(--cream)}
.story-text{font:20px/1.65 Georgia,serif}.story-text a,.text-link{display:inline-block;margin-top:18px;padding-bottom:8px;color:#e1b474;border-bottom:1px solid #b9834c;font:700 12px Arial;text-transform:uppercase;letter-spacing:.1em}
.ancestry{padding-top:120px;padding-bottom:130px;display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw;background:#f1e7d4}
.ancestry h2,.section-heading h2{font-size:clamp(44px,4.6vw,70px);line-height:1.02;color:var(--forest);margin:18px 0 25px}
.ancestry-intro>p:not(.kicker){font:18px/1.7 Georgia,serif;color:#5e615a}.text-link{color:var(--forest)}
.tree{min-height:470px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:42px;position:relative}.tree:before{content:"";position:absolute;width:1px;height:70%;background:var(--ochre)}
.parents,.grandparents{display:flex;gap:22px;position:relative;z-index:2}.parents{gap:100px}
.person{min-width:155px;padding:20px;text-align:center;background:var(--cream);border:1px solid var(--line);border-radius:14px;box-shadow:0 8px 22px rgba(57,52,42,.08);position:relative;z-index:2}
.person small,.person span{display:block;color:var(--ochre);font-size:9px;text-transform:uppercase;letter-spacing:.12em}.person strong{display:block;margin:7px 0;color:var(--forest);font:500 21px Georgia,serif}
.gallery{padding-top:110px;padding-bottom:125px;background:var(--cream)}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:50px}.section-heading>p{max-width:430px;font:18px/1.6 Georgia,serif;color:#66675f}
.gallery-grid{display:grid;grid-template-columns:1.25fr .75fr;grid-template-rows:240px 240px;gap:18px}.gallery-card{position:relative;overflow:hidden;margin:0;border-radius:18px;background:#ccbda5}.gallery-card.tall{grid-row:1/3}.gallery-card img{width:100%;height:100%;object-fit:cover;filter:sepia(.12);transition:transform .4s}.gallery-card:hover img{transform:scale(1.035)}.gallery-card:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 48%,rgba(10,36,30,.84))}.gallery-card figcaption{position:absolute;z-index:2;left:28px;right:22px;bottom:25px;color:white;font:28px Georgia,serif}.gallery-card small{display:block;margin-bottom:7px;font:10px Arial;text-transform:uppercase;letter-spacing:.16em}
.webmail{padding-top:82px;padding-bottom:82px;background:var(--forest);display:flex;align-items:center;justify-content:space-between;gap:30px;color:var(--cream)}.webmail h2{font-size:clamp(38px,4vw,58px);margin-top:12px}
footer{padding-top:45px;padding-bottom:45px;display:flex;align-items:center;justify-content:space-between;gap:25px;background:#071d18;color:#c7d0ca;font-size:12px}footer strong{font:24px Georgia,serif;color:var(--cream)}footer a{color:#e1b474}
:focus-visible{outline:2px solid var(--ochre);outline-offset:4px}
@media(max-width:1100px){.site-header{height:auto;min-height:96px;flex-wrap:wrap;padding-top:22px;padding-bottom:17px;gap:12px}.hero{grid-template-columns:1fr}.filmstrip{min-height:590px}.ancestry{grid-template-columns:1fr}.story{gap:5vw}}
@media(max-width:720px){nav{width:100%;overflow-x:auto;white-space:nowrap}.brand{font-size:27px}.hero{padding:58px 25px 70px}.hero h1{font-size:51px}.actions{flex-direction:column}.button{width:100%}.filmstrip{min-height:460px;gap:7px}.photo{height:245px;border-width:3px}.photo.annie{height:325px}.photo figcaption{font-size:12px;bottom:-39px}.story,.ancestry{grid-template-columns:1fr}.story{gap:38px}.parents{gap:15px}.grandparents{flex-wrap:wrap;justify-content:center}.section-heading,.webmail,footer{align-items:flex-start;flex-direction:column}.gallery-grid{display:block}.gallery-card{height:310px;margin-bottom:15px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}