:root{--paper:#eef0ec;--ink:#17201b;--stone:#5f6a63;--line:#d2d7d1;--sea:#27505c;--lime:#c9e265;--white:#fbfcfa;
--d:"Bricolage Grotesque",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--s:Newsreader,Georgia,"Times New Roman",serif;
--wrap:1360px;--g:clamp(16px,4vw,48px);--ease:cubic-bezier(.2,.7,.2,1);--hdr:64px}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;text-size-adjust:100%;-webkit-tap-highlight-color:transparent;scroll-padding-top:var(--hdr)}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.55 var(--d);font-optical-sizing:auto;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}a{color:inherit}
h1,h2,h3{font-family:var(--d);font-weight:500;letter-spacing:-.025em;line-height:1;margin:0 0 .4em}
h1{font-size:clamp(2.6rem,7vw,6.2rem)}h2{font-size:clamp(1.7rem,3.4vw,2.8rem)}h3{font-size:1.3rem;letter-spacing:-.015em;line-height:1.15}
p{margin:0 0 1em}.wrap{max-width:var(--wrap);margin:0 auto;padding-left:var(--g);padding-right:var(--g)}
em{font-style:italic;font-family:var(--s)}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:-9999px}.skip:focus{left:8px;top:8px;z-index:99;background:var(--white);padding:8px}
:focus-visible{outline:2px solid var(--sea);outline-offset:3px}
.small{font-size:.88rem;color:var(--stone)}.eyebrow{font-size:.8rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;margin-bottom:12px;opacity:.85}
.lede{font:400 clamp(1.2rem,2vw,1.55rem)/1.45 var(--s);max-width:38em}
.big{font:400 clamp(1.6rem,3.4vw,2.9rem)/1.18 var(--s);letter-spacing:-.01em;max-width:26em}.big em{color:var(--sea)}
.who{color:var(--stone)}.sub{font-size:clamp(1.4rem,2.4vw,2rem)}
/* links and buttons: everything that can be clicked moves a little */
.ar{flex:none;transition:transform .3s var(--ease)}
.link{display:inline-flex;align-items:center;gap:8px;font-weight:500;text-decoration:none;background:linear-gradient(var(--lime),var(--lime)) 0 100%/100% 3px no-repeat;padding-bottom:3px;transition:background-size .35s var(--ease),color .2s}
.link:hover{background-size:100% 100%;color:var(--ink)}.link:hover .ar{transform:translateX(4px)}
.link.light{color:var(--paper)}.link.light:hover{color:var(--ink)}
.btn{display:inline-flex;align-items:center;gap:10px;min-height:50px;padding:0 24px;border-radius:999px;background:var(--ink);color:var(--white);text-decoration:none;font-weight:500;border:1px solid var(--ink);transition:background .25s,color .25s,border-color .25s,transform .25s var(--ease)}
.btn:hover{background:var(--lime);border-color:var(--lime);color:var(--ink)}.btn:hover .ar{transform:translateX(4px)}
.btn.lime{background:var(--lime);border-color:var(--lime);color:var(--ink)}.btn.lime:hover{background:var(--white);border-color:var(--white)}
.btn.ghost{background:transparent;border-color:rgba(255,255,255,.7);color:var(--white)}.btn.ghost:hover{background:var(--white);color:var(--ink)}
.btn.ghost.dark{border-color:var(--ink);color:var(--ink)}.btn.ghost.dark:hover{background:var(--ink);color:var(--white)}
/* header */
.top{position:fixed;top:0;left:0;right:0;z-index:500;height:var(--hdr);display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 var(--g);background:transparent;border-bottom:1px solid transparent;transition:background .35s,border-color .35s,color .35s}
.top.solid{background:rgba(238,240,236,.92);background:color-mix(in srgb,var(--paper) 88%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom-color:var(--line)}
body:not(.over) main{padding-top:var(--hdr)}
.over .top:not(.solid){color:var(--white)}.over .top:not(.solid) .brand img{background:var(--white)}
.over .top:not(.solid) .menu i{background:var(--white)}.over .top:not(.solid) #nav a:hover{color:var(--lime)}
.over .top:not(.solid):before{content:"";position:absolute;top:0;right:0;bottom:-40px;left:0;z-index:-1;background:linear-gradient(180deg,rgba(15,22,18,.45),rgba(15,22,18,0));pointer-events:none}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:600;letter-spacing:-.01em;font-size:1.05rem}
.brand img{border-radius:50%;background:var(--ink);transition:transform .6s var(--ease),background .35s}.brand:hover img{transform:rotate(-30deg) scale(1.06)}
.brand span{transition:color .2s}.brand:hover span{color:var(--sea)}
#nav{display:flex;gap:4px}
#nav a{position:relative;text-decoration:none;padding:10px 12px;font-size:.95rem;font-weight:500;transition:color .2s}
#nav a span{position:relative;display:inline-block}
#nav a span:after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:3px;background:var(--lime);transform:scaleX(0);transform-origin:right;transition:transform .35s var(--ease)}
#nav a:hover{color:var(--sea)}#nav a:hover span:after,#nav a[aria-current] span:after{transform:scaleX(1);transform-origin:left}
.menu{display:none;width:44px;height:44px;border:0;background:none;cursor:pointer;position:relative}
.menu i{position:absolute;left:11px;right:11px;height:2px;background:var(--ink);transition:transform .3s var(--ease)}.menu i:first-of-type{top:18px}.menu i:last-of-type{top:25px}
.menu[aria-expanded=true] i:first-of-type{transform:translateY(3.5px) rotate(45deg)}.menu[aria-expanded=true] i:last-of-type{transform:translateY(-3.5px) rotate(-45deg)}
@media(max-width:1020px){.menu{display:block}
#nav{position:fixed;top:var(--hdr);right:0;left:0;flex-direction:column;gap:0;background:var(--paper);color:var(--ink);padding:8px var(--g) 28px;border-bottom:1px solid var(--line);opacity:0;pointer-events:none;transform:translateY(-8px);transition:.3s var(--ease)}
#nav.open{opacity:1;pointer-events:auto;transform:none}#nav a{font-size:1.6rem;padding:12px 0;border-bottom:1px solid var(--line);letter-spacing:-.02em}
#nav a:hover{padding-left:8px}#nav a{transition:padding .3s var(--ease),color .2s}}
/* reveal on scroll (only when JS runs) */
.js .rv{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js .rv.in{opacity:1;transform:none}
/* home hero */
.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:flex-end;color:var(--white);overflow:hidden;background:var(--ink)}
.hero-img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;animation:zoom 18s ease-out both}
.hero:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,rgba(23,32,27,.05) 30%,rgba(23,32,27,.8))}
.hero-t{position:relative;z-index:1;padding-bottom:clamp(40px,9vh,96px);width:100%}
.hero h1{font-size:clamp(2.6rem,6.6vw,6.4rem);font-weight:500;max-width:13em}
.hero h1 span{display:block;animation:rise .9s var(--ease) both}.hero h1 span+span{animation-delay:.25s;color:var(--lime)}
.hero-t p{max-width:34em;font:400 clamp(1.05rem,1.6vw,1.3rem)/1.5 var(--s);animation:rise .9s .45s var(--ease) both}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;animation:rise .9s .6s var(--ease) both}
.hero-cap{position:absolute;z-index:1;right:var(--g);bottom:24px;font-size:.85rem;color:var(--white);text-decoration:none;opacity:.85;transition:opacity .2s}.hero-cap:hover{opacity:1;text-decoration:underline}
@keyframes rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@keyframes zoom{from{transform:scale(1.08)}to{transform:scale(1)}}
.intro{padding-top:clamp(56px,10vw,128px);padding-bottom:clamp(40px,6vw,80px)}
.more{padding-top:20px;padding-bottom:clamp(56px,8vw,104px);text-align:right}
/* tiles: full-bleed image, name over it */
.tile,.theme{position:relative;display:block;overflow:hidden;background:var(--ink);color:var(--white);text-decoration:none;aspect-ratio:4/3;isolation:isolate}
.tile img,.theme img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease),filter .5s}
.tile:after,.theme:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;background:linear-gradient(180deg,rgba(15,22,18,0) 45%,rgba(15,22,18,.78));transition:opacity .4s}
.t-in{position:absolute;left:0;right:0;bottom:0;z-index:2;display:grid;gap:6px;padding:clamp(16px,2vw,26px)}
.t-in b{font-weight:500;font-size:clamp(1.35rem,2.2vw,2rem);letter-spacing:-.02em;line-height:1.05;transition:color .3s}
.t-loc{font-size:.9rem;opacity:.8;max-height:0;overflow:hidden;transition:max-height .4s var(--ease),opacity .4s}
.t-in .k{color:var(--white)}
.tile:hover img,.theme:hover img,.tile:focus-visible img{transform:scale(1.05)}
.tile:hover b,.theme:hover b{color:var(--lime)}.tile:hover .t-loc,.tile:focus-visible .t-loc{max-height:2em}
@media(hover:none){.t-loc{max-height:2em}}
.mosaic,.grid{display:grid;gap:4px;grid-template-columns:1fr}
@media(min-width:640px){.mosaic,.grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1100px){.mosaic{grid-template-columns:repeat(3,1fr)}.mosaic .big{grid-column:span 2;grid-row:span 2;aspect-ratio:auto}
.grid{grid-template-columns:repeat(3,1fr)}}
.mosaic .big b{font-size:clamp(1.8rem,3.4vw,3.2rem)}
.grid{padding-bottom:4px}.tile.off{display:none}
.empty{padding-top:24px;padding-bottom:80px}
/* themes */
.themes{display:grid;gap:4px;grid-template-columns:1fr;padding-bottom:clamp(56px,8vw,104px)}
@media(min-width:640px){.themes{grid-template-columns:repeat(2,1fr)}}@media(min-width:1100px){.themes{grid-template-columns:repeat(5,1fr)}.theme{aspect-ratio:3/4}}
.theme:after{background:linear-gradient(180deg,rgba(15,22,18,.05) 25%,rgba(15,22,18,.86))}.theme .t-in span{font:400 1rem/1.4 var(--s);opacity:.88}.theme i{font-style:normal;font-size:.85rem;font-weight:500;display:inline-flex;align-items:center;gap:6px}
.theme:hover .ar{transform:translateX(4px)}
.themes-h{padding-bottom:24px}.themes-h p{color:var(--stone)}
/* kind tag */
.k{display:inline-flex;align-items:center;gap:7px;font-size:.82rem;font-weight:500}
.k:before{content:"";width:10px;height:10px;border-radius:50%;border:2px solid currentColor}
.k-built:before{background:var(--lime);border-color:var(--lime)}.k-adopted:before{border-color:var(--lime);background:transparent}
.k-alternative:before{background:#7fb0bd;border-color:#7fb0bd}.k-research:before{background:#a9b3ac;border-color:#a9b3ac}
/* home map */
.maphome{position:relative;background:var(--ink);color:var(--paper)}
.maphome-h{padding-top:clamp(56px,8vw,96px);padding-bottom:32px;display:grid;gap:16px;align-items:end}
@media(min-width:900px){.maphome-h{grid-template-columns:1fr 1fr auto}}
.maphome-h h2{margin:0}.maphome-h p{margin:0;font:400 1.15rem/1.5 var(--s);max-width:28em;opacity:.85}
.maphome .btn{background:var(--lime);color:var(--ink);border-color:var(--lime)}.maphome .btn:hover{background:var(--white);border-color:var(--white)}
.bgmap{background:#dfe3dd;z-index:1}
#homemap{height:min(78vh,760px);height:min(78svh,760px)}
#thememap{height:min(60vh,560px);height:min(60svh,560px);margin-bottom:24px}
/* numbers */
.numbers{display:grid;gap:32px;padding-top:clamp(56px,8vw,104px);padding-bottom:clamp(56px,8vw,104px)}
@media(min-width:800px){.numbers{grid-template-columns:repeat(3,1fr)}}
.numbers b{display:block;font-weight:300;font-size:clamp(2.4rem,4.6vw,4.2rem);letter-spacing:-.04em;line-height:1}.numbers span{display:block;max-width:18em;color:var(--stone);margin-top:12px}
/* band */
.band{background:var(--sea);color:var(--paper);padding:clamp(56px,8vw,104px) 0}
.band-in{display:grid;gap:40px;align-items:center}@media(min-width:900px){.band-in{grid-template-columns:1.3fr 1fr}}
.band img{aspect-ratio:3/2;object-fit:cover;width:100%}.band p{font:400 1.15rem/1.5 var(--s);max-width:30em}.band .eyebrow{font-family:var(--d)}
.cta{padding-top:clamp(64px,9vw,120px);padding-bottom:clamp(64px,9vw,120px);text-align:center;display:grid;justify-items:center}
.cta p{color:var(--stone);max-width:32em;font:400 1.15rem/1.5 var(--s)}
/* page heads and blocks: one left edge for everything */
.page-h{padding-top:clamp(48px,8vw,104px);padding-bottom:clamp(28px,4vw,56px)}
.block{display:grid;gap:12px 48px;padding-top:clamp(32px,4vw,56px);padding-bottom:clamp(32px,4vw,56px);border-top:1px solid var(--line)}
@media(min-width:960px){.block{grid-template-columns:minmax(0,1fr) minmax(0,3fr)}}
.block>h2{font-size:1rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding-top:.45em}
.prose p{font:400 1.22rem/1.6 var(--s);max-width:38em}
.quote{padding-bottom:clamp(32px,5vw,64px)}
.people{display:grid;gap:32px}@media(min-width:700px){.people{grid-template-columns:repeat(3,1fr)}}
.person{margin:0}.person img{width:100%;aspect-ratio:5/6;object-fit:cover;filter:grayscale(1) contrast(1.05);transition:filter .6s,transform .6s var(--ease)}
.person:hover img{filter:none}.person h3{margin:16px 0 2px}.person .role{color:var(--sea);font-weight:500;font-size:.92rem;margin-bottom:8px}
.person p{font:400 1.02rem/1.55 var(--s);color:var(--stone)}.person .role{font-family:var(--d)}
.names{font:400 1.2rem/1.6 var(--s);max-width:40em;margin:0}
.awards{list-style:none;padding:0;margin:0}.awards li{display:grid;gap:2px;padding:14px 0;border-bottom:1px solid var(--line)}.awards li:first-child{padding-top:0}.awards span{color:var(--stone)}
/* work with us */
.services{list-style:none;margin:0;padding:0;counter-reset:s}
.services li{display:grid;gap:4px 32px;padding:24px 0;border-bottom:1px solid var(--line);transition:padding .35s var(--ease)}
.services li:first-child{padding-top:0}
@media(min-width:800px){.services li{grid-template-columns:60px minmax(0,1fr) minmax(0,1.5fr);align-items:baseline}}
.services .n{color:var(--stone);font-weight:500;transition:color .3s}.services h3{font-size:clamp(1.5rem,2.6vw,2.2rem);margin:0;transition:color .3s}
.services p{font:400 1.1rem/1.55 var(--s);margin:0;color:var(--stone)}
.services li:hover .n,.services li:hover h3{color:var(--sea)}
@media(hover:hover){.services li:hover{padding-left:12px}}
.partners{list-style:none;margin:0;padding:0;display:grid;gap:4px}@media(min-width:700px){.partners{grid-template-columns:repeat(2,1fr)}}
.partners li{background:var(--white);padding:24px;transition:background .3s,transform .3s var(--ease)}.partners li:hover{background:var(--lime)}
.partners p{margin:0;font:400 1.05rem/1.5 var(--s);color:var(--stone)}.partners li:hover p{color:var(--ink)}
.split-img{display:grid;gap:4px;grid-template-columns:1fr 1fr;margin:clamp(24px,4vw,48px) 0}.split-img img{width:100%;aspect-ratio:3/2;object-fit:cover}
.support dl{display:grid;grid-template-columns:auto 1fr;gap:8px 24px;margin:8px 0 28px}dt{color:var(--stone)}dd{margin:0}
.contact-big{display:grid;gap:8px;margin:24px 0}.contact-big a{font-size:clamp(1.4rem,3.4vw,2.6rem);letter-spacing:-.02em;text-decoration:none;width:max-content;max-width:100%;overflow-wrap:anywhere;background:linear-gradient(var(--lime),var(--lime)) 0 100%/0 4px no-repeat;transition:background-size .4s var(--ease)}
.contact-big a:hover{background-size:100% 4px}
.social{display:flex;flex-wrap:wrap;gap:8px}.social a{display:grid;place-items:center;width:44px;height:44px;border:1px solid currentColor;border-radius:50%;transition:background .25s,color .25s,transform .3s var(--ease)}
.social a:hover{background:var(--lime);border-color:var(--lime);color:var(--ink);transform:translateY(-3px)}
.social.big{margin-top:24px}
/* projects filters */
.filters{display:grid;gap:14px;padding-bottom:28px}
.f{display:flex;flex-wrap:wrap;gap:6px}
.f button{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 16px;border:1px solid var(--line);background:transparent;color:var(--ink);font:500 .9rem var(--d);border-radius:999px;cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.f button i{font-style:normal;color:var(--stone);font-weight:400;font-size:.82rem}
.f button .k{gap:0}.f button:hover{border-color:var(--ink)}
.f button.on{background:var(--ink);border-color:var(--ink);color:var(--white)}.f button.on i{color:#aab3ac}
.sels{display:flex;flex-wrap:wrap;gap:10px 20px}
.sel{display:inline-flex;align-items:center;gap:8px;font-size:.9rem;color:var(--stone)}
.sel select{font:500 .95rem var(--d);color:var(--ink);background:var(--white);border:1px solid var(--line);border-radius:999px;min-height:40px;padding:0 34px 0 14px;appearance:none;-webkit-appearance:none;cursor:pointer;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%2317201b' stroke-width='1.6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;max-width:62vw}
.sel select:hover{border-color:var(--ink)}
/* map page */
.mapx{display:grid;grid-template-columns:1fr;min-height:calc(100vh - var(--hdr));min-height:calc(100svh - var(--hdr))}
.mapx-side{padding:28px var(--g) 24px;order:2}
.mapx-side h1{font-size:clamp(2.4rem,5vw,4rem)}.mapx-side>p{font:400 1.1rem/1.5 var(--s);color:var(--stone)}
.fs{margin-bottom:12px}.fs button{min-height:36px;padding:0 12px;font-size:.85rem}
.near{border:0;background:none;padding:6px 0;font:500 .92rem var(--d);color:var(--sea);cursor:pointer;text-decoration:underline;text-underline-offset:4px}
.near:hover{color:var(--ink)}
.inview{list-style:none;margin:0;padding:0}
.inview a{display:grid;grid-template-columns:64px 1fr;gap:12px;align-items:center;padding:8px 0;border-top:1px solid var(--line);text-decoration:none;transition:background .2s,padding .3s var(--ease)}
.inview img{width:64px;height:48px;object-fit:cover;background:var(--line)}.inview b{display:block;font-weight:500;line-height:1.2;transition:color .2s}.inview span{font-size:.82rem;color:var(--stone)}
.inview a:hover,.inview a.hl{background:var(--white);padding-left:8px}.inview a:hover b,.inview a.hl b{color:var(--sea)}
#bigmap{height:68vh;height:68svh;order:1}
@media(min-width:960px){.mapx{grid-template-columns:minmax(320px,400px) 1fr;height:calc(100vh - var(--hdr));height:calc(100svh - var(--hdr))}
.mapx-side{order:0;overflow-y:auto;border-right:1px solid var(--line)}#bigmap{height:auto}}
.mapp .foot{display:none}
/* pins */
.pin{width:16px;height:16px;border-radius:50%;border:2px solid var(--ink);background:var(--paper);box-shadow:0 1px 4px rgba(0,0,0,.25);transition:transform .25s var(--ease)}
.pin.built{background:var(--lime);border-color:var(--ink);width:18px;height:18px}.pin.adopted{border-color:#8fae1f;border-width:4px}.pin.alternative{background:var(--sea);border-color:var(--white)}.pin.research{background:var(--stone);border-color:var(--white)}
.leaflet-marker-icon:hover .pin,.pin.hot{transform:scale(1.6)}
.leaflet-popup-content{margin:0;width:240px!important;font-family:var(--d)}.leaflet-popup-content-wrapper{border-radius:2px;padding:0;overflow:hidden}
.pop{display:block;text-decoration:none;color:var(--ink)}.pop img{width:100%;height:150px;object-fit:cover}.pop div{padding:10px 14px 12px}.pop b{display:block;font-weight:500;font-size:1.1rem;line-height:1.2;margin:4px 0}
.pop span{font-size:.85rem;color:var(--stone)}.pop:hover b{color:var(--sea)}
.leaflet-tooltip{font:500 .85rem var(--d);border-radius:2px;border:0;box-shadow:0 2px 8px rgba(0,0,0,.2)}
.leaflet-container{font-family:var(--d)}
/* project page */
.phero{position:relative;min-height:min(80vh,780px);min-height:min(80svh,780px);display:flex;align-items:flex-end;color:var(--white);background:var(--ink);overflow:hidden}
.phero>video{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover}
.phero>img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;animation:zoom 14s ease-out both}
.phero:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,rgba(23,32,27,0) 40%,rgba(23,32,27,.75))}
.phero .wrap{position:relative;z-index:1;width:100%;padding-bottom:clamp(28px,5vw,56px)}.phero h1{max-width:14em;margin-top:10px;animation:rise .9s var(--ease) both}.phero p{max-width:40em;font:400 1.15rem/1.45 var(--s)}
.phero .k{color:var(--white)}
.pbody{display:grid;gap:40px;padding-top:clamp(40px,6vw,80px);padding-bottom:clamp(40px,6vw,80px)}
@media(min-width:960px){.pbody{grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:72px}}
.ptext p{font:400 1.18rem/1.65 var(--s);max-width:36em}.ptext .lede{font-size:clamp(1.35rem,2.2vw,1.7rem);line-height:1.4;margin-bottom:1em}
.note{border-left:3px solid var(--lime);padding-left:16px;color:var(--stone)}
aside dl{display:grid;grid-template-columns:auto 1fr;gap:10px 20px;margin:0 0 24px;padding-top:16px;border-top:1px solid var(--ink)}
#minimap{height:280px;margin-bottom:12px}
.wide{padding-bottom:clamp(40px,6vw,72px)}
.gallery{columns:1;column-gap:16px;padding-bottom:56px}@media(min-width:640px){.gallery{columns:2}}@media(min-width:1100px){.gallery{columns:3}}
.g{display:block;margin-bottom:16px;break-inside:avoid;cursor:zoom-in;background:var(--line);overflow:hidden}.g img{transition:transform .8s var(--ease)}.g:hover img{transform:scale(1.03)}
.story{padding-bottom:40px}.sheets{display:grid;gap:24px}@media(min-width:800px){.sheets{grid-template-columns:repeat(2,1fr)}}.sheet{margin:0}.sheet .g{background:#fff;border:1px solid var(--line)}
figcaption{font-size:.9rem;color:var(--stone);margin-top:8px}
.related{padding-top:24px}
.grid.three{padding-bottom:0}
.pn{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-top:32px;padding-bottom:72px}
.pn a{min-height:44px;display:flex;align-items:center;font-weight:500;text-decoration:none;background:linear-gradient(var(--lime),var(--lime)) 0 85%/0 3px no-repeat;transition:background-size .35s var(--ease),color .2s}
.pn a:hover{background-size:100% 3px;color:var(--sea)}
.idea{padding-top:clamp(48px,7vw,88px);padding-bottom:24px}.idea p{font:400 1.15rem/1.6 var(--s);max-width:38em}.idea .big{font-size:clamp(1.6rem,3vw,2.4rem);color:var(--sea)}
/* before/after */
.ba-fig{margin:0 0 32px}.ba{position:relative;overflow:hidden;background:var(--line);touch-action:pan-y;user-select:none}
.ba img{display:block;width:100%;pointer-events:none}.ba-b{position:absolute;top:0;right:0;bottom:0;left:0;clip-path:inset(0 calc(100% - var(--p)) 0 0)}.ba-b img{width:100%;height:100%;object-fit:cover}
.ba:after{content:"";position:absolute;top:0;bottom:0;left:var(--p);width:2px;margin-left:-1px;background:var(--lime);pointer-events:none}
.ba:before{content:"";position:absolute;top:50%;left:var(--p);z-index:2;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;background:var(--lime);box-shadow:0 2px 10px rgba(0,0,0,.25);pointer-events:none}
.ba input{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0;z-index:3}
.ba-l,.ba-r{position:absolute;top:12px;z-index:1;font-size:.8rem;font-weight:500;padding:4px 10px;background:var(--ink);color:var(--white);pointer-events:none}.ba-l{left:12px}.ba-r{right:12px;background:var(--lime);color:var(--ink)}
/* video */
.vids{display:grid;gap:20px}.grid3{grid-template-columns:repeat(auto-fill,minmax(min(100%,280px),1fr))}.grid6{grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}
.vid{margin:0}.yt{position:relative;display:block;width:100%;aspect-ratio:16/9;padding:0;border:0;background:var(--ink);cursor:pointer;overflow:hidden}
.short .yt{aspect-ratio:9/16}.yt img,.yt iframe{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;border:0;transition:transform .8s var(--ease)}
.yt:hover img{transform:scale(1.04)}
.play{position:absolute;left:50%;top:50%;width:60px;height:60px;margin:-30px 0 0 -30px;border-radius:50%;background:var(--lime);transition:transform .3s var(--ease)}
.yt:hover .play{transform:scale(1.12)}
.play:after{content:"";position:absolute;left:24px;top:19px;border-left:16px solid var(--ink);border-top:11px solid transparent;border-bottom:11px solid transparent}
/* media list */
.press{list-style:none;margin:0 0 72px;padding:0;border-bottom:1px solid var(--line)}.press li>*{display:grid;gap:2px;padding:18px 0;border-top:1px solid var(--line);text-decoration:none;transition:padding .3s var(--ease)}
.m-src{font-size:.88rem;color:var(--stone)}.m-t{font:400 1.3rem/1.3 var(--s);transition:color .2s}.m-by{font-size:.88rem;color:var(--stone)}.press a:hover .m-t{color:var(--sea)}
@media(hover:hover){.press a:hover{padding-left:10px}}
/* lightbox */
.lb{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;background:rgba(15,20,17,.95);display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .25s}
.lb.open{opacity:1;pointer-events:auto}.lb img{max-width:94vw;max-height:88vh;max-height:88svh;width:auto}
.lb button{position:absolute;width:52px;height:52px;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;font-size:1.5rem;cursor:pointer;transition:background .2s}.lb button:hover{background:var(--lime);color:var(--ink)}
.lb .x{top:16px;right:16px}.lb .pv{left:12px}.lb .nx{right:12px}.lb .ct{position:absolute;bottom:16px;color:#bbb;font-size:.9rem}
/* footer */
.foot{background:var(--ink);color:var(--paper);padding:clamp(56px,8vw,104px) 0 32px;overflow:hidden}
.foot-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px;padding-bottom:clamp(40px,6vw,72px);border-bottom:1px solid #34413a}
.foot-line{font:400 clamp(2.2rem,6vw,5.4rem)/1 var(--d);letter-spacing:-.035em;margin:0;max-width:11em}.foot-line em{color:var(--lime)}
.foot-cols{display:grid;gap:32px;grid-template-columns:repeat(2,minmax(0,1fr));padding:40px 0}
@media(min-width:900px){.foot-cols{grid-template-columns:repeat(4,minmax(0,1fr))}}
.foot-cols h2{font-size:.78rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#9aa49c;margin-bottom:14px}
.foot-cols>div>a{display:block;width:max-content;max-width:100%;overflow-wrap:anywhere;padding:5px 0;text-decoration:none;color:var(--paper);transition:color .2s,transform .3s var(--ease)}
.foot-cols>div>a:hover{color:var(--lime);transform:translateX(4px)}
.foot-base{display:flex;align-items:center;gap:16px;padding-top:28px;border-top:1px solid #34413a}.foot-base p{margin:0;font-size:.85rem;color:#9aa49c}
.foot-base img{border-radius:50%;transition:transform .8s var(--ease)}.foot-base img:hover{transform:rotate(180deg)}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.js .rv{opacity:1;transform:none}}

/* tile badges */
.t-sz{position:absolute;top:14px;right:14px;z-index:2;min-width:34px;height:34px;padding:0 8px;display:grid;place-items:center;border-radius:999px;background:rgba(15,22,18,.55);color:var(--white);font-size:.78rem;font-weight:600;letter-spacing:.04em;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);transition:background .3s,color .3s}
.tile:hover .t-sz{background:var(--lime);color:var(--ink)}
.t-plan{position:absolute;top:14px;left:14px;z-index:2;padding:6px 12px;border-radius:999px;background:var(--lime);color:var(--ink);font-size:.78rem;font-weight:600}
.partof{display:inline-flex;align-items:center;gap:6px;margin-left:14px;font-size:.85rem;font-weight:500;color:var(--white);text-decoration:none;border-bottom:2px solid var(--lime);padding-bottom:2px}
.partof:hover .ar{transform:translateX(4px)}
/* pull quotes */
.pull{padding-top:clamp(48px,7vw,96px);padding-bottom:clamp(48px,7vw,96px)}
.pull p{margin:0;font:400 clamp(1.9rem,4.6vw,4rem)/1.08 var(--s);letter-spacing:-.02em;max-width:18em}
.pull p:before{content:"";display:block;width:56px;height:4px;background:var(--lime);margin-bottom:24px}
/* pin highlight: grow and change colour */
.leaflet-marker-icon:hover .pin,.pin.hot{transform:scale(1.7);background:var(--sea);border-color:var(--lime);border-width:3px;box-shadow:0 0 0 6px rgba(201,226,101,.35)}
.pin{transition:transform .25s var(--ease),background .25s,border-color .25s,box-shadow .25s}
.mapp .top{background:rgba(238,240,236,.92);background:color-mix(in srgb,var(--paper) 88%,transparent);border-bottom-color:var(--line)}
.hero-img,.phero>img,.tile img,.theme img,.person img{color:transparent}
.person figcaption{color:var(--ink);margin-top:0}
@media(max-width:699px){.person img{max-width:420px}}
figcaption a{display:inline-block;padding:6px 0}
