:root{--ink:#11110f;--green:#003b27;--green-deep:#002d1e;--gold:#d9a51e;--cream:#f2eee4;--paper:#faf9f5;--line:#c8c1b4}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif}
a{color:inherit;text-decoration:none}
.nav-shell{height:88px;padding:0 5vw;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;background:var(--green-deep);color:#fff;position:relative;z-index:10;border-bottom:1px solid #d9a51e55}
.wordmark{font:500 30px/0.8 Arial,sans-serif;letter-spacing:-.055em;width:max-content;color:var(--gold)}
.wordmark span{display:block;font-size:7px;letter-spacing:.34em;margin-top:8px;padding-left:2px}
.nav-shell nav{display:flex;gap:34px;font-size:11px;text-transform:uppercase;letter-spacing:.15em}
.nav-shell nav a{padding:12px 0;border-bottom:1px solid transparent}
.nav-shell nav a:hover{border-color:var(--gold);color:var(--gold)}
.nav-cta{justify-self:end;font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:var(--gold)}
.nav-cta span,.social-link span{margin-left:8px}
.hero{height:calc(100svh - 88px);min-height:650px;position:relative;overflow:hidden;color:#fff}
.hero-photo{position:absolute;inset:0;background-image:url('/biutiful-hero-green.png');background-size:cover;background-position:center}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,35,23,.92) 0%,rgba(0,45,30,.68) 40%,rgba(0,45,30,.08) 76%),linear-gradient(0deg,rgba(0,30,20,.25),transparent 35%)}
.hero-content{position:absolute;left:7vw;top:50%;transform:translateY(-48%);max-width:660px}
.eyebrow,.section-kicker{font-size:10px;letter-spacing:.28em;font-weight:700}
.hero h1{font:400 clamp(62px,7vw,112px)/.86 Georgia,serif;letter-spacing:-.06em;margin:34px 0}
.hero h1 em,.moments h2 em,.experience em,.closing em{font-weight:400;color:var(--gold)}
.hero-copy{font:17px/1.55 Georgia,serif;max-width:450px;color:#f2eee8}
.text-link{display:inline-flex;gap:28px;align-items:center;margin-top:36px;padding-bottom:8px;border-bottom:1px solid;font-size:11px;text-transform:uppercase;letter-spacing:.15em}
.vertical-note{position:absolute;right:2.4vw;top:50%;margin:0;font-size:8px;letter-spacing:.3em;writing-mode:vertical-rl;transform:translateY(-50%)}
.intro{padding:130px 8vw 110px;position:relative}
.section-kicker{color:#756f65;margin:0 0 56px}
.intro-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:9vw;align-items:start}
.intro h2,.moments h2,.closing h2{font:400 clamp(48px,6vw,88px)/.96 Georgia,serif;letter-spacing:-.045em;margin:0}
.intro-grid>div{max-width:550px}
.intro-grid p{font:17px/1.7 Georgia,serif;color:#625e57}
.intro-grid .lead{font-size:27px;line-height:1.35;color:var(--ink);margin:0 0 28px}
.signature{font:italic 110px/1 Georgia,serif;color:var(--gold);opacity:.8;position:absolute;left:47%;bottom:16px;transform:rotate(-9deg)}
.moments{background:var(--green-deep);color:var(--cream);padding:120px 7vw}
.moments .section-kicker{color:#9e978b}
.moments-head{display:grid;grid-template-columns:.72fr 1.28fr;margin-bottom:90px}
.moments h2{font-size:clamp(54px,6vw,92px)}
.moment-list{border-top:1px solid #ffffff45}
.moment-row{display:grid;grid-template-columns:70px .75fr 1fr 20px;gap:30px;align-items:center;padding:34px 0;border-bottom:1px solid #ffffff45}
.moment-row>span:first-child{font-size:10px;color:#9d978d}
.moment-row h3{font:400 38px/1 Georgia,serif;margin:0}
.moment-row p{font:15px/1.6 Georgia,serif;color:#bdb7ad;max-width:540px;margin:0}
.moment-row .dot{font-size:7px;color:var(--gold)}
.experience{display:grid;grid-template-columns:1.25fr .75fr;min-height:740px}
.experience-copy{padding:120px 8vw;display:flex;flex-direction:column;justify-content:center}
.experience blockquote{font:400 clamp(44px,5vw,75px)/1.05 Georgia,serif;letter-spacing:-.045em;margin:0 0 45px}
.experience-copy>p:last-child{font:17px/1.7 Georgia,serif;color:#666158;max-width:580px}
.experience-card{background:var(--green);color:#f8f3e7;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:60px;border-left:10px solid var(--gold)}
.monogram{width:128px;height:128px;border:1px solid var(--gold);color:var(--gold);border-radius:50%;display:grid;place-items:center;font:italic 72px Georgia,serif;margin-bottom:60px}
.experience-card p{font:400 26px/1.35 Georgia,serif;letter-spacing:.03em}
.experience-card em{color:#fff}
.closing{padding:140px 8vw;text-align:center;background:var(--green);color:#fff}
.closing .section-kicker{margin-bottom:45px;color:#d8cfbc}
.closing h2{font-size:clamp(50px,6.5vw,96px)}
.social-link{display:inline-block;margin-top:60px;padding:17px 28px;border:1px solid var(--gold);color:var(--gold);font-size:12px;letter-spacing:.16em;transition:.25s}
.social-link:hover{background:var(--gold);color:var(--green-deep)}
footer{padding:58px 5vw;background:var(--green-deep);color:#fff;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:end;border-top:1px solid #d9a51e55}
footer p{margin:0;font-size:9px;letter-spacing:.2em;text-align:center}
footer p:last-child{text-align:right;color:#b8ae98}

@media(max-width:800px){.nav-shell{height:74px;padding:0 20px;grid-template-columns:1fr auto}
.nav-shell nav{display:none}
.wordmark{font-size:25px}
.nav-cta{font-size:9px}
.hero{height:calc(100svh - 74px);min-height:620px}
.hero-photo{background-position:61% center}
.hero-shade{background:linear-gradient(90deg,rgba(0,35,23,.88),rgba(0,45,30,.28)),linear-gradient(0deg,rgba(0,30,20,.38),transparent)}
.hero-content{left:24px;right:24px}
.hero h1{font-size:clamp(55px,16vw,80px)}
.hero-copy{font-size:15px;max-width:330px}
.vertical-note{display:none}
.intro{padding:90px 24px 95px}
.intro-grid{grid-template-columns:1fr;gap:52px}
.intro-grid .lead{font-size:23px}
.signature{left:auto;right:30px;bottom:12px;font-size:80px}
.moments{padding:90px 24px}
.moments-head{display:block;margin-bottom:60px}
.moments-head .section-kicker{margin-bottom:40px}
.moment-row{grid-template-columns:36px 1fr 8px;gap:14px;padding:26px 0}
.moment-row h3{font-size:30px}
.moment-row p{grid-column:2/4;font-size:14px}
.experience{grid-template-columns:1fr}
.experience-copy{padding:90px 24px}
.experience-card{min-height:540px}
.closing{padding:100px 24px}
footer{grid-template-columns:1fr;gap:34px;text-align:center}
footer .wordmark{margin:auto}
footer p:last-child{text-align:center}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
}