/* InScope website, version 6.
   Brand system v3.1: black and white, Bricolage Grotesque (800 statements, 600 uppercase labels, 400 text),
   the Sundown gradient only on the cover and closes. One light theme by choice.
   Mobile first. Breakpoints: 720 (tablet), 880 (wide tablet), 1080 (desktop navigation). */

:root{
  --paper:#FFFFFF; --ink:#0B0B0C; --ink-2:#2A2A29; --stone:#62625F; --hair:#E2E2DE; --panel:#F3F3F1;
  --night:#0B0B10; --on-night:#FFFFFF; --on-night-2:rgba(255,255,255,.74); --night-hair:rgba(255,255,255,.16);
  --g:20px; --max:1240px; --hdr:60px;
  --sans:'Bricolage Grotesque','Helvetica Neue',Helvetica,Arial,sans-serif;
  --grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .5 0 0 0 0 .5 0 0 0 0 .5 0 0 0 .55 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  --sundown:radial-gradient(110% 80% at 96% 116%,#F3DDBE 0%,rgba(243,221,190,0) 50%),radial-gradient(120% 80% at 28% 122%,#C8622C 0%,rgba(200,98,44,0) 55%),linear-gradient(140deg,#08080E 0%,#14141E 32%,#2A2837 50%,#5E2A1C 64%,#C56B3A 80%,#E3A574 91%,#EFCFA6 100%);
  --scrim:linear-gradient(100deg,rgba(8,8,14,.62) 0%,rgba(8,8,14,.28) 55%,rgba(8,8,14,0) 82%);
  --horizon:linear-gradient(90deg,#F3DDBE 0%,#E3A574 26%,#C56B3A 46%,#5E2A1C 66%,#2A2837 84%,#0A0A10 100%);
  color-scheme:light;
  padding-block:env(safe-area-inset-top,0px) env(safe-area-inset-bottom,0px);
}
@media (min-width:720px){ :root{ --g:32px; --hdr:68px } }
@media (min-width:1080px){ :root{ --g:48px } }

*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth; scroll-padding-top:calc(env(safe-area-inset-top,0px) + var(--hdr) + 60px)}
body{margin:0; background:var(--paper); color:var(--ink); font-family:var(--sans); font-size:17px; line-height:1.55; -webkit-font-smoothing:antialiased; overflow-x:clip}
img{display:block; max-width:100%; height:auto}
a{color:inherit}
p,h1,h2,h3,h4,ul,ol,dl,dd,figure,blockquote{margin:0}
ul,ol{padding:0; list-style:none}
button,input{font:inherit; color:inherit}
:focus-visible{outline:2px solid var(--ink); outline-offset:3px}
.dark :focus-visible,.hero :focus-visible,.close :focus-visible,.ftr :focus-visible,.sheet :focus-visible{outline-color:#fff}

h1,h2,h3,h4{font-weight:800; letter-spacing:-.03em; line-height:1.04; text-wrap:balance}
h1{font-size:clamp(36px,6vw,68px)}
h2{font-size:clamp(28px,4.2vw,48px)}
h3{font-size:clamp(20px,2.2vw,24px); letter-spacing:-.02em; line-height:1.12}
h4{font-size:18px; letter-spacing:-.01em; line-height:1.25}
.lede{font-size:clamp(18px,2vw,21px); line-height:1.45; font-weight:500; max-width:52ch}
.lbl{font-size:12px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; line-height:1.35}
.cap{font-size:13px; line-height:1.45; color:var(--stone)}
.note{font-size:15px; line-height:1.5; color:var(--stone)}
.sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
.wrap{max-width:var(--max); margin-inline:auto; padding-inline:var(--g)}
.u,.more{font-weight:700; text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:5px}
.more{white-space:nowrap}
/* standalone text links get a 40px tap height without changing the line they sit on */
a.more,.about a.u,.newsitem a.u,.copyrow a.u{display:inline-flex; align-items:center; min-height:40px}

/* buttons and tags */
.btn{display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:0 22px; border:2px solid var(--ink); background:var(--ink); color:var(--paper);
     font-weight:700; font-size:16px; line-height:1.15; text-decoration:none; text-align:center; cursor:pointer}
.btn:hover{background:var(--ink-2); border-color:var(--ink-2)}
.btn.ghost{background:transparent; color:var(--ink); border-color:var(--ink)}
.btn.ghost:hover{background:var(--ink); color:var(--paper)}
.btn.light{background:#fff; border-color:#fff; color:var(--ink)}
.btn.light:hover{background:rgba(255,255,255,.86); border-color:rgba(255,255,255,.86)}
.btn.line{background:transparent; border-color:#fff; color:#fff}
.btn.line:hover{background:#fff; color:var(--ink)}
.btn.sm{min-height:40px; padding:0 16px; font-size:14.5px}
.act{display:flex; flex-wrap:wrap; gap:10px}
.tags{display:flex; flex-wrap:wrap; gap:6px}
.tag{display:inline-block; font-size:11px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; line-height:1; padding:6px 8px 5px; border:1px solid var(--hair); color:var(--stone)}

/* announcement bar */
.announce{background:var(--ink); color:#fff; font-size:13.5px}
.announce .wrap{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:4px 16px; padding-block:9px}
.announce .d{color:rgba(255,255,255,.72); font-weight:600}
.announce a{font-weight:700; text-underline-offset:3px; display:inline-flex; align-items:center; min-height:40px; margin-block:-10px}
@media (max-width:719px){ .announce .d{display:none} .announce .wrap{justify-content:center} }

/* header */
.hdr{position:sticky; top:env(safe-area-inset-top,0px); z-index:30; background:var(--paper); border-bottom:1px solid var(--hair)}
.hdr .wrap{display:flex; align-items:center; gap:30px; height:var(--hdr)}
.brand{flex:none; display:flex; align-items:center; min-height:44px}
.brand img{height:16px; width:auto}
.nav,.hdr .wrap > nav{display:none}
.hdr .right{margin-left:auto; display:flex; align-items:center; gap:14px}
.menu-btn{appearance:none; background:none; border:0; font-weight:700; font-size:15px; min-height:44px; padding:0 0 0 8px; cursor:pointer}
@media (min-width:720px){ .brand img{height:18px} }
@media (min-width:1080px){ .hdr .wrap > nav{display:flex; align-self:stretch} .nav{display:flex; gap:28px; align-self:stretch} .menu-btn{display:none} }
.nav > li{position:relative; display:flex; align-items:center}
.nav .top{appearance:none; background:none; border:0; min-height:40px; padding:0; display:flex; align-items:center; gap:8px; font-weight:700; font-size:15px; cursor:pointer}
.nav .top::after{content:""; width:6px; height:6px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:translateY(-2px) rotate(45deg); transition:transform .2s}
.nav .top[aria-expanded="true"]::after{transform:translateY(1px) rotate(-135deg)}
.nav .here > .top{text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:8px}
.nav a.top{text-decoration:none}
.nav a.top::after{content:none}
.panel{position:absolute; top:100%; left:-20px; width:300px; background:var(--paper); border:1px solid var(--hair); box-shadow:0 18px 40px rgba(11,11,12,.10); padding:8px 0}
.panel a{display:block; padding:10px 20px; text-decoration:none}
.panel a:hover,.panel a:focus-visible{background:var(--panel)}
.panel b{display:block; font-weight:700; font-size:15px; line-height:1.3}
.panel span{display:block; font-size:13px; color:var(--stone); line-height:1.35; margin-top:2px}
.panel .sub{border-top:1px solid var(--hair); margin-top:6px; padding-top:6px}
.panel .sub a{padding-block:7px}
.panel .sub b{font-weight:600; font-size:14.5px}

/* mobile menu sheet */
.sheet{position:fixed; inset:0; z-index:60; background:var(--night); color:#fff; overflow-y:auto;
       padding:env(safe-area-inset-top,0px) var(--g) calc(32px + env(safe-area-inset-bottom,0px))}
.sheet .top{display:flex; align-items:center; justify-content:space-between; height:var(--hdr)}
.sheet .top img{height:16px; width:auto}
.sheet .x{appearance:none; background:none; border:0; color:#fff; font-weight:700; font-size:15px; min-height:44px; padding:0 0 0 12px; cursor:pointer}
.sheet details,.sheet .plain{border-bottom:1px solid var(--night-hair)}
.sheet summary,.sheet .plain{display:flex; justify-content:space-between; align-items:center; padding:16px 0; font-weight:800; font-size:26px; letter-spacing:-.02em; line-height:1.1; cursor:pointer; text-decoration:none}
.sheet summary{list-style:none}
.sheet summary::-webkit-details-marker{display:none}
.sheet summary::after{content:"+"; font-weight:400}
.sheet details[open] summary::after{content:"\2013"}
.sheet details div{padding:0 0 14px}
.sheet details a{display:flex; align-items:center; min-height:44px; padding:0; color:var(--on-night-2); text-decoration:none; font-weight:600; font-size:17px}
.sheet details a.in{padding-left:16px; font-size:16px}
.sheet .go{display:grid; gap:12px; margin-top:26px}
.sheet .fine{margin-top:18px; color:var(--on-night-2)}

/* home: cover */
.hero{color:#fff; background:var(--scrim),var(--grain),var(--sundown); background-blend-mode:normal,overlay,normal,normal,normal}
.hero .wrap{padding-block:56px 64px}
.hero .lbl{color:rgba(255,255,255,.86)}
.hero h1{font-size:clamp(42px,7.4vw,100px); line-height:.96; letter-spacing:-.04em; margin-top:16px; max-width:13ch}
.hero .lede{margin-top:22px; color:rgba(255,255,255,.92); max-width:46ch}
.hero .act{margin-top:30px}
@media (min-width:720px){ .hero .wrap{padding-block:96px 104px} }
/* cover video: a silent loop from past SCOPE footage under the brand's photo scrim (night at the base, warm dusk mid-tone) */
.hero.has-video{position:relative; overflow:hidden; background:#0F0C12; display:flex; align-items:flex-end;
  min-height:clamp(520px, calc(100vh - 128px), 880px); min-height:clamp(520px, calc(100svh - 128px), 880px)}
.hero.has-video .wrap{position:relative; z-index:1; width:100%}
.hero-media{position:absolute; inset:0; background:#0F0C12 url(img/cover-poster-1280.jpg) center/cover no-repeat}
@media (min-width:900px){ .hero-media{background-image:url(img/cover-poster.jpg)} }
.hero-video{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .8s ease}
.hero-video.on{opacity:1}
.hero-media::after{content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(15,12,18,.2) 0%, rgba(58,30,20,.38) 48%, rgba(15,12,18,.9) 100%),
             linear-gradient(90deg, rgba(15,12,18,.55) 0%, rgba(15,12,18,0) 72%)}
.hero-pause{position:absolute; z-index:2; top:14px; right:var(--g); appearance:none; min-height:40px; padding:0 14px; display:inline-flex; align-items:center; gap:8px;
  background:rgba(15,12,18,.45); color:#fff; border:1px solid rgba(255,255,255,.55); font-weight:600; font-size:13.5px; cursor:pointer}
.hero-pause::before{content:""; width:10px; height:12px; border-left:3px solid currentColor; border-right:3px solid currentColor; box-sizing:border-box}
.hero-pause[aria-pressed="true"]::before{width:0; height:0; border-style:solid; border-width:6px 0 6px 10px; border-color:transparent transparent transparent currentColor}
.hero-pause:hover{background:rgba(15,12,18,.7)}

/* key facts bar */
.facts{border-bottom:1px solid var(--hair)}
.facts dl{display:grid; grid-template-columns:1fr 1fr; margin:0}
.facts dl > div{padding:16px 0}
.facts dt{color:var(--stone)}
.facts dd{margin:5px 0 0; font-weight:700; font-size:15.5px; line-height:1.35}
@media (max-width:879px){
  .facts dl > div:nth-child(odd){padding-right:14px; border-right:1px solid var(--hair)}
  .facts dl > div:nth-child(even){padding-left:14px}
  .facts dl > div:nth-child(-n+2){border-bottom:1px solid var(--hair)}
}
@media (min-width:880px){ .facts dl{grid-template-columns:repeat(4,1fr)} .facts dl > div{padding:22px 20px; border-left:1px solid var(--hair)} .facts dl > div:first-child{padding-left:0; border-left:0} }

/* sections */
.sec{padding-block:64px}
.sec.tint{background:var(--panel)}
.sec + .sec:not(.tint){border-top:1px solid var(--hair)}
@media (min-width:1080px){ .sec{padding-block:96px} }
.sh{display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:14px 32px; margin-bottom:32px}
.sh .lbl{color:var(--stone); margin-bottom:12px}
.sh h2{max-width:22ch}
.sh .lede{margin-top:12px}
.sub-h{font-size:clamp(22px,2.8vw,30px); margin-bottom:18px}

/* home: about and numbers */
.about{display:grid; gap:40px}
.about h2{max-width:19ch}
.about .lede{margin-top:18px}
.about p + p{margin-top:14px}
.about .body p:not(.lede){color:var(--ink-2); max-width:60ch}
.about .body .line{color:var(--ink); font-weight:700}
.about .u{display:inline-block; margin-top:18px}
.numbers{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:24px; border-top:2px solid var(--ink); align-self:start}
.numbers div{padding:18px 0 20px; border-bottom:1px solid var(--hair)}
.numbers dt{font-weight:800; font-size:clamp(34px,4vw,48px); letter-spacing:-.04em; line-height:1; font-variant-numeric:tabular-nums}
.numbers dd{margin:8px 0 0; font-size:14.5px; color:var(--stone); font-weight:500; line-height:1.35}
@media (min-width:1080px){ .about{grid-template-columns:1.25fr .75fr; gap:80px} }

/* photo cards: ways in, experiences */
.cards{display:grid; gap:40px 24px}
@media (min-width:720px){ .cards{grid-template-columns:1fr 1fr} }
@media (min-width:1080px){ .cards.four{grid-template-columns:repeat(4,1fr)} .cards.three{grid-template-columns:repeat(3,1fr)} }
.card .ph{display:block; overflow:hidden; background:var(--panel)}
.card .ph img{width:100%; aspect-ratio:4/3; object-fit:cover; transition:transform .5s ease}
.card .ph:hover img{transform:scale(1.03)}
.card .tags{margin-top:14px}
.card h3{margin-top:12px}
.card h3 a{text-decoration:none}
.card h3 a:hover{text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:4px}
.card p{margin-top:8px; font-size:15.5px; line-height:1.5; color:var(--ink-2)}
.card{display:flex; flex-direction:column}   /* cards in a row share a height, so buttons line up */
.card .act{margin-top:auto; padding-top:16px}
.grid-cap{margin-top:24px}

/* tabs */
.tabs{display:flex; gap:26px; border-bottom:1px solid var(--hair); margin-bottom:24px; overflow-x:auto; scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs [role=tab]{appearance:none; background:none; border:0; border-bottom:3px solid transparent; margin-bottom:-1px; padding:12px 0; font-weight:700; font-size:17px; color:var(--stone); cursor:pointer; white-space:nowrap}
.tabs [role=tab][aria-selected="true"]{color:var(--ink); border-bottom-color:var(--ink)}
.tabs [role=tab] span{font-weight:600; font-size:13px; margin-left:6px}
.panel-foot{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px 24px; margin-top:24px}

/* Feature Project cards */
.fpgrid{display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,150px),1fr)); gap:12px}
@media (min-width:720px){ .fpgrid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))} }
.fp{border:1px solid var(--hair); padding:14px; display:flex; flex-direction:column; gap:10px; min-height:168px}
.fp h3{font-size:clamp(19px,2.6vw,30px); overflow-wrap:break-word}
.fp .tag{white-space:nowrap}
a.fp{text-decoration:none; color:inherit}
a.fp:hover h3{text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:4px}
.fp .ph{margin:-14px -14px 4px; aspect-ratio:4/3; overflow:hidden; background:var(--panel)}
.fp .ph img{width:100%; height:100%; object-fit:cover; transition:transform .5s ease}
a.fp:hover .ph img{transform:scale(1.03)}
.fp .ph.none{display:flex; align-items:flex-end; padding:12px}
.fp .ph.none .lbl{color:var(--stone)}
.fpgrid.editorial .fp.lead .ph{background:#1d1d24}
.fpgrid.editorial .fp .ph{flex:1 0 auto}   /* a card beside the taller lead fills the row with its image */
@media (min-width:720px){ .fp{padding:18px} .fp .ph{margin:-18px -18px 4px} }
.fp .tag{align-self:flex-start}
.fp .with{margin-top:auto; font-size:14px; line-height:1.4; color:var(--stone)}
.fpgrid.editorial .fp.lead{background:var(--night); color:#fff; border-color:var(--night)}
.fpgrid.editorial .fp.lead .tag{border-color:var(--night-hair); color:var(--on-night-2)}
.fpgrid.editorial .fp.lead .with{color:var(--on-night-2)}
@media (min-width:720px){ .fpgrid.editorial{grid-template-columns:repeat(3,1fr)} .fpgrid.editorial .fp.lead{grid-column:span 2; min-height:260px} .fpgrid.editorial .fp.lead h3{font-size:clamp(40px,5vw,64px)} .fpgrid.editorial .fp.lead .ph{aspect-ratio:16/9} }

/* event cards */
.evgroup + .evgroup{margin-top:28px}
.evgroup > .lbl{color:var(--stone); margin-bottom:12px}
.evgrid{display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr)); gap:12px}
.ev{padding:20px; display:flex; flex-direction:column; gap:10px; border:1px solid var(--hair); background:var(--paper)}
@media (min-width:720px){ .ev{min-height:210px} }
.ev.night{background:var(--night); color:#fff; border-color:var(--night)}
.ev.night .tag{border-color:var(--night-hair); color:var(--on-night-2)}
.ev h3{font-size:clamp(22px,2.4vw,26px)}
.ev .host{font-size:14.5px; line-height:1.4}
.ev .desc{font-size:14.5px; line-height:1.45; color:var(--ink-2)}
.ev .foot{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:10px; margin-top:auto; padding-top:8px}
.ev .when{font-size:13px; color:var(--stone)}
.ev.night .host,.ev.night .when,.ev.night .desc{color:var(--on-night-2)}
.ev.night .save{border-color:var(--night-hair); color:#fff}
.ev.night .save[aria-pressed="true"]{background:#fff; color:var(--ink); border-color:#fff}

/* save button */
.save{appearance:none; background:transparent; border:1px solid var(--hair); min-height:40px; padding:0 12px; display:inline-flex; align-items:center; gap:7px; font-weight:700; font-size:13.5px; cursor:pointer; white-space:nowrap}
.save:hover{border-color:currentColor}
.save svg{width:13px; height:13px; flex:none}
.save svg path{fill:none; stroke:currentColor; stroke-width:2}
.save[aria-pressed="true"]{background:var(--ink); color:#fff; border-color:var(--ink)}
.save[aria-pressed="true"] svg path{fill:currentColor}

/* rhythm of the day and hours */
.horizon{height:8px; background:var(--horizon)}
.day3{display:grid}
.day3 li{padding:20px 0 24px; border-bottom:1px solid var(--hair)}
.day3 .lbl{color:var(--stone)}
.day3 h3{margin-top:10px}
.day3 p{margin-top:8px; color:var(--ink-2); max-width:44ch; font-size:16px}
@media (min-width:880px){ .day3{grid-template-columns:repeat(3,1fr)} .day3 li{border-bottom:0; padding:24px 28px 8px 0} .day3 li + li{border-left:1px solid var(--hair); padding-left:28px} }
.hours-h{margin-top:48px; margin-bottom:14px; font-size:clamp(20px,2.2vw,24px)}
.floorhours{border-top:2px solid var(--ink); padding-top:16px; display:grid; gap:6px}
.floorhours .t{font-weight:800; font-size:clamp(32px,5vw,56px); letter-spacing:-.03em; line-height:1; font-variant-numeric:tabular-nums}
.floorhours .d{font-weight:700; font-size:clamp(17px,2vw,20px); margin-top:6px}
.visit-row{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:14px 28px; margin-top:28px}
.addr{font-weight:700; font-size:18px; line-height:1.35}
.addr span{display:block; font-weight:500; font-size:14.5px; color:var(--stone)}

/* registration cards */
.passes{display:grid; gap:12px}
@media (min-width:720px){ .passes{grid-template-columns:1fr 1fr} .pass.feat{grid-column:1/-1} }
@media (min-width:1080px){ .passes{grid-template-columns:repeat(4,1fr)} .pass.feat{grid-column:1/-1; display:grid; grid-template-columns:1fr 1fr; column-gap:48px; align-items:start} .pass.feat > :not(.spec):not(.btn){grid-column:1} .pass.feat .tag{justify-self:start} .pass.feat .spec{grid-column:2; grid-row:1 / span 3; border-top:0; padding-top:0} .pass.feat .btn{grid-column:2; justify-self:start; padding-inline:32px} }
.pass{border:1px solid var(--hair); background:var(--paper); padding:22px; display:flex; flex-direction:column; gap:12px}
.pass.feat{background:var(--night); color:#fff; border-color:var(--night)}
.pass .tag{align-self:flex-start}
.pass.feat .tag{border-color:var(--night-hair); color:var(--on-night-2)}
.pass h3{font-size:clamp(22px,2.4vw,28px)}
.pass > p{font-size:15px; line-height:1.45; color:var(--ink-2)}
.pass.feat > p{color:var(--on-night-2)}
.spec{display:grid; gap:10px; border-top:1px solid var(--hair); padding-top:12px; font-size:14.5px; line-height:1.4}
.pass.feat .spec{border-color:var(--night-hair)}
.spec b{display:block; font-weight:600; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--stone); margin-bottom:2px}
.pass.feat .spec b{color:var(--on-night-2)}
.pass .btn{margin-top:auto}
.price{display:flex; align-items:baseline; gap:8px; margin-top:-2px}
.price b{font-weight:800; font-size:clamp(30px,3vw,38px); letter-spacing:-.03em; line-height:1}
.price span{font-size:12px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--stone)}
.price-std{margin-top:-6px; font-size:14px; color:var(--stone)}
.pass.feat .price span,.pass.feat .price-std{color:var(--on-night-2)}
.hosted .note{margin:-4px 0 14px}
@media (min-width:880px){ .hosted .plist{grid-template-columns:repeat(3,1fr)} }
.part{margin-top:44px}
.part h3{margin-bottom:14px}
.plist{display:grid; border-top:1px solid var(--ink)}
.plist a{display:grid; gap:2px; padding:14px 0; border-bottom:1px solid var(--hair); text-decoration:none}
.plist b{font-weight:700; font-size:17px}
.plist span{font-size:14.5px; color:var(--stone)}
.plist a:hover b{text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:4px}
@media (min-width:880px){ .plist{grid-template-columns:repeat(5,1fr); column-gap:16px} .plist a{padding:16px 0 18px} }
.part .note{margin-top:16px}

/* partners */
.pgrid{display:grid; grid-template-columns:repeat(2,1fr); border-top:1px solid var(--hair); border-left:1px solid var(--hair)}
@media (min-width:720px){ .pgrid{grid-template-columns:repeat(4,1fr)} }
@media (min-width:1080px){ .pgrid{grid-template-columns:repeat(4,1fr)} }   /* 16 partners: four even rows */
.pgrid li{border-right:1px solid var(--hair); border-bottom:1px solid var(--hair); padding:16px; min-height:88px; display:flex; align-items:flex-end; font-weight:700; font-size:15.5px; line-height:1.25; background:var(--paper)}
.pgroup + .pgroup{margin-top:40px}
.pcards{display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr)); gap:12px}
.pcard{border:1px solid var(--hair); padding:20px; display:grid; gap:8px; align-content:start; min-height:120px}
.pcard h4{font-size:20px}
.pcard p{font-size:14.5px; line-height:1.45; color:var(--ink-2)}
.join{margin-top:28px; padding:24px; background:var(--panel); display:grid; gap:14px}
.sec.tint .join{background:var(--paper)}
@media (min-width:880px){ .join{grid-template-columns:1fr auto; align-items:center; gap:18px 40px} }
.join p{color:var(--ink-2); margin-top:6px}
.copyrow{display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px}
.copyrow code{font-family:inherit; font-weight:700; font-size:17px; user-select:all; overflow-wrap:anywhere}
.copy{appearance:none; background:transparent; border:2px solid currentColor; min-height:40px; padding:0 12px; font-weight:700; font-size:13.5px; cursor:pointer}

/* news and press */
.news{display:grid; gap:36px}
@media (min-width:880px){ .news{grid-template-columns:1.4fr 1fr; gap:56px} }
.newsitem,.press{border-top:2px solid var(--ink); padding-top:18px}
.newsitem .lbl,.press .lbl{color:var(--stone)}
.newsitem h3{font-size:clamp(24px,3vw,34px); margin-top:10px}
.newsitem p{margin-top:10px; color:var(--ink-2); max-width:56ch}
.newsitem .u{display:inline-block; margin-top:16px}
.press{display:grid; gap:12px; align-content:start}
.press p{color:var(--ink-2)}
.press .btn{justify-self:start}

/* heritage photographs */
.strip{display:grid; grid-auto-flow:column; grid-auto-columns:78%; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none;
       margin-inline:calc(-1 * var(--g)); padding-inline:var(--g); scroll-padding-inline:var(--g)}
.strip::-webkit-scrollbar{display:none}
.strip figure{scroll-snap-align:start}
.strip img{width:100%; aspect-ratio:4/3; object-fit:cover}
@media (min-width:720px){ .strip{grid-auto-columns:40%} }
@media (min-width:1080px){ .strip{grid-auto-flow:row; grid-template-columns:repeat(5,1fr); overflow:visible; margin-inline:0; padding-inline:0} }

/* closing field */
.close{color:#fff; background:var(--scrim),var(--grain),var(--sundown); background-blend-mode:normal,overlay,normal,normal,normal}
.close .wrap{padding-block:80px 88px}
.close h2{font-size:clamp(34px,6vw,80px); max-width:14ch; line-height:1}
.close p{margin-top:16px; color:rgba(255,255,255,.9); max-width:44ch}
.close .act{margin-top:28px}
@media (min-width:720px){ .close .wrap{padding-block:120px 128px} }

/* footer */
.ftr{background:var(--night); color:#fff}
.ftr .wrap{padding-block:56px calc(40px + env(safe-area-inset-bottom,0px))}
.ftop{display:grid; gap:18px; padding-bottom:32px; border-bottom:1px solid var(--night-hair)}
.ftop img{height:18px; width:auto}
.ftop p{color:var(--on-night-2); max-width:46ch; margin-top:14px}
.ftop .btn{justify-self:start}
@media (min-width:880px){ .ftop{grid-template-columns:1fr auto; align-items:end} }
.fcols{display:grid; grid-template-columns:1fr 1fr; gap:28px 20px; padding-block:32px; border-bottom:1px solid var(--night-hair)}
.fcols .lbl{color:var(--on-night-2); margin-bottom:10px}
.fcols a{display:flex; align-items:center; min-height:40px; padding:0; text-decoration:none; font-weight:600; font-size:15px}
.fcols a:hover{text-decoration:underline; text-underline-offset:4px}
@media (min-width:880px){ .fcols{grid-template-columns:repeat(5,1fr)} }
.fcontact{display:grid; gap:20px; padding-block:28px; border-bottom:1px solid var(--night-hair)}
.fcontact .lbl{color:var(--on-night-2); margin-bottom:6px}
.fcontact .copy{color:#fff}
@media (min-width:720px){ .fcontact{grid-template-columns:1fr 1fr} }
@media (min-width:1080px){ .fcontact{grid-template-columns:repeat(3,1fr)} }
.gal-apply{margin-bottom:48px}
.fine{display:flex; flex-wrap:wrap; gap:6px 24px; padding-top:22px; font-size:12.5px; color:var(--on-night-2)}

/* inner pages */
.phead .wrap{padding-block:36px 34px}
.crumb{display:flex; flex-wrap:wrap; gap:8px; font-size:13.5px; color:var(--stone)}
.crumb a{font-weight:600; color:var(--ink); text-decoration:none; display:inline-flex; align-items:center; min-height:40px; margin-block:-10px}
.crumb a:hover{text-decoration:underline}
.phead h1{margin-top:14px; max-width:20ch}
.phead .lede{margin-top:16px}
@media (min-width:1080px){ .phead .wrap{padding-block:60px 52px} }
.subnav{position:sticky; top:calc(env(safe-area-inset-top,0px) + var(--hdr)); z-index:20; background:var(--paper); border-block:1px solid var(--hair)}
.subnav .wrap{display:flex; align-items:center; gap:24px; overflow-x:auto; scrollbar-width:none}
.subnav .wrap::-webkit-scrollbar{display:none}
.subnav a{flex:none; padding:14px 0 11px; border-bottom:3px solid transparent; text-decoration:none; font-weight:700; font-size:15px; color:var(--stone)}
.subnav a:hover{color:var(--ink)}
.subnav a.on{color:var(--ink); border-bottom-color:var(--ink)}
.subnav i{flex:none; width:1px; height:18px; background:var(--hair)}
.subnav a.in{font-weight:600; font-size:14.5px}

/* announcing-soon panels */
.soon{background:var(--panel); padding:24px; display:grid; gap:10px; align-content:start}
.sec.tint .soon{background:var(--paper)}
.soon .lbl{color:var(--stone)}
.soon h3{font-size:clamp(20px,2.2vw,24px)}
.soon p{color:var(--ink-2); max-width:58ch; font-size:15.5px}
.soon .act{margin-top:6px}
.soon-join > div:first-child{display:grid; gap:10px}
@media (min-width:880px){ .soon-join{grid-template-columns:1fr auto; align-items:center; gap:18px 40px} }
@media (max-width:719px){ .hdr-apply{display:none} }

/* layout section */
.split{display:grid; gap:28px}
@media (min-width:880px){ .split{grid-template-columns:1fr 1fr; gap:48px; align-items:start} }
.ticks{display:grid; border-top:1px solid var(--ink)}
.ticks li{padding:14px 0; border-bottom:1px solid var(--hair); font-weight:600}

.block + .block{margin-top:64px}

/* agenda */
.ag-news{margin-bottom:16px; padding:14px 18px; border-left:3px solid var(--ink); background:var(--panel); font-size:15.5px; line-height:1.45; color:var(--ink-2)}
.ag-news b{display:block; font-weight:800; font-size:17px; letter-spacing:-.01em; color:var(--ink); margin-bottom:2px}
.ag-hours{margin-bottom:24px; font-size:15.5px; color:var(--ink-2)}
.ag-hours b{font-weight:700; color:var(--ink)}
.filters{display:grid; gap:14px; padding-block:18px; border-top:2px solid var(--ink); border-bottom:1px solid var(--hair)}
.fg{display:grid; gap:8px; min-width:0}
.fg > .lbl{color:var(--stone)}
@media (min-width:880px){ .fg{grid-template-columns:140px 1fr; align-items:center} }
.chips{display:flex; flex-wrap:wrap; gap:6px}
.chip{flex:none; appearance:none; border:1px solid var(--hair); background:var(--paper); min-height:40px; padding:0 13px; font-weight:600; font-size:14px; cursor:pointer; white-space:nowrap}
.chip:hover{border-color:var(--ink)}
.chip[aria-pressed="true"]{background:var(--ink); color:#fff; border-color:var(--ink)}
.chip span{margin-left:6px; font-weight:700}
.ag-bar{display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px; padding-block:14px}
.ag-bar .ag-count{margin-right:auto}
.linkbtn{appearance:none; background:none; border:0; padding:0; min-height:40px; font-weight:700; font-size:14.5px; text-decoration:underline; text-underline-offset:4px; cursor:pointer}
.ag-count{font-size:14.5px; font-weight:600; color:var(--stone)}
.ag-group{margin-top:22px}
.ag-h{display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 14px; padding-bottom:10px; border-bottom:1px solid var(--ink); font-size:clamp(20px,2.4vw,26px)}
.ag-h span{font-size:13.5px; font-weight:600; letter-spacing:0; color:var(--stone)}
.ag{display:grid; grid-template-columns:1fr auto; gap:6px 16px; align-items:start; padding:16px 0; border-bottom:1px solid var(--hair)}
.ag .when{grid-column:1/-1; font-size:11.5px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--stone)}
.ag h4{font-size:18px}
.ag .host{font-size:14.5px; margin-top:3px}
.ag .meta{font-size:13.5px; color:var(--stone); margin-top:4px}
@media (min-width:880px){ .ag{grid-template-columns:130px 1fr auto; align-items:center} .ag .when{grid-column:auto} }
.ag-empty{margin-top:18px; padding:22px; background:var(--panel); display:flex; flex-wrap:wrap; align-items:center; gap:12px 18px}

/* directory and search */
.search{display:flex; align-items:center; gap:10px; border:2px solid var(--ink); padding:0 14px; min-height:52px; max-width:560px; background:var(--paper)}
.search svg{width:18px; height:18px; flex:none}
.search input{flex:1; min-width:0; border:0; outline:0; background:transparent; font-size:17px; padding:12px 0}
.search:focus-within{outline:2px solid var(--ink); outline-offset:3px}
.dir{border-top:2px solid var(--ink); margin-top:22px}
.dir li{display:grid; gap:4px; padding:16px 0; border-bottom:1px solid var(--hair)}
.dir .n{font-weight:800; font-size:clamp(20px,2.4vw,26px); letter-spacing:-.02em; line-height:1.15}
.dir .w{font-size:14.5px; color:var(--stone)}
.dir .tag{justify-self:start}
.dir a.n{text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:5px; justify-self:start; display:inline-flex; align-items:center; min-height:40px; margin-block:-6px}
@media (min-width:880px){ .dir li{grid-template-columns:1fr 1.5fr auto; align-items:baseline; gap:16px} }
.none{margin-top:16px; padding:18px; background:var(--panel)}

/* FAQ */
.faq-tools{display:grid; gap:16px; margin-bottom:32px}
.phead + .sec.faq,.phead + .sec.newsidx{padding-top:8px}
.faq-group + .faq-group{margin-top:40px}
.faq-group h2{font-size:clamp(22px,2.8vw,30px); padding-bottom:12px; border-bottom:2px solid var(--ink)}
.faq details{border-bottom:1px solid var(--hair)}
.faq summary{list-style:none; display:flex; justify-content:space-between; align-items:flex-start; gap:16px; padding:18px 0; font-weight:700; font-size:17.5px; line-height:1.35; cursor:pointer}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; font-weight:400; font-size:24px; line-height:1}
.faq details[open] summary::after{content:"\2013"}
.faq .a{padding:0 0 20px; max-width:68ch; color:var(--ink-2)}
.faq .a p + p{margin-top:10px}
.faq .a a{font-weight:700}

@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} *{transition:none!important} }

/* about page */
.pillars{display:grid; gap:0 32px; border-top:2px solid var(--ink)}
.pillars li{padding:20px 0 24px; border-bottom:1px solid var(--hair)}
.pillars h3{font-size:clamp(20px,2.2vw,24px)}
.pillars p{margin-top:8px; color:var(--ink-2); max-width:52ch}
@media (min-width:720px){ .pillars{grid-template-columns:1fr 1fr} }
.duo{display:grid; gap:12px; margin-top:40px}
.duo img{width:100%; aspect-ratio:4/3; object-fit:cover}
@media (min-width:720px){ .duo{grid-template-columns:1fr 1fr} }
.who-line{margin-top:32px; font-weight:700}
.founders{display:grid; gap:12px}
@media (min-width:880px){ .founders{grid-template-columns:repeat(3,1fr)} }
.founders li{border:1px solid var(--hair); padding:22px; display:flex; flex-direction:column; gap:6px}
.founders blockquote p{font-weight:700; font-size:18px; line-height:1.4; letter-spacing:-.01em}
.founders .nm{margin-top:auto; padding-top:16px; font-weight:800; font-size:20px; letter-spacing:-.02em}
.founders .lbl{color:var(--stone)}

/* Feature Project pages */
.fhead .wrap{display:grid; gap:28px; padding-block:28px 40px}
.fhead h1{margin-top:12px; font-size:clamp(44px,7vw,88px); line-height:.98; letter-spacing:-.04em}
.fhead .lbl{margin-top:22px; color:var(--stone)}
.fhead .with{margin-top:12px; font-weight:700; font-size:17px}
.fhead .lede{margin-top:18px}
.fhero img{width:100%; max-height:78vh; object-fit:cover; background:var(--panel)}
.fhero .cap{margin-top:8px}
@media (min-width:880px){ .fhead .wrap{grid-template-columns:1fr 1fr; gap:56px; align-items:center; padding-block:48px 64px} }
.fhead + .fmain{padding-top:24px}
.fbody{display:grid; gap:36px}
@media (min-width:1080px){ .fbody{grid-template-columns:300px 1fr; gap:80px; align-items:start} .finfo{position:sticky; top:calc(var(--hdr) + 24px)} }
.finfo dl{margin:0; border-top:2px solid var(--ink)}
.finfo dl > div{padding:12px 0; border-bottom:1px solid var(--hair)}
.finfo dt{color:var(--stone)}
.finfo dd{margin:4px 0 0; font-weight:700; font-size:15.5px; line-height:1.4}
.flinks{margin-top:16px; display:grid; gap:2px}
.flinks a{display:inline-flex; align-items:center; min-height:40px}
.fsec + .fsec{margin-top:48px}
.fsec h2{font-size:clamp(24px,3vw,34px); margin-bottom:16px}
.fsec p{max-width:66ch; color:var(--ink-2)}
.fsec p + p{margin-top:14px}
.fsec .stmt{margin:0; padding-left:20px; border-left:2px solid var(--ink)}
.fsec .stmt p{color:var(--ink)}
.portrait{margin:0 0 20px; max-width:320px}
.portrait img{width:100%; height:auto}
.portrait .cap{margin-top:8px}
.gal-block + .gal-block{margin-top:56px}
.gal-note{margin:-6px 0 18px}
.fgal{columns:1; column-gap:12px}
@media (min-width:720px){ .fgal{columns:2} }
@media (min-width:1080px){ .fgal{columns:3} }
.fgal figure{break-inside:avoid; margin:0 0 20px}
.fgal img{width:100%; height:auto; background:var(--panel)}
.fgal .cap{margin-top:6px}
.fgal.sq{columns:auto; display:grid; grid-template-columns:repeat(2,1fr); gap:12px}
@media (min-width:720px){ .fgal.sq{grid-template-columns:repeat(4,1fr)} }
.fgal.sq figure{margin:0}
.fvideos{display:grid; gap:24px; align-items:start}
@media (min-width:880px){ .fvideos{grid-template-columns:minmax(0,1fr) minmax(0,2fr)} }
.fvid{margin:0}
.fvid video{display:block; width:100%; height:auto; background:#000}
.fvid.vertical video{aspect-ratio:9/16; object-fit:cover; max-height:80vh}   /* crops the black bars of a vertical film shot in 16:9 */
.fvid .cap{margin-top:8px}

/* photograph groups */
.trio{display:grid; gap:12px}
@media (min-width:720px){ .trio{grid-template-columns:repeat(3,1fr)} }
.trio img{width:100%; aspect-ratio:4/3; object-fit:cover}
.trio-cap{margin:10px 0 28px}
.wide-photo{margin:32px 0 0}
.wide-photo img{width:100%; aspect-ratio:4/3; object-fit:cover}
@media (min-width:720px){ .wide-photo img{aspect-ratio:21/9} }
.wide-photo .cap{margin-top:8px}
.sec .duo + .cap{margin-top:10px}

/* news */
.ngrid{display:grid; gap:28px 20px}
@media (min-width:720px){ .ngrid{grid-template-columns:repeat(2,1fr)} }
@media (min-width:1080px){ .ngrid{grid-template-columns:repeat(3,1fr)} }
.nmonth + .nmonth{margin-top:48px}
.nmonth .sub-h{padding-bottom:12px; border-bottom:2px solid var(--ink)}
.ntile a{display:grid; gap:10px; text-decoration:none; color:inherit}
.ntile .ph{overflow:hidden; background:var(--panel)}
.ntile .ph img{width:100%; aspect-ratio:4/3; object-fit:cover; transition:transform .5s ease}
.ntile a:hover .ph img{transform:scale(1.03)}
.ntile a:hover h3{text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:4px}
.ntile .lbl{color:var(--stone); margin-top:4px}
.ntile h3{font-size:clamp(22px,2.4vw,26px)}
.ntile .sum{font-size:15.5px; color:var(--ink-2)}
.news-foot{margin-top:56px; display:grid; gap:24px; max-width:560px}
.narticle h1{max-width:24ch; font-size:clamp(32px,4.6vw,56px)}
.nmeta{margin-top:18px; color:var(--stone)}
.phead + .narticle-body{padding-top:8px}
.nfig{margin:0 0 36px; max-width:900px}
.nfig img{width:100%}
.nfig:not(.nfig-full) img{aspect-ratio:21/9; object-fit:cover}
.nfig .cap{margin-top:8px}
.nfig-full img{height:auto}
.nbody .nfig{margin:32px 0}
.nbody{max-width:68ch}
.nbody p{color:var(--ink-2)}
.nbody p + p,.nbody ul + p,.nbody p + ul{margin-top:16px}
.nbody h2{font-size:clamp(22px,2.6vw,28px); margin:40px 0 14px}
.nbody ul{display:grid; gap:10px; padding-left:20px; list-style:disc; color:var(--ink-2)}
.nbody b{color:var(--ink)}
.nbody a{font-weight:600}
.ntags{margin-top:32px}
.nback{margin:0}
