:root{
  color-scheme:light;
  --bg:#FFFFFF;
  --ink:#000000;
  --grey:#54565B;
  --muted:#8A8C91;
  --line:#E3E4E6;
  --soft:#F3F3F4;
  --foot:#EBEBED;
  --line-on-soft:#DCDDE0;
  --land:#E6E7E9;
  --grat:#EEEFF1;
  --sphere:#D9DADD;
  --button-bg:#000000;
  --button-ink:#FFFFFF;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} *{animation:none !important; transition:none !important} }
body{
  margin:0; background:var(--bg); color:var(--grey);
  font-family:"Jost","Helvetica Neue",Helvetica,Arial,sans-serif;
  font-weight:400; font-size:17px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{font-family:"Montserrat","Helvetica Neue",Helvetica,Arial,sans-serif; color:var(--ink); margin:0; font-weight:700; letter-spacing:-0.02em}
p{margin:0}
a{color:inherit; text-decoration:none}
img{max-width:100%; display:block}
button{font:inherit}
:focus-visible{outline:2px solid var(--ink); outline-offset:3px}

.wrap{max-width:1120px; margin:0 auto; padding:0 28px}
@media (max-width:640px){ .wrap{padding:0 20px} }

/* Header */
.site-header{position:sticky; top:0; z-index:20; background:var(--bg); border-bottom:1px solid transparent; transition:border-color .2s}
.site-header.scrolled{border-bottom-color:var(--line)}
.header-row{display:flex; align-items:center; justify-content:space-between; height:74px}
.logo{display:inline-flex; align-items:center; color:var(--ink)}
.logo img{height:30px; width:auto; display:block}
@media (max-width:640px){ .logo img{height:23px} }
.nav{display:flex; gap:34px}
.nav a{font-size:15.5px; color:var(--grey); padding:6px 0; border-bottom:1px solid transparent; transition:color .15s,border-color .15s}
.nav a:hover{color:var(--ink)}
.nav a[aria-current="page"]{color:var(--ink); border-bottom-color:var(--ink)}
.menu-btn{display:none; background:none; border:0; padding:8px; margin:-8px; cursor:pointer; color:var(--ink)}
.menu-btn svg{display:block}
@media (max-width:760px){
  .menu-btn{display:block}
  .nav{display:none; position:absolute; left:0; right:0; top:74px; background:var(--bg); border-bottom:1px solid var(--line); flex-direction:column; gap:0; padding:8px 20px 16px}
  .nav.open{display:flex}
  .nav a{padding:12px 0; font-size:18px; border-bottom:1px solid var(--line)}
  .nav a[aria-current="page"]{border-bottom-color:var(--line)}
}

/* Pages */
section{padding:96px 0}
@media (max-width:760px){ section{padding:64px 0} }
.rule{border:0; border-top:1px solid var(--line); margin:0}

/* Hero */
.hero{padding:120px 0 104px}
@media (max-width:760px){ .hero{padding:72px 0 64px} }
.hero h1{font-size:clamp(40px,6.4vw,78px); line-height:1.02; max-width:18ch}
.hero .sub{margin-top:32px; font-size:clamp(18px,1.6vw,21px); font-weight:300; max-width:34ch; color:var(--grey)}
.hero .cta{margin-top:40px}

.btn{display:inline-block; background:var(--button-bg); color:var(--button-ink); padding:14px 26px; border-radius:2px; font-size:15.5px; font-weight:500; border:1px solid var(--button-bg); cursor:pointer; transition:opacity .15s}
.btn:hover{opacity:.82}
.btn.ghost{background:transparent; color:var(--ink); border-color:var(--ink)}
.btn.ghost:hover{opacity:1; background:var(--ink); color:var(--bg)}
.link{color:var(--ink); border-bottom:1px solid var(--ink); padding-bottom:2px}
.link:hover{border-bottom-color:transparent}

/* Intro */
.intro{display:grid; grid-template-columns:4fr 8fr; gap:48px}
.intro p{font-size:clamp(20px,2vw,25px); font-weight:300; line-height:1.5; color:var(--ink)}
.intro .who{font-size:15.5px; color:var(--muted); padding-top:8px}
@media (max-width:760px){ .intro{grid-template-columns:1fr; gap:14px} }

/* Section titles */
.stitle{font-size:clamp(28px,3vw,36px); line-height:1.15}
.shead{display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:48px}
.shead .more{font-size:15.5px; white-space:nowrap}
@media (max-width:760px){ .shead{flex-direction:column; align-items:flex-start; gap:12px; margin-bottom:32px} }

/* Services preview grid */
.svc-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:0 40px}
.svc-grid .svc{border-top:1px solid var(--line); padding:22px 0 36px}
.svc h3{font-size:17px; font-weight:600; letter-spacing:-0.01em; line-height:1.3}
.svc p{margin-top:10px; font-size:15.5px; font-weight:300; line-height:1.55}
@media (max-width:900px){ .svc-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:560px){ .svc-grid{grid-template-columns:1fr} .svc-grid .svc{padding:18px 0 26px} }

/* Globe */
.band{background:var(--soft)}
.band .places li{border-color:var(--line-on-soft)}
.globe-section .globe .sphere{stroke:var(--line-on-soft)}
.globe-section .globe .land{fill:#DCDDE0}
.globe-section .globe .grat{stroke:#E8E8EA}
.head-band{background:var(--soft)}
.head-band .page-head{padding:88px 0 76px}
.after-band{padding-top:72px}
@media (max-width:760px){ .head-band .page-head{padding:56px 0 44px} .after-band{padding-top:48px} }
.globe-grid{display:grid; grid-template-columns:7fr 5fr; gap:56px; align-items:center}
.globe{width:100%; max-width:640px; margin:0 auto; display:block}
.globe .land{fill:var(--land)}
.globe .grat{fill:none; stroke:var(--grat); stroke-width:.7}
.globe .sphere{fill:none; stroke:var(--sphere); stroke-width:1}
.globe .pin{fill:var(--ink); transition:r .15s, opacity .2s; cursor:default}
.globe .pin.dim{opacity:.18}
.globe .pin.hot{r:7}
.globe .halo{fill:none; stroke:var(--ink); stroke-width:1; opacity:0}
.globe .halo.hot{opacity:.5}
.places{list-style:none; margin:0; padding:0}
.places li{border-top:1px solid var(--line); padding:13px 0; font-size:18px; color:var(--ink); display:flex; align-items:center; gap:14px; cursor:default; transition:color .15s}
.places li:last-child{border-bottom:1px solid var(--line)}
.places li .flag{width:22px; height:16.5px; flex:none; border-radius:1px; box-shadow:0 0 0 1px var(--line); transition:transform .15s}
.places li.hot .flag{transform:scale(1.12)}
.places li.dim{color:var(--muted)}
.globe-note{margin-top:22px; font-size:15.5px; font-weight:300; color:var(--muted)}
@media (max-width:860px){ .globe-grid{grid-template-columns:1fr; gap:36px} .globe{max-width:520px} }

/* Pins entrance: one orchestrated moment */
.globe .pin, .globe .halo{opacity:0}
.globe.revealed .pin{animation:pinIn .5s ease forwards}
.globe.revealed .pin.dim{opacity:.18}
@keyframes pinIn{from{opacity:0; r:0} to{opacity:1; r:4.5}}
.globe .pin.in{animation:none; opacity:1}
.globe .pin.in.hot{r:7}
.globe .pin.in.dim{opacity:.18}
@media (prefers-reduced-motion: reduce){ .globe .pin{opacity:1 !important; r:4.5} }

/* Contact prompt */
.prompt h2{font-size:clamp(30px,4vw,52px); line-height:1.08; max-width:16ch}
.prompt .email{display:inline-block; margin-top:26px; font-size:clamp(18px,2vw,24px); font-weight:300; color:var(--ink); border-bottom:1px solid var(--ink)}
.prompt .email:hover{border-bottom-color:transparent}
.prompt .cta{margin-top:36px}

/* Inner pages */
.page-head{padding:96px 0 56px}
.page-head h1{font-size:clamp(36px,5vw,60px); line-height:1.05}
.page-head .lede{margin-top:28px; font-size:clamp(19px,1.8vw,23px); font-weight:300; line-height:1.5; max-width:58ch; color:var(--ink)}
@media (max-width:760px){ .page-head{padding:56px 0 36px} }

.svc-list{list-style:none; margin:0; padding:0}
.svc-list li{display:grid; grid-template-columns:5fr 7fr; gap:40px; padding:36px 0; border-top:1px solid var(--line)}
.svc-list li:last-child{border-bottom:1px solid var(--line)}
.svc-list h2{font-size:22px; font-weight:600; letter-spacing:-0.01em; line-height:1.3}
.svc-list p{font-size:17px; font-weight:300; line-height:1.6; max-width:52ch}
@media (max-width:760px){ .svc-list li{grid-template-columns:1fr; gap:10px; padding:26px 0} }

.prose{max-width:66ch}
.prose p{font-size:clamp(17px,1.5vw,19.5px); font-weight:300; line-height:1.65}
.prose p + p{margin-top:22px}

.founder{display:grid; grid-template-columns:5fr 7fr; gap:64px; align-items:start}
.founder .photo{border-radius:2px; overflow:hidden; background:var(--soft)}
.founder .photo img{width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; object-position:50% 30%}
.founder h2{font-size:clamp(26px,3vw,34px); line-height:1.15}
.founder .role{margin-top:6px; font-size:16px; color:var(--muted)}
.founder p.bio{margin-top:26px; font-size:17.5px; font-weight:300; line-height:1.65; max-width:56ch}
@media (max-width:760px){ .founder{grid-template-columns:1fr; gap:32px} .founder .photo{max-width:420px} }

/* Contact page */
.page-head.centered{text-align:center}
.page-head.centered .lede{margin-left:auto; margin-right:auto}
.reach{display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.reach-item{padding:48px 28px; text-align:center; border-left:1px solid var(--line)}
.reach-item:first-child{border-left:0}
.reach .ico{width:38px; height:38px; display:block; margin:0 auto 18px; fill:none; stroke:var(--ink); stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round}
.reach h2{font-family:"Jost","Helvetica Neue",Helvetica,Arial,sans-serif; font-size:17px; font-weight:500; letter-spacing:0; color:var(--ink)}
.reach .val{margin-top:12px; font-size:17px; font-weight:300; line-height:1.6; color:var(--grey)}
.reach .val a{border-bottom:1px solid transparent}
.reach .val a:hover{color:var(--ink); border-bottom-color:var(--ink)}
@media (max-width:760px){
  .reach{grid-template-columns:1fr}
  .reach-item{border-left:0; border-top:1px solid var(--line); padding:36px 16px}
  .reach-item:first-child{border-top:0}
}
.write{max-width:680px; margin:0 auto; padding:96px 0 112px}
.write .stitle{text-align:center; margin-bottom:48px}
.form{display:grid; gap:26px}
.form .two{display:grid; grid-template-columns:1fr 1fr; gap:26px 40px}
.field{display:grid; gap:8px}
.field label{font-size:14.5px; color:var(--muted)}
.field input,.field textarea{width:100%; font:inherit; font-weight:300; font-size:17px; color:var(--ink); background:transparent; border:0; border-bottom:1px solid var(--line); padding:10px 0; border-radius:0; transition:border-color .15s}
.field input:focus,.field textarea:focus{outline:none; border-bottom-color:var(--ink)}
.field textarea{min-height:150px; resize:vertical}
.form .actions{display:flex; flex-direction:column; align-items:center; gap:14px; margin-top:10px}
.form .hint{font-size:14.5px; color:var(--muted); font-weight:300}
@media (max-width:640px){ .form .two{grid-template-columns:1fr} .write{padding:64px 0 80px} }

/* Footer */
.site-footer{background:var(--foot); padding:48px 0 40px}
.foot-row{display:flex; justify-content:space-between; align-items:flex-start; gap:32px; flex-wrap:wrap}
.foot-row .logo img{height:21px}
.foot-links{display:flex; gap:26px; font-size:15px}
.foot-links a{color:var(--grey)}
.foot-links a:hover{color:var(--ink)}
.foot-meta{margin-top:34px; display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:14.5px; font-weight:300; color:var(--muted)}

/* 404 */
.notfound{padding:140px 0 160px}
.notfound h1{font-size:clamp(36px,5vw,60px); line-height:1.05}
.notfound p{margin-top:22px; font-size:19px; font-weight:300}
.notfound .cta{margin-top:36px}
