:root{--ink:#080b10;--panel:#11151c;--paper:#f5f3ee;--red:#c8292c;--blue:#183b69;--steel:#b7bec3;--line:#303640}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.65 Inter,Arial,sans-serif}
img{display:block;width:100%}
a{color:inherit}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.site-header{height:84px;padding:0 clamp(20px,4vw,64px);display:flex;align-items:center;justify-content:space-between;background:rgba(8,11,16,.96);color:white;position:sticky;top:0;z-index:20;border-bottom:1px solid #262c35}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand img{width:62px;height:62px;object-fit:contain;filter:drop-shadow(0 5px 8px rgba(0,0,0,.55))}
.brand span{display:flex;flex-direction:column;font:700 1rem/1 Barlow Condensed,sans-serif;letter-spacing:.17em}
.brand b{font-size:1.5rem;letter-spacing:.08em;color:#d5d9dc}
.site-header nav{display:flex;gap:36px}
.site-header nav a{text-decoration:none;text-transform:uppercase;font:700 .88rem Inter,sans-serif;letter-spacing:.1em;color:#c6cbd1}
.site-header nav a:hover{color:white}
.menu-button{display:none;background:none;border:0;width:44px;padding:8px}
.menu-button span:not(.sr-only){display:block;height:2px;background:#fff;margin:6px}
.hero{min-height:calc(100vh - 84px);position:relative;display:grid;align-items:end;overflow:hidden;background:#090b0e;color:#fff}
.hero-image,.hero-shade{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-image{object-position:center 45%}
.hero-shade{background:linear-gradient(90deg,rgba(6,8,12,.94) 0%,rgba(6,8,12,.66) 43%,rgba(6,8,12,.1) 75%),linear-gradient(0deg,rgba(6,8,12,.85),transparent 50%)}
.hero-content{position:relative;z-index:2;padding:8vw clamp(24px,7vw,110px);max-width:850px}
.eyebrow,.section-kicker{font:800 .8rem/1 Barlow Condensed,sans-serif;letter-spacing:.24em}
.eyebrow{color:#d6dade}
.hero h1,.section h2,.family h2,.banner h2{margin:.16em 0;font-family:Barlow Condensed,sans-serif;font-weight:900;line-height:.82;letter-spacing:-.035em}
.hero h1{font-size:clamp(4.5rem,10vw,9rem)}
.hero h1:after{content:"";display:block;width:115px;height:8px;margin-top:28px;background:linear-gradient(90deg,var(--red) 0 48%,#eee 48% 62%,var(--blue) 62%)}
.hero-copy{max-width:590px;font-size:clamp(1.05rem,2vw,1.28rem);color:#e1e4e6}
.button{display:inline-flex;gap:26px;align-items:center;margin-top:14px;padding:14px 22px;border:1px solid #89919a;text-decoration:none;text-transform:uppercase;font:700 .8rem Inter;letter-spacing:.13em}
.button:hover{background:#fff;color:#111}
.hero-mark{position:absolute;right:clamp(18px,5vw,70px);bottom:38px;width:clamp(120px,17vw,250px);z-index:2;filter:drop-shadow(0 14px 20px #000)}
.hero-mark img{filter:drop-shadow(0 12px 18px rgba(0,0,0,.72))}
.section{padding:clamp(75px,9vw,140px) clamp(24px,8vw,125px)}
.section-kicker{display:flex;align-items:center;gap:13px;color:#47505b}
.section-kicker span{width:45px;height:3px;background:var(--red)}
.section-kicker.light{color:#bbc0c6}
.story-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(45px,8vw,120px);align-items:start}
.story h2,.family h2,.memory-intro h2{font-size:clamp(3.3rem,7vw,7rem)}
h2 em{font-style:normal;color:var(--red)}
.story-copy{padding-top:2rem;max-width:590px;font-size:1.08rem;color:#424851}
.story-copy p:first-child{font-size:1.25rem;color:#111}
.story-copy blockquote{margin:48px 0 0;padding-left:24px;border-left:5px solid var(--red);font:800 clamp(1.5rem,3vw,2.1rem)/1.1 Barlow Condensed,sans-serif;color:#111}
.family{background:var(--ink);color:#fff;padding-bottom:8px}
.family-title{display:flex;align-items:end;justify-content:space-between;gap:50px;padding-bottom:65px}
.family-title>p{max-width:350px;color:#b3b9c0;font-size:1.05rem}
.mosaic{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:255px;gap:8px}
.mosaic figure,.filmstrip figure{margin:0;position:relative;overflow:hidden;background:#222}
.mosaic .wide{grid-column:span 2}
.mosaic .tall{grid-row:span 2}
.mosaic .portrait{grid-row:span 2}
.mosaic img,.filmstrip img{height:100%;object-fit:cover;transition:transform .7s ease,filter .5s}
.mosaic figure:hover img,.filmstrip figure:hover img{transform:scale(1.035);filter:saturate(1.1)}
figcaption{position:absolute;inset:auto 0 0;padding:48px 20px 17px;background:linear-gradient(transparent,rgba(0,0,0,.82));font:800 .78rem Inter;letter-spacing:.12em}
.memories{background:#eceae5}
.memory-intro{text-align:center}
.memory-intro .section-kicker{justify-content:center}
.filmstrip{margin-top:60px;display:grid;grid-template-columns:repeat(6,minmax(210px,1fr));gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:12px}
.filmstrip figure{aspect-ratio:4/5;scroll-snap-align:center}
.closing{text-align:center;font:600 clamp(1.25rem,2vw,1.65rem)/1.5 Inter;margin:55px 0 0}
.closing strong{font-family:Barlow Condensed;font-size:1.5em;letter-spacing:.04em}
.banner{min-height:580px;position:relative;display:grid;place-items:center;color:#fff;text-align:center;background:#05070a;overflow:hidden}
.banner>img{position:absolute;inset:0;height:100%;object-fit:cover;object-position:center 48%;filter:brightness(.34) saturate(.75)}
.banner:after{content:"";position:absolute;inset:0;background:radial-gradient(circle,transparent 10%,rgba(0,0,0,.66) 85%)}
.banner div{position:relative;z-index:2;padding:70px 24px}
.banner span{font:800 .8rem Inter;letter-spacing:.25em}
.banner h2{font-size:clamp(4rem,9vw,8rem);margin:.16em 0}
.banner p{font-size:1.15rem}
footer{background:#05070a;color:#aeb4bb;padding:35px clamp(22px,6vw,90px);display:flex;align-items:center;gap:28px;border-top:1px solid #262b32}
footer img{width:82px;height:82px;object-fit:contain;filter:drop-shadow(0 7px 10px rgba(0,0,0,.55))}
footer p{font:700 .9rem Inter;letter-spacing:.08em}
footer strong{color:#fff}
footer a{margin-left:auto;text-decoration:none;font-size:.85rem}
@media(max-width:760px){.site-header{height:70px}
.brand img{width:48px;height:48px}
.brand span{display:none}
.menu-button{display:block}
.site-header nav{display:none;position:absolute;top:70px;left:0;right:0;flex-direction:column;gap:0;background:#0b0f14;padding:10px 24px 22px}
.site-header nav.open{display:flex}
.site-header nav a{padding:14px 0;border-bottom:1px solid #252b33}
.hero{min-height:780px}
.hero-shade{background:linear-gradient(0deg,rgba(6,8,12,.98) 0%,rgba(6,8,12,.66) 66%,rgba(6,8,12,.1))}
.hero-content{padding-bottom:58px}
.hero-mark{top:25px;bottom:auto;width:115px}
.story-grid{grid-template-columns:1fr;gap:8px}
.story-copy{padding-top:0}
.family-title{display:block}
.family-title>p{margin-top:26px}
.mosaic{grid-template-columns:1fr 1fr;grid-auto-rows:210px}
.mosaic .wide{grid-column:span 2}
.mosaic .tall{grid-row:span 1}
.mosaic .portrait{grid-row:span 2}
.filmstrip{margin-left:-24px;margin-right:-24px;padding-left:24px;padding-right:24px}
.banner{min-height:520px}
footer{flex-wrap:wrap}
footer p{max-width:190px}
footer a{width:100%;margin-left:103px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
.mosaic img,.filmstrip img{transition:none}
}

.memory-gallery{margin-top:52px;display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:230px;gap:10px}
.memory-gallery figure{margin:0;position:relative;overflow:hidden;background:#222}
.memory-gallery img{height:100%;object-fit:cover;transition:transform .7s ease,filter .5s}
.memory-gallery figure:hover img{transform:scale(1.035);filter:saturate(1.1)}
.memory-gallery .wide{grid-column:span 2}
.memory-gallery .tall{grid-row:span 2}
.memory-gallery .feature{grid-column:span 2;grid-row:span 2}
@media(max-width:760px){.memory-gallery{grid-template-columns:1fr 1fr;grid-auto-rows:180px}
.memory-gallery .wide,.memory-gallery .feature{grid-column:span 2}
.memory-gallery .feature{grid-row:span 2}
}
@media(prefers-reduced-motion:reduce){.memory-gallery img{transition:none}
}