@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');

:root{
--blue:#184c36;
--ink:#19392b;
--paper:#f6f8f4;
--line:#cedbd0;
--muted:#486451}
*{
box-sizing:border-box}
html{
scroll-behavior:smooth;
scroll-padding-top:30px}
body{
margin:0;
background:var(--paper);
color:var(--ink);
font-family:'DM Sans',sans-serif;
line-height:1.6}
a{
color:inherit;
text-underline-offset:5px;
text-decoration-thickness:1px}
a:hover{
color:var(--blue)}
a:focus-visible{
outline:3px solid #f19432;
outline-offset:6px}
h1,h2,h3,p{
margin:0}
h1,h2,h3{
font-family:'Manrope',sans-serif;
line-height:1.1;
font-weight:500;
letter-spacing:-.045em}
.wrap{
width:calc(100% - 112px);
max-width:1400px;
margin-inline:auto}
.header{
display:flex;
align-items:center;
justify-content:space-between;
height:108px;
gap:24px}
.wordmark{
font-weight:700;
letter-spacing:-2px;
text-decoration:none}
.wordmark span{
color:var(--blue)}
nav{
display:flex;
gap:32px}
nav a,.coffee{
text-decoration:none}
.coffee{
border-bottom:1px solid var(--ink);
padding-bottom:4px}
.coffee span{
margin-left:18px;
}
.hero{
background:var(--blue);
color:white;
padding:44px 52px 22px;
overflow:hidden}
.eyebrow,.small-label,.belief-label{
font-weight:500;
letter-spacing:.1em;
text-transform:uppercase;
display:block}
.hero h1{
line-height:.98;
letter-spacing:-.075em;
margin:50px 0 48px}
.hero h1 em{
font-family:Georgia,serif;
font-weight:400;
letter-spacing:-.07em}
.hero-bottom{
display:grid;
grid-template-columns:1.2fr 1fr;
gap:60px;
align-items:end}
.intro{
line-height:1.3;
letter-spacing:-.035em}
.hero-detail{
max-width:405px;
line-height:1.6}
.hero-detail p+p{
margin-top:16px}
.hero a:hover{
color:#d0eccb}
.hero-index{
margin-top:44px;
padding-top:18px;
border-top:1px solid #ffffff45;
display:flex;
justify-content:space-between;
letter-spacing:.06em}
.section{
display:grid;
grid-template-columns:1fr 2fr;
gap:60px;
padding-block:110px}
.section-heading h2{
margin:24px 0}
.section-heading p{
color:var(--muted)}
.blue{
color:var(--blue)}
.activity{
display:grid;
grid-template-columns:24px 1fr auto;
gap:20px;
border-top:1px solid var(--line);
padding:27px 0 30px}
.item-number{
color:var(--muted);
padding-top:6px}
.activity h3{
margin-bottom:12px;
letter-spacing:-.04em}
.activity h3 a,.side-interests h3 a{
text-decoration:none}
.activity h3 a:hover,.side-interests h3 a:hover{
text-decoration:underline}
.activity p{
color:var(--muted);
max-width:520px}
.tag{
border:1px solid var(--line);
border-radius:20px;
padding:3px 12px;
align-self:start;
white-space:nowrap}
.side-interests{
display:grid;
grid-template-columns:repeat(3,1fr);
border-top:1px solid var(--line);
padding-top:32px;
gap:28px}
.small-label{
color:var(--muted);
letter-spacing:.08em}
.side-interests h3{
margin:15px 0}
.side-interests p{
color:var(--muted)}
.detail,.text-link{
display:inline-block;
margin-top:16px}
.thoughts{
background:#dfeade;
padding-block:85px}
.thoughts-heading{
display:flex;
align-items:baseline;
justify-content:space-between;
border-bottom:1px solid #b4cbb8;
padding-bottom:36px}
.thoughts-heading h2{
}
.thoughts-heading h2 span{
color:var(--blue)}
.beliefs{
display:grid;
grid-template-columns:1fr 1fr}
.belief{
padding:45px 48px 45px 0}
.belief:nth-child(even){
padding-left:48px;
padding-right:0;
border-left:1px solid #b4cbb8}
.belief:nth-child(n+3){
border-top:1px solid #b4cbb8}
.belief-label{
color:#3d5b46;
margin-bottom:28px}
.belief h3{
margin-bottom:20px;
line-height:1.2}
.belief p{
max-width:480px}
.belief .large-copy{
line-height:1.4;
letter-spacing:-.025em;
margin-bottom:24px}
.belief .drives{
margin:18px 0 22px;
color:var(--blue)}
.drives a{
text-decoration:none}
.drives a:hover{
text-decoration:underline}
.contact{
border-top:1px solid var(--line);
padding-block:55px 65px;
display:flex;
gap:30px;
align-items:center;
justify-content:space-between}
.contact h2{
margin-top:22px;
line-height:1.2}
.contact-link{
display:inline-block;
background:var(--blue);
color:white;
padding:17px 25px;
text-decoration:none;
white-space:nowrap}
.contact-link:hover{
color:white;
background:#103b29}
.footer{
border-top:1px solid var(--line);
padding-block:28px;
display:flex;
justify-content:space-between;
gap:20px;
align-items:center}
.footer p,.footer>a:last-child{
color:var(--muted)}
.skip{
position:absolute;
top:-80px;
left:15px;
background:white;
padding:12px;
z-index:10}
.skip:focus{
top:10px}
@media(min-width:1600px){
.hero h1{
}
}
@media(max-width:1000px){
.wrap{
width:calc(100% - 64px)}
.hero{
padding:36px}
.section{
grid-template-columns:1fr 1.8fr;
gap:35px;
padding-block:75px}
.tag{
display:none}
.side-interests{
grid-template-columns:1fr;
gap:28px}
.side-interests h3{
margin:8px 0}
.belief{
padding-right:30px}
.belief:nth-child(even){
padding-left:30px}
}
@media(max-width:640px){
.wrap{
width:calc(100% - 36px)}
.header{
height:84px;
gap:12px}
.wordmark{
}
nav{
gap:15px}
nav a{
}
.header>.coffee{
display:none}
.hero{
padding:28px 25px 20px}
.eyebrow{
}
.hero h1{
margin:46px 0 38px}
.hero-bottom{
grid-template-columns:1fr;
gap:28px}
.intro{
}
.hero-detail{
}
.hero-index{
margin-top:32px}
.section{
grid-template-columns:1fr;
gap:30px;
padding-block:60px}
.section-heading h2{
margin:17px 0}
.section-heading p br{
display:none}
.activity{
gap:14px;
padding-block:24px;
grid-template-columns:20px 1fr}
.activity h3{
}
.side-interests{
grid-template-columns:1fr;
gap:28px;
padding-left:34px}
.side-interests p{
}
.thoughts{
padding-block:48px}
.thoughts-heading{
display:block;
padding-bottom:28px}
.thoughts-heading h2{
margin-top:20px}
.beliefs{
grid-template-columns:1fr}
.belief,.belief:nth-child(even){
padding:32px 0;
border-left:0;
border-bottom:1px solid #b4cbb8}
.belief:nth-child(n+3){
border-top:0}
.belief-label{
margin-bottom:20px}
.belief h3{
}
.belief .large-copy{
}
.contact{
display:block;
padding-block:38px}
.contact-link{
margin-top:30px}
.footer{
flex-wrap:wrap}
.footer p{
display:none}
}
@media(prefers-reduced-motion:reduce){
html{
scroll-behavior:auto}
}


/* Original source copy, with a forest green palette. */
/* Unified type scale: one display size, one section size, one body size, one label size. */
:root{
--type-display:clamp(3.9rem,10vw,8.5rem);
--type-section:clamp(2.6rem,5vw,4.2rem);
--type-body:1.125rem;
--type-label:.875rem}

/* Keep text within each belief container at one readable size. */
.beliefs .belief p,.beliefs .belief .large-copy,.beliefs .belief h3,.beliefs .belief .drives{
line-height:1.5;
letter-spacing:0}

body{
}
.hero h1{
}
.section-heading h2,.thoughts-heading h2{
}
.activity p,.belief p{
}
.belief .large-copy{
line-height:1.2}
.belief h3,.contact h2{
}
.eyebrow,.small-label,.belief-label,.footer p,.footer>a:last-child,.hero-index,nav a,.coffee,.tag,.item-number{
}

.hero{
padding-bottom:52px}
.hero h1{
margin-top:8px}
.activity{
display:block}
.activity p{
max-width:650px;
color:var(--ink)}
.section-heading h2{
margin-top:0}
.thoughts-heading{
justify-content:flex-start}
.belief .large-copy{
}
.belief p+p{
margin-top:22px}
.header nav{
flex-wrap:wrap;
justify-content:flex-end}
.hero .intro{
max-width:520px}
@media(max-width:640px){
.header{
height:auto;
min-height:95px}
.header nav{
gap:6px 14px;
max-width:260px}
.hero{
padding-bottom:32px}
.hero h1{
margin-top:12px}
.activity p{
}
}


/* Final typography system: exactly two rendered font sizes. */
:root{
--font-heading:3rem;
--font-body:1.125rem}

body{
font-size:var(--font-body)}

h1,h2,h3,.wordmark,.hero h1,.contact h2,.activity h3,.side-interests h3{
font-size:var(--font-heading)!important}

p,a,nav,.eyebrow,.small-label,.belief-label,.hero-detail,.hero-index,.item-number,.tag,.detail,.text-link,.footer,.contact-link{
font-size:var(--font-body)!important}

h1,h2,h3{
line-height:1.05}

.wordmark{
letter-spacing:-.08em}

.hero{
display:grid;
grid-template-columns:auto 1fr;
column-gap:34px;
align-items:center}
.hero h1{
grid-column:2;
grid-row:1;
line-height:.95;
margin-top:8px;
margin-left:0}
.hero h1 em{
font-family:inherit;
font-style:normal;
font-weight:500;
letter-spacing:inherit}
.hero-portrait{
grid-column:1;
grid-row:1;
width:clamp(120px,13vw,190px);
aspect-ratio:1;
border-radius:50%;
object-fit:cover}

.hero-bottom{
grid-column:1/-1}

.hero-portrait{
transform:translateY(-16px)}

.invitation{
background:var(--blue);
color:white;
padding-block:72px;
text-align:center}
.invitation-inner{
display:flex;
flex-direction:column;
align-items:center;
gap:22px}
.invitation h2{
margin:0;
color:white}
.invitation-link{
color:white;
text-underline-offset:5px}
.invitation-link:hover{
color:#d0eccb}
.influences{
border-top:1px solid var(--line);
padding-top:80px;
padding-bottom:100px}
.influences .section-heading{
grid-row:1;
align-self:start}
.influences .section-heading h2{
margin:0}
.influences-intro{
grid-column:1/-1;
grid-row:2;
margin:0 0 30px;
color:var(--muted)}
.influence-groups{
grid-column:1/-1;
grid-row:3;
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
column-gap:48px}
.influence-groups details{
border-top:1px solid var(--line);
padding:22px 0;
grid-column:span 1;
justify-self:start;
width:100%;
overflow:hidden;
transition:border-color .3s ease}
.influence-groups details.is-open{
grid-column:1/-1;
justify-self:stretch}
@media(prefers-reduced-motion:reduce){
.influence-groups .influence-body,
.influence-groups details.is-open .influence-body,
.influence-groups summary::after{
transition:none}}
.coffee-call-row{
display:flex;
justify-content:center;
gap:24px;
padding:24px;
color:var(--ink);
text-decoration:none}
.coffee-call-row span{
font-size:1.5rem}
.influence-groups summary{
cursor:pointer;
font-size:var(--font-body);
font-weight:600;
line-height:1.2;
list-style:none}
.influence-groups summary::-webkit-details-marker{
display:none}
.influence-groups summary::after{
content:'';
float:right;
width:.45em;
height:.45em;
margin-top:.35em;
border-right:1.5px solid currentColor;
border-bottom:1.5px solid currentColor;
transform:rotate(45deg);
transition:transform .3s ease}
.influence-groups details.is-open summary::after{
transform:rotate(225deg)}
.influence-groups .influence-body{
display:grid;
grid-template-rows:0fr;
opacity:0;
visibility:hidden;
pointer-events:none;
transition:grid-template-rows .55s cubic-bezier(.22,1,.36,1),opacity .28s ease,visibility 0s linear .55s}
.influence-groups details.is-open .influence-body{
grid-template-rows:1fr;
opacity:1;
visibility:visible;
pointer-events:auto;
transition:grid-template-rows .55s cubic-bezier(.22,1,.36,1),opacity .4s ease .08s,visibility 0s}
.influence-groups .influence-body>p{
overflow:hidden;
min-height:0;
margin:0;
padding-top:18px;
color:var(--muted);
font-size:var(--font-body)!important}

.influence-groups .influence-body a,
.influence-tooltip-trigger{
font-size:inherit!important}

.influence-tooltip-trigger{
position:relative;
display:inline;
text-decoration:underline;
text-decoration-style:dotted;
text-underline-offset:4px;
cursor:help}
.influence-tooltip{
position:fixed!important;
z-index:30;
bottom:auto!important;
left:0;
transform:translateX(-50%) translateY(4px);
width:max-content;
max-width:min(520px,calc(100vw - 32px));
padding:10px 12px;
border-radius:10px;
background:var(--paper);
color:var(--ink);
border:1px solid var(--line);
box-shadow:0 8px 24px #19392b26;
font:var(--font-body)/1.35 'DM Sans',sans-serif;
text-align:left;
opacity:0!important;
pointer-events:none!important;
transition:opacity .16s ease,transform .16s ease}
.influence-tooltip.is-open{
opacity:1!important;
transform:translateX(-50%) translateY(0);
pointer-events:auto!important}

.header{
position:relative}
.menu-toggle{
display:flex;
flex-direction:column;
justify-content:center;
gap:5px;
position:fixed;
top:24px;
right:24px;
z-index:100;
width:44px;
height:44px;
padding:10px;
border:1px solid var(--line);
border-radius:12px;
background:transparent;
background:var(--paper);
color:var(--ink);
cursor:pointer}
.menu-toggle span{
display:block;
width:100%;
height:2px;
background:currentColor;
border-radius:2px;
transition:transform .24s ease,opacity .18s ease}
.menu-toggle[aria-expanded="true"] span:nth-child(1){
transform:translateY(7px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:nth-child(2){
opacity:0}
.menu-toggle[aria-expanded="true"] span:nth-child(3){
transform:translateY(-7px) rotate(-45deg)}
.menu-toggle[aria-expanded="true"]{
opacity:1}
.header nav{
position:fixed;
top:24px;
right:24px;
z-index:110;
display:flex;
flex-direction:column;
align-items:flex-start;
gap:0;
width:210px;
min-width:210px;
max-height:44px;
padding:10px;
background:var(--paper);
border:1px solid var(--line);
border-radius:14px;
box-shadow:0 14px 30px #19392b1c;
opacity:0;
visibility:hidden;
pointer-events:none;
transform:none;
transform-origin:top right;
transition:opacity .24s ease,max-height .24s ease,visibility 0s linear .24s}
.header nav.is-open{
opacity:1;
visibility:visible;
pointer-events:auto;
transform:scale(1);
max-height:240px;
transition-delay:0s}
.header nav:not(.is-open){
display:flex!important;
flex-direction:column!important;
width:210px!important;
min-width:210px!important;
max-height:44px!important;
overflow:hidden!important}
.header nav.is-open{
flex-direction:column!important;
width:210px!important;
min-width:210px!important}
.header nav .coffee-call-row{
position:relative;
justify-content:center;
text-align:center;
padding:10px 14px 14px 14px;
gap:14px;
font:inherit;
font-size:var(--font-body);
font-family:inherit;
font-weight:400;
line-height:inherit}
.header nav .coffee-call-row::after{
content:'';
position:absolute;
left:14px;
right:14px;
bottom: 0;
height:1px;
background:var(--line)}
.header nav .coffee-call-row>span{
font:inherit!important;
font-size:var(--font-body)!important}
.header nav .coffee-call-row>span[aria-hidden="true"]{
font-size:var(--font-body)!important}
.booking-option{
display:inline-flex;
align-items:center;
gap:6px}
.booking-option svg{
width:18px;
height:18px;
stroke-width:1.8}
.header nav a{
width:100%;
padding:12px 14px;
text-align:left;
border-radius:8px}
.header nav a:hover{
background:#dfeade}

.intro{
line-height:1.05;
max-width:650px}

.section-heading h2,.thoughts-heading h2{
margin-top:0}

.belief .large-copy{
line-height:1.15;
letter-spacing:-.04em}

.activity p,.belief p,.hero-detail p{
font-size:var(--font-body)!important}

.eyebrow,.small-label,.belief-label,.hero-index,.item-number,.tag{
letter-spacing:.08em}

.detail,.text-link{
font-size:var(--font-body)!important}

.link-modal p,.link-modal button{
font-size:var(--font-body)!important}
.link-modal-backdrop{
position:fixed;
inset:0;
z-index:1000;
display:grid;
place-items:center;
background:#19392b80;
padding:24px}
.link-modal{
width:min(420px,100%);
padding:32px;
background:var(--paper);
color:var(--ink);
box-shadow:0 24px 70px #102f2455;
border:1px solid var(--line);
border-radius:18px}
@media(max-width:640px){
.influence-groups{
grid-template-columns:1fr;
column-gap:0}
.hero{
grid-template-columns:92px 1fr;
column-gap:18px}
.hero-portrait{
width:92px}
}

.tooltip{
pointer-events:auto!important;
bottom:100%!important}

.tooltip{
position:fixed!important;
bottom:auto!important}
.tooltip.is-open{
opacity:1;
transform:translateX(-50%) translateY(0);
pointer-events:auto!important;
bottom:auto!important}

.link-modal{
border-radius:18px}
.link-modal .cancel{
display:none}
.link-modal-actions{
justify-content:flex-end}

.link-modal p{
display:flex;
flex-direction:column;
align-items:center;
gap:10px;
text-align:center}
.modal-heading{
font-size:1.25rem;
font-weight:600}
.modal-url{
font-size:var(--font-body);
overflow-wrap:anywhere;
color:var(--ink);
margin-bottom:1.5rem}
.modal-url-muted{
color:#718179}
.modal-domain{
color:var(--ink)}
.link-modal-actions{
display:flex;
width:100%;
justify-content:center!important;
align-items:center}
.link-modal .go{
min-width:240px;
margin-inline:auto;
padding:16px 64px;
font-size:var(--font-body)!important;
font-weight:600;
background:var(--blue);
color:white;
border:0;
border-radius:18px}

