 /* TYPE */
 .eyebrow {
     font: 700 13px/1 var(--body);
     letter-spacing: .22em;
     text-transform: uppercase;
     color: var(--red);
     margin: 0 0 20px
 }

 .wrap {
     position: relative;
     z-index: 2;
 }

 h1,
 h2 {
     font-family: var(--display);
     font-weight: 900;
     text-transform: uppercase;
     margin: 0;
     text-wrap: balance
 }

 h2 {
     font-size: clamp(44px, 6.4vw, 92px);
     line-height: .9
 }

 em.pk {
     font-style: normal;
     color: var(--red)
 }

 /* HERO */
 .hero {
     padding-top: clamp(110px, 12vw, 150px);
     position: relative;
     overflow: hidden
 }

 .hero-grid {
     display: grid;
     grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
     gap: clamp(20px, 4vw, 60px);
     -webkit-box-align: end;
     -ms-flex-align: end;
     align-items: end
 }

 .hero h1 {
     font-size: clamp(56px, 8.4vw, 132px);
     line-height: .84;
     letter-spacing: -.005em
 }

 .hero h1 span {
     display: block
 }

 .mission {
     margin: clamp(26px, 3vw, 40px) 0 0;
     font: 900 clamp(28px, 3.2vw, 46px)/1 var(--display);
     text-transform: uppercase;
     color: var(--red);
     max-width: 14em;
     position: relative;
     padding-left: 22px;
     border-left: 4px solid var(--red)
 }

 .hero-sub {
     margin: 22px 0 0;
     max-width: 30em;
     color: var(--muted)
 }

 .portrait {
     position: relative;
     -ms-flex-item-align: end;
     align-self: end;
     margin-bottom: -2px;
     isolation: isolate
 }

 .portrait img {
     display: block;
     width: 100%;
     height: auto;
     max-width: 520px;
     margin-inline: auto
 }

 .portrait::before {
     content: "*";
     position: absolute;
     right: 0;
     top: -4%;
     font: 900 clamp(160px, 20vw, 300px)/.8 var(--display);
     color: var(--red);
     opacity: .95;
     z-index: -1
 }

 .hero-base {
     height: 2px;
     background: var(--ink)
 }

 @media (max-width:860px) {
     .hero-grid {
         grid-template-columns: 1fr
     }

     .portrait img {
         max-width: 420px
     }
 }

 /* STATS */
 .stats {
     display: grid;
     grid-template-columns: repeat(4, minmax(0, 1fr));
     border-bottom: 1px solid var(--line)
 }

 .stat {
     padding: clamp(22px, 3vw, 36px) clamp(12px, 2vw, 24px) clamp(22px, 3vw, 36px) 0;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-orient: vertical;
     -webkit-box-direction: normal;
     -ms-flex-direction: column;
     flex-direction: column;
     gap: 8px
 }

 .stat + .stat {
     padding-left: clamp(12px, 2vw, 24px);
     border-left: 1px solid var(--line)
 }

 .stat strong {
     font: 900 clamp(48px, 6vw, 84px)/.85 var(--display);
     color: var(--red);
     font-variant-numeric: tabular-nums
 }

 .stat span {
     font-size: 14px;
     line-height: 1.4;
     max-width: 16em
 }

 @media (max-width:720px) {
     .stats {
         grid-template-columns: 1fr 1fr
     }

     .stat:nth-child(3) {
         border-left: 0;
         padding-left: 0
     }

     .stat:nth-child(n+3) {
         border-top: 1px solid var(--line)
     }
 }

 /* STORY */
 .story {
     padding-block: clamp(70px, 9vw, 130px) 0
 }

 .chapter {
     display: grid;
     grid-template-columns: minmax(180px, 1fr) 2.2fr;
     gap: clamp(24px, 5vw, 80px);
     padding-block: clamp(40px, 5vw, 64px);
     border-top: 1px solid var(--line)
 }

 .chapter:first-of-type {
     border-top: 0;
     padding-top: 0
 }

 .ch-label {
     position: -webkit-sticky;
     position: sticky;
     top: 110px;
     -ms-flex-item-align: start;
     align-self: start
 }

 .ch-label .when {
     font: 700 12px/1 var(--body);
     letter-spacing: .22em;
     text-transform: uppercase;
     color: var(--muted);
     display: block;
     margin-bottom: 10px
 }

 .ch-label h3 {
     margin: 0;
     font: 900 clamp(34px, 3.6vw, 52px)/.92 var(--display);
     text-transform: uppercase
 }

 .ch-body p {
     margin: 0 0 1.1em;
     max-width: 36em
 }

 .ch-body p.lead {
     font-size: clamp(20px, 1.8vw, 24px);
     line-height: 1.45
 }

 .ch-body strong {
     font-weight: 700
 }

 .ch-body .press {
     background: -webkit-gradient(linear, left top, left bottom, color-stop(62%, transparent), color-stop(62%, rgba(255, 0, 122, .22)));
     background: linear-gradient(transparent 62%, rgba(255, 0, 122, .22) 62%);
     font-weight: 700
 }

 .shows {
     list-style: none;
     margin: 6px 0 0;
     padding: 0;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
     gap: 8px
 }

 .shows li {
     font: 700 12px/1 var(--body);
     letter-spacing: .06em;
     text-transform: uppercase;
     border: 1.5px solid var(--ink);
     padding: 9px 11px
 }

 .shows li b {
     color: var(--red);
     font-weight: 700;
     margin-right: 6px;
     font-variant-numeric: tabular-nums
 }

 .ch-photo {
     margin: 28px 0 0
 }

 .ch-photo img {
     display: block;
     width: 100%;
     height: auto;
     aspect-ratio: 16/9;
     -o-object-fit: cover;
     object-fit: cover
 }

 .ch-photo figcaption {
     font-size: 13px;
     color: var(--muted);
     margin-top: 10px;
     letter-spacing: .02em
 }

 .quote {
     margin: clamp(10px, 2vw, 20px) 0 0;
     font: 900 clamp(34px, 4.4vw, 64px)/.95 var(--display);
     text-transform: uppercase;
     max-width: 16em;
     text-wrap: balance
 }

 .quote em {
     font-style: normal;
     color: var(--red)
 }

 @media (max-width:860px) {
     .chapter {
         grid-template-columns: 1fr
     }

     .ch-label {
         position: static
     }
 }


 /* MANIFESTO */
 .manifesto {
     background: var(--red);
     color: #fff;
     padding-block: clamp(80px, 11vw, 160px) calc(env(safe-area-inset-bottom, 0px) + clamp(80px, 11vw, 160px))
 }

 .m-eyebrow {
     color: var(--ink)
 }

 .manifesto p {
     margin: 0
 }

 .m-line {
     font-family: var(--display);
     font-weight: 900;
     text-transform: uppercase;
     line-height: .92;
     -webkit-transform: translateY(28px);
     transform: translateY(28px);
     opacity: .25;
     -webkit-transition: opacity .9s, -webkit-transform .9s cubic-bezier(.2, .7, .2, 1);
     transition: opacity .9s, -webkit-transform .9s cubic-bezier(.2, .7, .2, 1);
     transition: transform .9s cubic-bezier(.2, .7, .2, 1), opacity .9s;
     transition: transform .9s cubic-bezier(.2, .7, .2, 1), opacity .9s, -webkit-transform .9s cubic-bezier(.2, .7, .2, 1)
 }

 .m-line.in {
     -webkit-transform: none;
     transform: none;
     opacity: 1
 }

 .ink {
     color: var(--ink)
 }

 .m-block {
     margin-top: clamp(40px, 6vw, 84px);
     display: grid;
     gap: .08em
 }

 .m-block:first-of-type {
     margin-top: 0
 }

 .m-xl {
     font-size: clamp(44px, 7.4vw, 112px)
 }

 .m-lg {
     font-size: clamp(34px, 4.6vw, 68px)
 }

 .m-statement {
     margin-top: clamp(40px, 6vw, 84px) !important;
     font-size: clamp(36px, 5.2vw, 78px);
     color: var(--ink);
     background: #fff;
     display: inline-block;
     padding: .12em .28em .06em;
     text-wrap: balance
 }

 .m-split {
     grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
     gap: clamp(24px, 4vw, 60px);
     -webkit-box-align: start;
     -ms-flex-align: start;
     align-items: start
 }

 .m-jobs {
     list-style: none;
     margin: 0;
     padding: 0;
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
     gap: .1em 0;
     font-size: clamp(22px, 2.3vw, 34px);
     line-height: 1.12
 }

 .m-jobs li {
     white-space: nowrap
 }

 .m-jobs li:not(:last-child)::after {
     content: ".";
     margin-right: .35em
 }

 .m-jobs li:nth-child(odd) {
     color: rgba(255, 255, 255, .72)
 }

 .m-ways {
     grid-template-columns: repeat(4, minmax(0, 1fr));
     gap: 12px;
     border-top: 2px solid rgba(255, 255, 255, .6);
     padding-top: 18px
 }

 .m-ways .m-line {
     font-size: clamp(24px, 2.6vw, 40px)
 }

 .m-final {
     margin-top: clamp(60px, 9vw, 130px);
     border-top: 4px solid var(--ink);
     padding-top: clamp(20px, 3vw, 34px)
 }

 .m-final .m-line {
     font-size: clamp(64px, 13vw, 210px);
     line-height: .84;
     letter-spacing: -.005em
 }

 @media (max-width:860px) {
     .m-split {
         grid-template-columns: 1fr
     }

     .m-ways {
         grid-template-columns: 1fr 1fr
     }
 }

 @media (prefers-reduced-motion:reduce) {
     .m-line {
         -webkit-transform: none;
         transform: none;
         opacity: 1;
         -webkit-transition: none;
         transition: none
     }
 }

 /* EXHIBITIONS */
 .exh {
     background: var(--ink);
     color: #fff;
     padding-block: clamp(70px, 9vw, 120px);
     margin-top: clamp(60px, 8vw, 110px)
 }

 .exh .eyebrow {
     color: var(--pink-soft)
 }

 .exh-head {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
     -webkit-box-pack: justify;
     -ms-flex-pack: justify;
     justify-content: space-between;
     -webkit-box-align: end;
     -ms-flex-align: end;
     align-items: end;
     gap: 20px 40px
 }

 .exh-head p {
     margin: 0;
     max-width: 26em;
     color: #bdb3b5
 }

 .years {
     margin-top: 44px;
     display: grid;
     grid-template-columns: repeat(4, minmax(0, 1fr));
     gap: 0
 }

 .yr {
     padding: 22px 22px 26px 0;
     border-top: 2px solid rgba(255, 255, 255, .9)
 }

 .yr + .yr {
     padding-left: 22px
 }

 .yr:nth-child(4n+1) {
     padding-left: 0
 }

 .yr h4 {
     margin: 0 0 12px;
     font: 900 44px/.9 var(--display);
     color: var(--red);
     font-variant-numeric: tabular-nums
 }

 .yr ul {
     list-style: none;
     margin: 0;
     padding: 0;
     display: grid;
     gap: 8px;
     font-size: 15px;
     line-height: 1.35
 }

 .yr li {
     color: #e9e3e5
 }

 .exh-more {
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     gap: 10px;
     margin-top: 40px;
     font: 700 13px/1 var(--body);
     letter-spacing: .2em;
     text-transform: uppercase;
     text-decoration: none;
     border-bottom: 2px solid var(--red);
     padding-bottom: 6px
 }

 .exh-more::after {
     content: "\2192";
     font-size: 18px;
     -webkit-transition: -webkit-transform .3s;
     transition: -webkit-transform .3s;
     transition: transform .3s;
     transition: transform .3s, -webkit-transform .3s
 }

 .exh-more:hover::after {
     -webkit-transform: translateX(6px);
     transform: translateX(6px)
 }

 @media (max-width:980px) {
     .years {
         grid-template-columns: repeat(2, minmax(0, 1fr))
     }

     .yr:nth-child(odd) {
         padding-left: 0
     }

     .yr:nth-child(even) {
         padding-left: 22px
     }
 }

 @media (max-width:520px) {
     .years {
         grid-template-columns: 1fr
     }

     .yr,
     .yr:nth-child(even) {
         padding-left: 0
     }
 }




 /* stat counters */
 .hero > .wrap {
     position: relative;
     z-index: 1
 }

 .hero h1,
 .mission,
 .hero-sub,
 .eyebrow {
     position: relative
 }

 .stat strong {
     min-width: 2.2ch
 }

 /* hero splashes (layers from the artist's composition, canvas 2732×2048) */
 html,
 body {
     overflow-x: hidden
 }

 .page {
     position: relative;
     overflow-x: clip
 }

 .splat-clip {
     position: absolute;
     left: 0;
     top: 0;
     width: 100%;
     height: 100%;
     overflow: hidden;
     pointer-events: none;
     z-index: 0
 }

 .splats {
     position: absolute;
     left: 0;
     top: 0;
     width: 100%;
     aspect-ratio: 2732/2048;
     z-index: 0;
     pointer-events: none;
     overflow: hidden;
     -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, color-stop(78%, #000), to(transparent));
     -webkit-mask-image: linear-gradient(#000 78%, transparent);
     mask-image: -webkit-gradient(linear, left top, left bottom, color-stop(78%, #000), to(transparent));
     mask-image: linear-gradient(#000 78%, transparent)
 }

 .spl {
     position: absolute;
     will-change: transform
 }

 .spl img {
     display: block;
     width: 100%;
     height: auto;
     opacity: 0;
     -webkit-transform: scale(.35);
     transform: scale(.35);
     -webkit-transition: opacity .5s ease, -webkit-transform .9s cubic-bezier(.2, 1.5, .35, 1);
     transition: opacity .5s ease, -webkit-transform .9s cubic-bezier(.2, 1.5, .35, 1);
     transition: opacity .5s ease, transform .9s cubic-bezier(.2, 1.5, .35, 1);
     transition: opacity .5s ease, transform .9s cubic-bezier(.2, 1.5, .35, 1), -webkit-transform .9s cubic-bezier(.2, 1.5, .35, 1)
 }

 .spl.drip img {
     -webkit-transform: none;
     transform: none;
     -webkit-clip-path: inset(0 0 100% 0);
     clip-path: inset(0 0 100% 0);
     -webkit-transition: opacity .3s ease, -webkit-clip-path 1.6s cubic-bezier(.3, .7, .2, 1);
     transition: opacity .3s ease, -webkit-clip-path 1.6s cubic-bezier(.3, .7, .2, 1);
     transition: opacity .3s ease, clip-path 1.6s cubic-bezier(.3, .7, .2, 1);
     transition: opacity .3s ease, clip-path 1.6s cubic-bezier(.3, .7, .2, 1), -webkit-clip-path 1.6s cubic-bezier(.3, .7, .2, 1)
 }

 .spl.on img {
     opacity: 1;
     -webkit-transform: scale(1);
     transform: scale(1)
 }

 .spl.drip.on img {
     -webkit-clip-path: inset(0 0 0 0);
     clip-path: inset(0 0 0 0);
     -webkit-transform: none;
     transform: none
 }

 .hero,
 .stats,
 .story {
     position: relative;
     z-index: 1
 }

 .hero {
     background: transparent
 }

 @media (max-width:860px) {
     .splats {
         width: 260vw;
         left: -80vw;
         opacity: .8
     }
 }

 @media (max-width:860px) {
     .hero-grid {
         gap: 0
     }

     .hero-grid > div:first-child {
         display: contents
     }

     .hero-grid .eyebrow {
         -webkit-box-ordinal-group: 2;
         -ms-flex-order: 1;
         order: 1
     }

     .hero-grid h1 {
         -webkit-box-ordinal-group: 3;
         -ms-flex-order: 2;
         order: 2
     }

     .hero-grid .portrait {
         -webkit-box-ordinal-group: 4;
         -ms-flex-order: 3;
         order: 3;
         margin-top: 18px
     }

     .hero-grid .mission {
         -webkit-box-ordinal-group: 5;
         -ms-flex-order: 4;
         order: 4;
         margin-top: 28px
     }

     .hero-grid .hero-sub {
         -webkit-box-ordinal-group: 6;
         -ms-flex-order: 5;
         order: 5;
         margin-bottom: 28px
     }
 }

 @media (prefers-reduced-motion:reduce) {
     .spl img {
         opacity: 1;
         -webkit-transform: none;
         transform: none;
         -webkit-clip-path: none;
         clip-path: none;
         -webkit-transition: none;
         transition: none
     }
 }

 /* about v2: idea, bio, photos, video, manifesto teaser */
 .idea {
     padding-block: clamp(70px, 9vw, 130px) clamp(20px, 3vw, 40px)
 }

 .idea-h {
     margin: 0;
     font: 900 clamp(40px, 5.6vw, 88px)/.92 var(--display);
     text-transform: uppercase;
     max-width: 15em;
     text-wrap: balance
 }

 .idea-h em {
     font-style: normal;
     color: var(--red)
 }

 .bio {
     padding-block: clamp(30px, 4vw, 60px) clamp(60px, 8vw, 110px)
 }

 .bio-grid {
     display: grid;
     grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
     gap: clamp(30px, 5vw, 80px);
     -webkit-box-align: start;
     -ms-flex-align: start;
     align-items: start
 }

 .bio-text p {
     margin: 0 0 1.15em;
     max-width: 36em;
     font-size: 17px;
     line-height: 1.7
 }

 .bio-text p.lead {
     font-size: clamp(19px, 1.6vw, 22px);
     line-height: 1.55
 }

 .bio-photos {
     position: -webkit-sticky;
     position: sticky;
     top: 110px;
     min-width: 0
 }

 .ph-track {
     display: grid;
     grid-auto-flow: column;
     grid-auto-columns: 100%;
     overflow-x: auto;
     -webkit-scroll-snap-type: x mandatory;
     -ms-scroll-snap-type: x mandatory;
     scroll-snap-type: x mandatory;
     scrollbar-width: none;
     scroll-behavior: smooth
 }

 .ph-track::-webkit-scrollbar {
     display: none
 }

 .ph-slide {
     margin: 0;
     scroll-snap-align: start;
     min-width: 0
 }

 .ph-slide img {
     display: block;
     width: 100%;
     aspect-ratio: 4/5;
     -o-object-fit: cover;
     object-fit: cover;
     background: #f4f2f1
 }

 .ph-slide figcaption {
     margin-top: 10px;
     font: 700 11px/1.3 var(--body);
     letter-spacing: .2em;
     text-transform: uppercase;
     color: var(--muted)
 }

 .ph-bar {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-pack: justify;
     -ms-flex-pack: justify;
     justify-content: space-between;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     margin-top: 14px;
     border-top: 1px solid var(--line);
     padding-top: 14px
 }

 .ph-count {
     font: 700 13px/1 var(--body);
     letter-spacing: .18em;
     font-variant-numeric: tabular-nums
 }

 .ph-bar button {
     width: 44px;
     height: 44px;
     margin-left: 8px;
     border: 1.5px solid var(--ink);
     background: none;
     color: var(--ink);
     font: 700 18px/1 var(--body);
     cursor: pointer;
     -webkit-transition: background .2s, color .2s, border-color .2s;
     transition: background .2s, color .2s, border-color .2s
 }

 .ph-bar button:hover {
     background: var(--red);
     border-color: var(--red);
     color: #fff
 }

 .vid {
     padding-block: 0 clamp(60px, 8vw, 110px)
 }

 .vid-head {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: end;
     -ms-flex-align: end;
     align-items: end;
     gap: 20px;
     -webkit-box-pack: justify;
     -ms-flex-pack: justify;
     justify-content: space-between;
     border-top: 2px solid var(--ink);
     padding-top: 20px;
     margin-bottom: 22px
 }

 .vid-head .eyebrow {
     margin: 0
 }

 .vid-head h2 {
     margin: 0;
     font: 900 clamp(36px, 4vw, 60px)/.9 var(--display);
     text-transform: uppercase
 }

 .vid-frame {
     position: relative;
     aspect-ratio: 16/9;
     background: var(--ink);
     overflow: hidden
 }

 .vid-frame iframe {
     position: absolute;
     inset: 0;
     width: 100%;
     height: 100%;
     border: 0
 }

 .vid-link {
     position: absolute;
     inset: 0;
     display: grid;
     place-items: center;
     text-decoration: none;
     color: #fff
 }

 .vid-link span {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-orient: vertical;
     -webkit-box-direction: normal;
     -ms-flex-direction: column;
     flex-direction: column;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     gap: 16px;
     font: 700 12px/1 var(--body);
     letter-spacing: .22em;
     text-transform: uppercase
 }

 .vid-link b {
     width: 78px;
     height: 78px;
     border-radius: 50%;
     background: var(--red);
     display: grid;
     place-items: center;
     -webkit-transition: -webkit-transform .3s;
     transition: -webkit-transform .3s;
     transition: transform .3s;
     transition: transform .3s, -webkit-transform .3s
 }

 .vid-link b::before {
     content: "";
     margin-left: 6px;
     border-left: 22px solid #fff;
     border-block: 14px solid transparent
 }

 .vid-link:hover b {
     -webkit-transform: scale(1.1);
     transform: scale(1.1)
 }

 .vid-cap {
     margin: 12px 0 0;
     font-size: 14px;
     color: var(--muted)
 }

 .mteaser {
     background: var(--red);
     color: #fff;
     padding-block: clamp(70px, 9vw, 130px) calc(env(safe-area-inset-bottom, 0px) + clamp(70px, 9vw, 130px))
 }

 .mteaser .eyebrow {
     color: var(--ink)
 }

 .mteaser h2 {
     margin: 0;
     font: 900 clamp(44px, 6.6vw, 104px)/.9 var(--display);
     text-transform: uppercase;
     max-width: 14em;
     text-wrap: balance
 }

 .mteaser h2 em {
     font-style: normal;
     color: var(--ink)
 }

 .mt-btn {
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     margin-top: 34px;
     background: var(--ink);
     color: #fff;
     text-decoration: none;
     font: 900 24px/1 var(--display);
     text-transform: uppercase;
     letter-spacing: .03em;
     padding: 18px 26px;
     -webkit-transition: background .25s, color .25s;
     transition: background .25s, color .25s
 }

 .mt-btn:hover {
     background: #fff;
     color: var(--red)
 }

 /* about v3 */
 .idea-h .il {
     display: block
 }

 @media (max-width:720px) {
     .idea-h {
         max-width: none
     }

     .idea-h .il {
         display: table;
         white-space: nowrap
     }

     .idea {
         padding-bottom: 10px
     }
 }

 .ph-dots {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-pack: center;
     -ms-flex-pack: center;
     justify-content: center;
     gap: 4px;
     margin-top: 10px
 }

 .ph-dots button {
     width: 26px;
     height: 26px;
     padding: 0;
     border: 0;
     background: none;
     cursor: pointer;
     display: grid;
     place-items: center
 }

 .ph-dots button::before {
     content: "";
     width: 8px;
     height: 8px;
     border-radius: 50%;
     background: #d3cccd;
     -webkit-transition: background .25s, -webkit-transform .25s;
     transition: background .25s, -webkit-transform .25s;
     transition: background .25s, transform .25s;
     transition: background .25s, transform .25s, -webkit-transform .25s
 }

 .ph-dots button[aria-selected="true"]::before {
     background: var(--red);
     -webkit-transform: scale(1.25);
     transform: scale(1.25)
 }

 @media (max-width:860px) {
     .bio-photos {
         margin-bottom: 6px
     }
 }

 .bio-rest > div {
     overflow: hidden
 }

 .bio-text.clamped .bio-rest > div {
     max-height: 5.1em;
     -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, color-stop(10%, #000), to(transparent));
     -webkit-mask-image: linear-gradient(#000 10%, transparent);
     mask-image: -webkit-gradient(linear, left top, left bottom, color-stop(10%, #000), to(transparent));
     mask-image: linear-gradient(#000 10%, transparent)
 }

 .more-btn {
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     gap: 10px;
     margin-top: 6px;
     background: none;
     border: 0;
     border-bottom: 2px solid var(--red);
     padding: 0 0 6px;
     color: var(--ink);
     font: 700 13px/1 var(--body);
     letter-spacing: .2em;
     text-transform: uppercase;
     cursor: pointer
 }

 .more-btn::after {
     content: "+";
     font-size: 18px;
     line-height: 0;
     -webkit-transition: -webkit-transform .3s;
     transition: -webkit-transform .3s;
     transition: transform .3s;
     transition: transform .3s, -webkit-transform .3s
 }

 .more-btn[aria-expanded="true"]::after {
     -webkit-transform: rotate(45deg);
     transform: rotate(45deg)
 }

 .more-light {
     color: #fff;
     display: none;
     margin: 34px 32px 0 0
 }

 .vid-head {
     display: block
 }

 .vid-head .eyebrow {
     margin: 0 0 12px
 }

 .exh + .mteaser {
     margin-top: 50px
 }

 @media (max-width:720px) {
     .mt-btn {
         font-size: 20px;
         padding: 16px 20px;
         white-space: nowrap
     }
 }

 @media (max-width:720px) {
     .years:not(.open) .yr:nth-child(n+3) {
         display: none
     }

     .more-light {
         display: -webkit-inline-box;
         display: -ms-inline-flexbox;
         display: inline-flex
     }
 }

 /* newsletter + footer */

 #forminator-module-2308 label,
 #forminator-module-2317 label,
 .sr {
     position: absolute;
     width: 1px;
     height: 1px;
     overflow: hidden;
     clip: rect(0 0 0 0);
     white-space: nowrap
 }

 .sub {
     background: var(--ink);
     color: #fff
 }

 .sub-in {
     display: grid;
     grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
     gap: 24px 60px;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     padding-block: clamp(40px, 5vw, 64px)
 }

 .sub h2 {
     margin: 0;
     font: 900 clamp(38px, 4.4vw, 64px)/.9 var(--display);
     text-transform: uppercase
 }

 .sub h2 em {
     font-style: normal;
     color: var(--red)
 }

 .sub-copy p {
     margin: 12px 0 0;
     color: #bdb3b5;
     font-size: 16px;
     line-height: 1.5;
     max-width: 30em
 }

 #forminator-module-2308,
 #forminator-module-2317,
 .sub-form {
     display: grid;
     grid-template-columns: 1fr auto;
     align-self: center;
     position: relative;
 }

 #forminator-module-2308 input,
 #forminator-module-2317 input,
 .sub-form input {
     min-width: 0;
     height: 58px;
     border: 0;
     border-radius: 0;
     padding: 0 20px;
     font: 500 17px/1 var(--body);
     background: #fff;
     color: var(--ink);
     outline: none
 }

 #forminator-module-2317 .forminator-response-message,
 #forminator-module-2308 .forminator-response-message {
     position: absolute;
     top: -58px;
     left: 0;
     max-height: 58px;
 }

 #forminator-module-2317 input:focus,
 #forminator-module-2308 input:focus,
 .sub-form input:focus {
     -webkit-box-shadow: inset 0 0 0 3px var(--red);
     box-shadow: inset 0 0 0 3px var(--red)
 }

 #forminator-module-2317 button,
 #forminator-module-2308 button,
 .sub-form button {
     height: 58px;
     border: 0;
     padding: 0 28px;
     background: var(--red);
     color: #fff;
     font: 900 22px/1 var(--display) !important;
     text-transform: uppercase;
     letter-spacing: .04em;
     cursor: pointer;
     -webkit-transition: background .25s, color .25s;
     transition: background .25s, color .25s;
     border-radius: 0;
 }

 #forminator-module-2317 button:hover,
 #forminator-module-2308 button:hover,
 .sub-form button:hover {
     background: #fff;
     color: var(--ink);
     -webkit-box-shadow: none;
     box-shadow: none;
 }

 #forminator-module-2317 .forminator-description,
 #forminator-module-2308 .forminator-description,
 .sub-note {
     grid-column: 1/-1;
     margin: 10px 0 0;
     font-size: 13px;
     color: #8f8587
 }

 .sub-note.ok {
     color: #fff
 }

 .sub-note.err {
     color: var(--red)
 }

 .sf {
     background: #fff !important;
     color: var(--ink) !important
 }

 .sf .wrap {
     padding-block: clamp(40px, 5vw, 60px) calc(env(safe-area-inset-bottom, 0px) + 24px) !important
 }

 .sf-top {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     -webkit-box-pack: justify;
     -ms-flex-pack: justify;
     justify-content: space-between;
     gap: 24px;
     padding-bottom: 28px;
     border-bottom: 1px solid var(--line)
 }

 .sf-logo {
     display: block;
     width: clamp(96px, 9vw, 130px)
 }

 .sf-logo img {
     display: block;
     width: 100%;
     height: auto
 }

 .sf-follow {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     gap: 18px;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap
 }

 .sf-lbl {
     font: 700 13px/1 var(--body);
     letter-spacing: .2em;
     text-transform: uppercase
 }

 .sf-soc {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     gap: 10px
 }

 .sf-soc a {
     width: 48px;
     height: 48px;
     display: grid;
     place-items: center;
     border: 1.5px solid var(--ink);
     color: var(--ink);
     border-radius: 50%;
     -webkit-transition: background .2s, color .2s, border-color .2s;
     transition: background .2s, color .2s, border-color .2s
 }

 .sf-soc a:hover {
     background: var(--red);
     border-color: var(--red);
     color: #fff
 }

 .sf-soc svg {
     width: 21px;
     height: 21px
 }

 .sf-cta {
     display: -webkit-inline-box;
     display: -ms-inline-flexbox;
     display: inline-flex;
     gap: 10px;
     -webkit-box-align: center;
     -ms-flex-align: center;
     align-items: center;
     background: var(--ink);
     color: #fff;
     text-decoration: none;
     font: 900 22px/1 var(--display);
     text-transform: uppercase;
     letter-spacing: .04em;
     padding: 15px 24px;
     -webkit-transition: background .25s;
     transition: background .25s
 }

 .sf-cta:hover {
     background: var(--red)
 }

 .sf-bot {
     display: -webkit-box;
     display: -ms-flexbox;
     display: flex;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
     -webkit-box-pack: justify;
     -ms-flex-pack: justify;
     justify-content: space-between;
     gap: 8px 24px;
     padding-top: 20px;
     font-size: 14px;
     color: var(--muted)
 }

 .sf-bot p {
     margin: 0
 }

 .sf-bot a {
     color: inherit
 }

 @media (max-width:860px) {
     .sub-in {
         grid-template-columns: 1fr
     }
 }

 @media (max-width:720px) {
     .sf-top {
         -webkit-box-orient: vertical;
         -webkit-box-direction: normal;
         -ms-flex-direction: column;
         flex-direction: column;
         -webkit-box-align: start;
         -ms-flex-align: start;
         align-items: flex-start
     }

     .sf-cta {
         width: 100%;
         -webkit-box-pack: center;
         -ms-flex-pack: center;
         justify-content: center
     }

     .sub-form button {
         padding: 0 18px;
         font-size: 19px
     }

     .sf-bot {
         -webkit-box-orient: vertical;
         -webkit-box-direction: normal;
         -ms-flex-direction: column;
         flex-direction: column
     }
 }

 @media (max-width:860px) {
     .bio-grid {
         grid-template-columns: 1fr
     }

     .bio-photos {
         position: static;
         -webkit-box-ordinal-group: 0;
         -ms-flex-order: -1;
         order: -1
     }
 }
