:root{
  --ink:#11110f;
  --paper:#f1eee6;
  --paper-2:#e8e3d8;
  --muted:#706d65;
  --rule:#c8c3b7;
  --dark:#10100f;
  --dark-2:#151613;
  --light:#f3efe6;
  --light-muted:#a3a097;
  --pad:clamp(18px,2.7vw,40px);
  --serif:"Iowan Old Style","Palatino Linotype","Book Antiqua",Palatino,Georgia,serif;
  --sans:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--dark)}
body{margin:0;background:var(--dark);color:var(--light);font-family:var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit}
img{display:block;width:100%}
::selection{background:#fff;color:#111}

.topbar{
  position:fixed;inset:0 0 auto 0;z-index:60;height:66px;
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  padding:0 var(--pad);color:#fff;mix-blend-mode:difference;pointer-events:none
}
.topbar a,.topbar nav{pointer-events:auto}
.brand{font-weight:780;font-size:14px;letter-spacing:-.05em}
.brand span{font-weight:500}
.topbar nav{display:flex;gap:clamp(18px,2.8vw,40px);font-size:11px}
.topbar nav a,.external{opacity:.76;transition:opacity .18s ease}
.topbar nav a:hover,.external:hover{opacity:1}
.external{justify-self:end;font-size:11px}

.hero{
  --hero-fg:#f3efe6;
  --hero-muted:rgba(243,239,230,.68);
  --hero-rule:rgba(243,239,230,.26);
  position:relative;min-height:100svh;overflow:hidden;background:#10100f;color:var(--hero-fg)
}
#flow-static,#flow-motion{position:absolute;inset:0;width:100%;height:100%;display:block}
#flow-motion{pointer-events:auto}
.hero-vignette{
  position:absolute;inset:0;pointer-events:none;
  background:
    linear-gradient(180deg,rgba(0,0,0,.03),transparent 28%,transparent 65%,rgba(0,0,0,.26)),
    radial-gradient(circle at 50% 50%,transparent 55%,rgba(0,0,0,.14) 100%)
}
.hero-ui{
  position:relative;z-index:2;min-height:100svh;padding:96px var(--pad) var(--pad);
  display:grid;grid-template-rows:auto 1fr auto;pointer-events:none
}
.hero-ui button,.hero-ui a{pointer-events:auto}
.hero-meta,.hero-controls{display:flex;align-items:center;justify-content:space-between;gap:20px}
.hero-meta{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--hero-muted)}
.hero-copy{align-self:center;max-width:1020px;padding:7vh 0}
.eyebrow{margin:0 0 18px;font-size:10px;text-transform:uppercase;letter-spacing:.15em;color:var(--hero-muted)}
.hero h1{
  margin:0;font-size:clamp(64px,8.8vw,142px);line-height:.84;letter-spacing:-.07em;font-weight:650;
  text-wrap:balance
}
.hero h1 em{font-family:var(--serif);font-weight:400}
.hero-intro{
  margin:30px 0 0 auto;max-width:560px;
  font-family:var(--serif);font-size:clamp(20px,1.9vw,29px);line-height:1.18;letter-spacing:-.02em;color:var(--hero-muted)
}
.hero-controls{padding-top:14px;border-top:1px solid var(--hero-rule);font-size:10px;text-transform:uppercase;letter-spacing:.09em;color:var(--hero-muted)}
.field-id{display:flex;align-items:center;gap:9px}
.field-dot{width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 0 4px rgba(255,255,255,.05)}
#new-field{
  border:0;background:transparent;padding:0;cursor:pointer;text-transform:uppercase;font-size:10px;letter-spacing:.09em;color:inherit
}
#new-field span{display:inline-block;margin-left:6px;transition:transform .35s ease}
#new-field:hover span{transform:rotate(180deg)}

.section-shell{width:min(100%,1600px);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.section-index{font-size:10px;text-transform:uppercase;letter-spacing:.14em;color:var(--muted)}

.work{background:var(--paper);color:var(--ink);padding:clamp(90px,11vw,170px) 0}
.work-intro{display:grid;grid-template-columns:.28fr 1.72fr;gap:30px;align-items:start;margin-bottom:clamp(90px,13vw,190px)}
.work-title{display:grid;grid-template-columns:1.3fr .7fr;gap:clamp(30px,6vw,100px);align-items:end}
.work-title h2{
  margin:0;font-size:clamp(58px,7vw,116px);line-height:.86;letter-spacing:-.066em;font-weight:640
}
.work-title h2 em{font-family:var(--serif);font-weight:400}
.work-title p{margin:0 0 8px;font-family:var(--serif);font-size:clamp(19px,1.7vw,27px);line-height:1.3;color:var(--muted);max-width:36rem}

.art-slider{position:relative;outline:none}
.slider-stage{
  position:relative;
  min-height:clamp(520px,66vw,800px);
  overflow:hidden;
  border-top:1px solid var(--ink);
  border-bottom:1px solid var(--rule);
  background:
    radial-gradient(circle at 50% 40%,rgba(255,255,255,.55),rgba(255,255,255,0) 46%),
    var(--paper)
}
.slider-viewport{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  perspective:1400px;
  touch-action:pan-y;
  user-select:none
}
.art-slide{
  position:absolute;
  inset:clamp(34px,4.2vw,66px) 0;
  display:grid;
  place-items:center;
  opacity:0;
  filter:blur(10px);
  transform:translate3d(0,0,0) scale(.80);
  pointer-events:none;
  transition:
    transform .9s cubic-bezier(.2,.72,.2,1),
    opacity .72s ease,
    filter .72s ease
}
.art-slide.is-active{
  z-index:4;
  opacity:1;
  filter:blur(0);
  transform:translate3d(0,0,0) scale(1);
  pointer-events:auto
}
.art-slide.is-prev{
  z-index:2;
  opacity:.16;
  filter:blur(5px);
  transform:translate3d(-66%,0,0) scale(.82)
}
.art-slide.is-next{
  z-index:2;
  opacity:.16;
  filter:blur(5px);
  transform:translate3d(66%,0,0) scale(.82)
}
.slide-link{
  display:grid;
  place-items:center;
  height:100%;
  max-height:680px;
  filter:drop-shadow(0 20px 40px rgba(17,17,15,.08))
}
.slide-link--portrait{width:min(42vw,620px)}
.slide-link--square{width:min(58vw,760px)}
.slide-link img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block
}
.slider-edge{
  position:absolute;
  z-index:6;
  inset-block:0;
  width:16%;
  pointer-events:none
}
.slider-edge--left{left:0;background:linear-gradient(90deg,var(--paper) 0%,rgba(241,238,230,.82) 30%,rgba(241,238,230,0) 100%)}
.slider-edge--right{right:0;background:linear-gradient(270deg,var(--paper) 0%,rgba(241,238,230,.82) 30%,rgba(241,238,230,0) 100%)}
.slider-hit{
  position:absolute;
  z-index:7;
  top:0;
  bottom:0;
  width:22%;
  border:0;
  padding:0;
  background:transparent;
  cursor:pointer
}
.slider-hit--prev{left:0;cursor:w-resize}
.slider-hit--next{right:0;cursor:e-resize}
.slider-info{
  display:grid;
  grid-template-columns:1.2fr .6fr 1.2fr;
  gap:24px;
  align-items:center;
  min-height:112px;
  padding:18px 0 0
}
.slider-copy{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:6px 18px;
  align-items:baseline
}
.slider-series{
  grid-column:1/-1;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.13em;
  color:var(--muted)
}
.slider-title{
  font-family:var(--serif);
  font-size:clamp(24px,2.4vw,38px);
  line-height:1;
  font-weight:400;
  letter-spacing:-.025em
}
.slider-kind{
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.1em;
  color:var(--muted)
}
.slider-status{
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:10px;
  align-items:center;
  font-size:9px;
  letter-spacing:.08em;
  color:var(--muted)
}
.slider-progress{height:1px;background:rgba(17,17,15,.16);overflow:hidden}
.slider-progress i{
  display:block;
  width:100%;
  height:100%;
  background:var(--ink);
  transform-origin:left center;
  transform:scaleX(0)
}
.slider-progress i.is-running{animation:sliderProgress 6.8s linear forwards}
@keyframes sliderProgress{to{transform:scaleX(1)}}
.slider-actions{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:10px
}
.slider-actions button{
  width:34px;
  height:34px;
  border:1px solid var(--rule);
  border-radius:50%;
  background:transparent;
  color:var(--ink);
  cursor:pointer;
  transition:background .2s ease,border-color .2s ease,transform .2s ease
}
.slider-actions button:hover{background:var(--ink);color:var(--paper);border-color:var(--ink);transform:translateY(-1px)}
.slider-actions a{
  margin-left:12px;
  padding-bottom:3px;
  border-bottom:1px solid var(--ink);
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.1em
}

.work-outro{margin-top:clamp(130px,16vw,230px)}
.work-outro a{
  min-height:150px;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);
  display:grid;grid-template-columns:.55fr 1.3fr auto;align-items:center;gap:24px;transition:padding .25s ease
}
.work-outro a:hover{padding-inline:12px}
.work-outro span{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.work-outro strong{font-family:var(--serif);font-size:clamp(27px,3vw,48px);font-weight:400;letter-spacing:-.03em}
.work-outro b{font-size:22px;font-weight:400}

.practice{background:var(--dark);color:var(--light);padding:clamp(100px,12vw,180px) 0}
.practice .section-index{color:var(--light-muted)}
.practice-lead{margin-top:clamp(55px,8vw,110px);display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(35px,8vw,130px);align-items:end}
.practice-lead h2{margin:0;font-size:clamp(58px,7.5vw,120px);line-height:.84;letter-spacing:-.067em;font-weight:640}
.practice-lead p{margin:0;font-family:var(--serif);font-size:clamp(20px,1.9vw,29px);line-height:1.27;color:var(--light-muted);max-width:42rem}
.practice-grid{margin-top:clamp(85px,11vw,160px);display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-dark,rgba(243,239,230,.22))}
.practice-grid article{min-height:330px;padding:20px 22px 24px 0;border-right:1px solid rgba(243,239,230,.16)}
.practice-grid article+article{padding-left:22px}
.practice-grid article:last-child{border-right:0}
.practice-grid span{display:block;margin-bottom:85px;font-size:10px;color:var(--light-muted)}
.practice-grid h3{margin:0 0 16px;font-size:clamp(32px,3vw,50px);letter-spacing:-.045em;font-weight:620}
.practice-grid p{margin:0;font-family:var(--serif);font-size:18px;line-height:1.35;color:var(--light-muted)}

.interlude{background:#c8d071;color:#181912;padding:clamp(100px,13vw,200px) 0}
.interlude .section-index{color:rgba(24,25,18,.55)}
.interlude blockquote{
  margin:clamp(65px,9vw,130px) 0 0;max-width:1450px;
  font-family:var(--serif);font-size:clamp(52px,7.2vw,116px);line-height:.91;letter-spacing:-.06em
}

.about{background:#171714;color:var(--light);padding:clamp(100px,12vw,180px) 0}
.about-grid{display:grid;grid-template-columns:.58fr 1.42fr;gap:clamp(40px,9vw,150px)}
.about-aside{display:flex;flex-direction:column;min-height:610px}
.about-aside .section-index{color:var(--light-muted)}
.about-identity{margin:auto 0 0;display:flex;flex-direction:column;gap:10px}
.about-identity strong{font-size:clamp(36px,4.2vw,66px);line-height:.9;letter-spacing:-.055em;font-weight:680}
.about-identity span{font-size:11px;line-height:1.55;color:var(--light-muted)}
.about-main{padding-top:42px}
.about-lead{margin:0 0 36px;font-family:var(--serif);font-size:clamp(34px,4.1vw,65px);line-height:1.04;letter-spacing:-.042em}
.about-body{margin:0 0 68px;max-width:53rem;font-family:var(--serif);font-size:20px;line-height:1.5;color:var(--light-muted)}
.social-list{border-top:1px solid rgba(243,239,230,.28)}
.social-list a{display:grid;grid-template-columns:.5fr 1fr auto;gap:20px;align-items:center;padding:15px 0;border-bottom:1px solid rgba(243,239,230,.14);font-size:11px}
.social-list span{text-transform:uppercase;letter-spacing:.1em;color:var(--light-muted)}
.social-list b{font-weight:500}
.social-list i{font-style:normal}

footer{min-height:170px;padding:24px var(--pad);display:grid;grid-template-columns:1fr 1fr auto;gap:20px;align-items:end;background:#080808;color:#fff}
footer>span{font-size:10px;text-transform:uppercase;letter-spacing:.11em;color:#8f8f88}
footer>span:first-child{color:#fff}

@media(max-width:950px){
  .topbar{grid-template-columns:1fr auto}.topbar nav{display:none}
  .hero-copy{max-width:90vw}
  .work-intro{grid-template-columns:1fr}
  .work-title{grid-template-columns:1fr}
  .slider-stage{min-height:clamp(500px,88vw,720px)}
  .slide-link--portrait{width:min(56vw,560px)}
  .slide-link--square{width:min(68vw,650px)}
  .art-slide.is-prev{transform:translate3d(-72%,0,0) scale(.8)}
  .art-slide.is-next{transform:translate3d(72%,0,0) scale(.8)}
  .slider-info{grid-template-columns:1fr auto}
  .slider-status{grid-row:2;grid-column:1/-1}
  .slider-actions{grid-column:2}
  .practice-lead{grid-template-columns:1fr}
  .practice-grid{grid-template-columns:1fr 1fr}
  .practice-grid article:nth-child(2){border-right:0}
  .practice-grid article:nth-child(3),.practice-grid article:nth-child(4){border-top:1px solid rgba(243,239,230,.16)}
  .about-grid{grid-template-columns:1fr}
  .about-aside{min-height:auto}
  .about-identity{margin:70px 0 0}
}
@media(max-width:650px){
  .topbar{height:58px}
  .hero-ui{padding-top:82px}
  .hero-meta span:last-child{display:none}
  .hero h1{font-size:clamp(58px,18vw,88px)}
  .hero-intro{margin:24px 0 0;max-width:95%}
  .hero-controls{font-size:9px}
  #new-field{font-size:9px}
  .work{padding-top:76px;padding-bottom:76px}
  .work-title h2,.practice-lead h2{font-size:clamp(52px,15vw,74px)}
  .slider-stage{min-height:118vw;max-height:650px}
  .art-slide{inset:26px 0}
  .slide-link--portrait{width:min(72vw,430px)}
  .slide-link--square{width:min(78vw,470px)}
  .art-slide.is-prev{opacity:.11;filter:blur(4px);transform:translate3d(-82%,0,0) scale(.76)}
  .art-slide.is-next{opacity:.11;filter:blur(4px);transform:translate3d(82%,0,0) scale(.76)}
  .slider-edge{width:10%}
  .slider-hit{width:18%}
  .slider-info{grid-template-columns:1fr;gap:16px;min-height:150px;padding-top:15px}
  .slider-copy{grid-template-columns:1fr}
  .slider-kind{display:none}
  .slider-actions{grid-column:1;justify-content:space-between}
  .slider-actions a{margin-left:auto}
  .slider-status{grid-row:auto;grid-column:1}
  .work-outro a{grid-template-columns:1fr auto;min-height:120px}
  .work-outro span{grid-column:1/-1;align-self:end;padding-top:18px}
  .work-outro strong{align-self:start;padding-bottom:18px}
  .work-outro b{align-self:start}
  .practice-grid{grid-template-columns:1fr}
  .practice-grid article,.practice-grid article+article{min-height:230px;padding:20px 0 30px;border-right:0;border-top:1px solid rgba(243,239,230,.16)}
  .practice-grid span{margin-bottom:48px}
  .interlude blockquote{font-size:clamp(46px,14vw,70px)}
  .social-list a{grid-template-columns:.75fr 1fr auto}
  footer{grid-template-columns:1fr;min-height:220px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.art-slide,.slider-actions button,#new-field span{transition:none}.slider-progress i.is-running{animation:none;transform:scaleX(1)}}


/* v11 motion polish */
.hero{
  --hero-copy-y:0px;
  --hero-copy-opacity:1;
  --flow-scale:1;
  --pointer-x:50%;
  --pointer-y:50%;
}
.hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  opacity:.32;
  background:
    radial-gradient(circle at var(--pointer-x) var(--pointer-y),
      rgba(255,255,255,.085) 0,
      rgba(255,255,255,.03) 8%,
      rgba(255,255,255,0) 24%);
  transition:opacity .25s ease
}
#flow-static{
  transform:scale(var(--flow-scale));
  transform-origin:50% 50%;
  transition:transform .08s linear;
  will-change:transform
}
#flow-motion{will-change:transform}
.hero-copy{
  opacity:var(--hero-copy-opacity);
  transform:translate3d(0,var(--hero-copy-y),0);
  will-change:transform,opacity
}
.hero-line{display:block;overflow:hidden}
body:not(.is-ready) .hero-meta,
body:not(.is-ready) .eyebrow,
body:not(.is-ready) .hero-line,
body:not(.is-ready) .hero-intro,
body:not(.is-ready) .hero-controls{
  opacity:0;
  transform:translate3d(0,24px,0)
}
.hero-meta,.eyebrow,.hero-line,.hero-intro,.hero-controls{
  transition:
    opacity .9s cubic-bezier(.2,.72,.2,1),
    transform 1.05s cubic-bezier(.2,.72,.2,1)
}
body.is-ready .hero-meta{transition-delay:.05s}
body.is-ready .eyebrow{transition-delay:.12s}
body.is-ready .hero-line:nth-child(1){transition-delay:.18s}
body.is-ready .hero-line:nth-child(2){transition-delay:.26s}
body.is-ready .hero-intro{transition-delay:.36s}
body.is-ready .hero-controls{transition-delay:.46s}

/* scroll reveals */
.reveal{
  opacity:0;
  transform:translate3d(0,30px,0);
  transition:
    opacity .8s cubic-bezier(.2,.72,.2,1),
    transform .9s cubic-bezier(.2,.72,.2,1)
}
.reveal.reveal--slow{transform:translate3d(0,44px,0)}
.reveal.is-visible{
  opacity:1;
  transform:translate3d(0,0,0)
}
.practice-grid .reveal:nth-child(1){transition-delay:.04s}
.practice-grid .reveal:nth-child(2){transition-delay:.10s}
.practice-grid .reveal:nth-child(3){transition-delay:.16s}
.practice-grid .reveal:nth-child(4){transition-delay:.22s}

/* richer slider choreography */
.slider-copy{
  transition:opacity .22s ease,transform .22s ease
}
.slider-copy.is-changing{
  opacity:0;
  transform:translate3d(0,8px,0)
}
.art-slide.is-active .slide-link{
  animation:slideBreath 6.8s ease-in-out both
}
@keyframes slideBreath{
  0%{transform:scale(.985)}
  48%{transform:scale(1)}
  100%{transform:scale(.993)}
}
.slider-stage::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:5;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(255,255,255,.14),transparent 14%,transparent 84%,rgba(17,17,15,.035)),
    radial-gradient(circle at 50% 48%,rgba(255,255,255,.20),transparent 42%)
}

/* section atmosphere */
.work-intro,.practice-lead,.interlude blockquote,.about-main{
  position:relative
}
.interlude{
  overflow:hidden;
  position:relative
}
.interlude::after{
  content:"";
  position:absolute;
  width:46vw;
  height:46vw;
  right:-10vw;
  bottom:-28vw;
  border-radius:50%;
  border:1px solid rgba(24,25,18,.18);
  box-shadow:
    0 0 0 6vw rgba(24,25,18,.025),
    0 0 0 12vw rgba(24,25,18,.018);
  pointer-events:none
}

@media(max-width:650px){
  .hero::before{opacity:.22}
  .reveal,.reveal.reveal--slow{transform:translate3d(0,20px,0)}
}

@media(prefers-reduced-motion:reduce){
  body:not(.is-ready) .hero-meta,
  body:not(.is-ready) .eyebrow,
  body:not(.is-ready) .hero-line,
  body:not(.is-ready) .hero-intro,
  body:not(.is-ready) .hero-controls,
  .reveal{
    opacity:1;
    transform:none
  }
  .art-slide.is-active .slide-link{animation:none}
}


/* v12 adaptive hero fog + editorial footer */
.hero{--hero-bg:#10100f}
.hero-fog{
  position:absolute;
  left:0;
  right:0;
  z-index:2;
  pointer-events:none;
  will-change:backdrop-filter;
}
.hero-fog--top{
  top:0;
  height:clamp(118px,15vh,168px);
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb,var(--hero-bg) 88%,transparent) 0%,
      color-mix(in srgb,var(--hero-bg) 56%,transparent) 42%,
      color-mix(in srgb,var(--hero-bg) 14%,transparent) 76%,
      transparent 100%
    );
  -webkit-backdrop-filter:blur(18px) saturate(116%);
  backdrop-filter:blur(18px) saturate(116%);
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 58%,rgba(0,0,0,.55) 76%,transparent 100%);
  mask-image:linear-gradient(180deg,#000 0%,#000 58%,rgba(0,0,0,.55) 76%,transparent 100%)
}
.hero-fog--bottom{
  bottom:0;
  height:clamp(150px,20vh,220px);
  background:
    linear-gradient(
      0deg,
      color-mix(in srgb,var(--hero-bg) 92%,transparent) 0%,
      color-mix(in srgb,var(--hero-bg) 62%,transparent) 40%,
      color-mix(in srgb,var(--hero-bg) 18%,transparent) 76%,
      transparent 100%
    );
  -webkit-backdrop-filter:blur(22px) saturate(118%);
  backdrop-filter:blur(22px) saturate(118%);
  -webkit-mask-image:linear-gradient(0deg,#000 0%,#000 60%,rgba(0,0,0,.5) 78%,transparent 100%);
  mask-image:linear-gradient(0deg,#000 0%,#000 60%,rgba(0,0,0,.5) 78%,transparent 100%)
}
.hero-ui{z-index:3}
.hero-meta,
.hero-controls{
  position:relative;
  z-index:4;
  text-shadow:0 1px 16px color-mix(in srgb,var(--hero-bg) 64%,transparent)
}
.hero-controls{
  border-top-color:color-mix(in srgb,var(--hero-fg) 30%,transparent)
}

/* footer */
.site-footer{
  display:block;
  min-height:0;
  padding:0;
  background:
    radial-gradient(circle at 12% 0%,rgba(255,255,255,.045),transparent 30%),
    #080908;
  color:var(--light);
  border-top:1px solid rgba(243,239,230,.14)
}
.site-footer__main{
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(150px,.48fr) minmax(190px,.62fr);
  gap:clamp(48px,8vw,140px);
  padding-top:clamp(70px,8vw,120px);
  padding-bottom:clamp(64px,7vw,104px)
}
.site-footer__label{
  display:block;
  margin-bottom:22px;
  font-size:9px;
  line-height:1;
  text-transform:uppercase;
  letter-spacing:.16em;
  color:#817f77
}
.site-footer__brand h3{
  margin:0;
  max-width:780px;
  font-size:clamp(46px,5.9vw,92px);
  line-height:.88;
  letter-spacing:-.064em;
  font-weight:620
}
.site-footer__brand h3 em{
  font-family:var(--serif);
  font-weight:400
}
.site-footer__brand p{
  margin:30px 0 0;
  max-width:42rem;
  font-family:var(--serif);
  font-size:clamp(17px,1.4vw,22px);
  line-height:1.42;
  color:#9c9990
}
.site-footer__nav,
.site-footer__social{
  display:flex;
  flex-direction:column;
  align-self:start
}
.site-footer__nav a{
  position:relative;
  padding:11px 0;
  border-bottom:1px solid rgba(243,239,230,.10);
  font-size:11px;
  color:#d9d5ca;
  transition:color .2s ease,padding-left .25s cubic-bezier(.2,.72,.2,1)
}
.site-footer__nav a:first-of-type{border-top:1px solid rgba(243,239,230,.10)}
.site-footer__nav a:hover{
  color:#fff;
  padding-left:6px
}
.site-footer__social a{
  display:grid;
  grid-template-columns:1fr auto;
  gap:16px;
  align-items:center;
  padding:11px 0;
  border-bottom:1px solid rgba(243,239,230,.10);
  font-size:11px;
  color:#d9d5ca;
  transition:color .2s ease
}
.site-footer__social a:first-of-type{border-top:1px solid rgba(243,239,230,.10)}
.site-footer__social a i{
  font-style:normal;
  color:#77756e;
  transition:transform .22s ease,color .22s ease
}
.site-footer__social a:hover{color:#fff}
.site-footer__social a:hover i{
  color:#fff;
  transform:translate3d(2px,-2px,0)
}
.site-footer__bottom{
  min-height:72px;
  padding-top:20px;
  padding-bottom:20px;
  border-top:1px solid rgba(243,239,230,.10);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px
}
.site-footer__bottom>span{
  font-size:9px;
  line-height:1.4;
  text-transform:uppercase;
  letter-spacing:.13em;
  color:#6f6e68
}

@media(max-width:900px){
  .site-footer__main{
    grid-template-columns:1fr 1fr;
    gap:60px 36px
  }
  .site-footer__brand{grid-column:1/-1}
}
@media(max-width:650px){
  .hero-fog--top{
    height:126px;
    -webkit-backdrop-filter:blur(14px) saturate(112%);
    backdrop-filter:blur(14px) saturate(112%)
  }
  .hero-fog--bottom{
    height:164px;
    -webkit-backdrop-filter:blur(18px) saturate(114%);
    backdrop-filter:blur(18px) saturate(114%)
  }
  .site-footer__main{
    grid-template-columns:1fr;
    gap:48px;
    padding-top:70px;
    padding-bottom:58px
  }
  .site-footer__brand{grid-column:auto}
  .site-footer__brand h3{font-size:clamp(46px,14vw,70px)}
  .site-footer__brand p{margin-top:24px}
  .site-footer__bottom{
    min-height:88px;
    align-items:flex-start;
    flex-direction:column;
    justify-content:center;
    gap:8px
  }
}
@media(prefers-reduced-motion:reduce){
  .site-footer__nav a,
  .site-footer__social a i{transition:none}
}


/* v13 artwork metadata glass overlay */
.slide-overlay{
  position:absolute;
  inset:0;
  z-index:8;
  pointer-events:none;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:clamp(18px,2.1vw,32px);
  transition:opacity .28s ease,transform .4s cubic-bezier(.2,.72,.2,1)
}
.slide-overlay.is-changing{
  opacity:0;
  transform:translate3d(0,8px,0)
}
.slide-overlay__top{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px
}
.slide-chip{
  min-height:30px;
  display:inline-flex;
  align-items:center;
  padding:0 12px;
  border:1px solid rgba(255,255,255,.20);
  border-radius:999px;
  background:rgba(12,12,11,.24);
  -webkit-backdrop-filter:blur(16px) saturate(118%);
  backdrop-filter:blur(16px) saturate(118%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 6px 22px rgba(0,0,0,.08);
  color:rgba(255,255,255,.95);
  text-shadow:0 1px 12px rgba(0,0,0,.24);
  font-size:9px;
  line-height:1;
  text-transform:uppercase;
  letter-spacing:.13em
}
.slide-chip--muted{
  background:rgba(12,12,11,.13);
  color:rgba(255,255,255,.72)
}
.slide-overlay__bottom{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:24px
}
.slide-overlay__copy{
  position:relative;
  overflow:hidden;
  width:min(520px,54vw);
  padding:18px 20px 17px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:18px;
  background:linear-gradient(135deg,rgba(13,13,12,.34),rgba(13,13,12,.17));
  -webkit-backdrop-filter:blur(20px) saturate(120%);
  backdrop-filter:blur(20px) saturate(120%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 16px 42px rgba(0,0,0,.10)
}
.slide-overlay__copy::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 12% 0%,rgba(255,255,255,.12),transparent 36%),
    linear-gradient(180deg,rgba(255,255,255,.035),transparent 52%)
}
.slide-overlay__copy>*{position:relative;z-index:1}
.slide-overlay__eyebrow{
  display:block;
  margin-bottom:10px;
  color:rgba(255,255,255,.58);
  font-size:8px;
  line-height:1;
  text-transform:uppercase;
  letter-spacing:.15em
}
.slide-overlay__copy strong{
  display:block;
  margin:0;
  color:#fff;
  font-family:var(--serif);
  font-size:clamp(24px,2.15vw,34px);
  line-height:.95;
  letter-spacing:-.032em;
  font-weight:400;
  text-shadow:0 1px 18px rgba(0,0,0,.20)
}
.slide-overlay__copy p{
  margin:10px 0 0;
  max-width:42ch;
  color:rgba(255,255,255,.70);
  font-size:11px;
  line-height:1.48;
  letter-spacing:.005em
}
.slide-overlay__index{
  min-height:38px;
  display:inline-flex;
  align-items:center;
  padding:0 13px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  background:rgba(12,12,11,.20);
  -webkit-backdrop-filter:blur(14px) saturate(115%);
  backdrop-filter:blur(14px) saturate(115%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.07);
  color:rgba(255,255,255,.86);
  font-size:9px;
  line-height:1;
  text-transform:uppercase;
  letter-spacing:.13em
}

/* keep artwork visually dominant */
.art-slide.is-active .slide-link::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(0,0,0,.06),transparent 22%,transparent 62%,rgba(0,0,0,.12));
  opacity:.58
}
.slide-link{position:relative}

@media(max-width:800px){
  .slide-overlay{padding:16px}
  .slide-overlay__copy{
    width:min(480px,68vw);
    padding:15px 16px 14px;
    border-radius:15px
  }
  .slide-overlay__copy p{font-size:10px}
}
@media(max-width:650px){
  .slide-overlay{
    padding:12px;
    justify-content:flex-end
  }
  .slide-overlay__top{
    position:absolute;
    top:12px;
    left:12px;
    right:12px
  }
  .slide-chip{
    min-height:26px;
    padding:0 9px;
    font-size:8px
  }
  .slide-overlay__bottom{
    width:100%;
    gap:10px;
    align-items:flex-end
  }
  .slide-overlay__copy{
    width:min(100%,360px);
    padding:13px 14px 12px;
    border-radius:14px
  }
  .slide-overlay__copy strong{font-size:22px}
  .slide-overlay__copy p{
    margin-top:7px;
    font-size:10px;
    line-height:1.4
  }
  .slide-overlay__index{
    min-height:32px;
    padding:0 10px;
    font-size:8px
  }
}
@media(prefers-reduced-motion:reduce){
  .slide-overlay{transition:none}
}


/* v14 immersive gallery / mobile full-stage */
.slider-system,
.slider-caption{display:none}

@media(min-width:651px){
  .slider-stage{
    height:min(78svh,860px);
    min-height:620px
  }
}

@media(max-width:650px){
  .work{
    padding-top:62px;
    padding-bottom:72px
  }
  .work-intro{
    margin-bottom:46px
  }
  .work-title{
    gap:22px
  }
  .work-title p{
    max-width:32rem;
    font-size:18px;
    line-height:1.32
  }

  /* let the artwork stage use the whole viewport width */
  .art-slider.section-shell{
    width:100%;
    max-width:none;
    padding-left:0;
    padding-right:0
  }

  .slider-stage{
    height:78svh;
    min-height:560px;
    max-height:760px;
    border-top:1px solid rgba(17,17,15,.72);
    border-bottom:1px solid rgba(17,17,15,.16);
    background:
      radial-gradient(circle at 50% 44%,rgba(255,255,255,.82),rgba(255,255,255,0) 50%),
      #ece8de
  }

  .slider-viewport{
    inset:0
  }

  .art-slide{
    inset:50px 0 18px;
    padding:0 var(--pad)
  }

  .slide-link{
    height:auto;
    max-height:none;
    width:auto;
    filter:drop-shadow(0 16px 34px rgba(17,17,15,.07))
  }

  .slide-link--portrait{
    width:min(92vw,calc((78svh - 92px) * .835));
    max-width:620px;
    aspect-ratio:359/430
  }

  .slide-link--square{
    width:min(92vw,calc(78svh - 92px));
    max-width:680px;
    aspect-ratio:1/1
  }

  .slide-link img{
    width:100%;
    height:100%;
    object-fit:contain
  }

  .art-slide.is-prev{
    opacity:.065;
    filter:blur(5px);
    transform:translate3d(-94%,0,0) scale(.72)
  }

  .art-slide.is-next{
    opacity:.065;
    filter:blur(5px);
    transform:translate3d(94%,0,0) scale(.72)
  }

  .slider-edge{
    width:7%
  }

  .slider-hit{
    width:15%
  }

  /* keep only the tiny metadata chips over the stage */
  .slide-overlay{
    padding:12px var(--pad);
    justify-content:flex-start
  }

  .slide-overlay__top{
    position:static;
    max-width:100%;
    gap:7px
  }

  .slide-chip{
    min-height:27px;
    padding:0 10px;
    font-size:8px;
    background:rgba(16,16,15,.22);
    -webkit-backdrop-filter:blur(14px) saturate(116%);
    backdrop-filter:blur(14px) saturate(116%)
  }

  .slide-overlay__bottom{
    display:none
  }

  /* all readable metadata lives below the artwork */
  .slider-info{
    grid-template-columns:1fr;
    gap:15px;
    min-height:0;
    padding:18px var(--pad) 0
  }

  .slider-copy{
    display:grid;
    grid-template-columns:1fr auto;
    gap:7px 14px;
    align-items:end
  }

  .slider-series{
    grid-column:1;
    grid-row:1;
    margin:0;
    font-size:8px
  }

  .slider-system{
    display:block;
    grid-column:2;
    grid-row:1;
    justify-self:end;
    color:var(--muted);
    font-size:8px;
    text-transform:uppercase;
    letter-spacing:.11em
  }

  .slider-title{
    grid-column:1/-1;
    grid-row:2;
    font-size:clamp(30px,9vw,42px);
    line-height:.96
  }

  .slider-kind{
    display:none
  }

  .slider-caption{
    display:block;
    grid-column:1/-1;
    grid-row:3;
    margin:2px 0 0;
    max-width:40rem;
    color:var(--muted);
    font-family:var(--serif);
    font-size:14px;
    line-height:1.42
  }

  .slider-status{
    grid-row:auto;
    grid-column:1;
    gap:11px;
    margin-top:2px
  }

  .slider-actions{
    grid-column:1;
    display:grid;
    grid-template-columns:36px 36px 1fr;
    gap:9px;
    justify-content:stretch;
    align-items:center
  }

  .slider-actions button{
    width:36px;
    height:36px
  }

  .slider-actions a{
    justify-self:end;
    margin-left:0;
    white-space:nowrap
  }

  .work-outro{
    margin-top:88px
  }
}

@media(max-width:390px){
  .slider-stage{
    height:76svh;
    min-height:525px
  }

  .art-slide{
    inset:48px 0 16px
  }

  .slide-link--portrait{
    width:min(92vw,calc((76svh - 86px) * .835))
  }

  .slide-link--square{
    width:min(92vw,calc(76svh - 86px))
  }
}


/* v15 gallery atmosphere / hero-like artwork stage */
.slider-stage{
  --slider-x:50%;
  --slider-y:50%;
}
.slider-stage::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:3;
  pointer-events:none;
  opacity:.92;
  background:
    radial-gradient(circle at var(--slider-x) var(--slider-y),
      rgba(255,255,255,.18) 0%,
      rgba(255,255,255,.075) 10%,
      rgba(255,255,255,0) 29%),
    radial-gradient(circle at 50% 46%,
      rgba(255,255,255,.16) 0%,
      rgba(255,255,255,.06) 26%,
      rgba(255,255,255,0) 54%);
  transition:opacity .24s ease
}
.slider-stage::after{
  background:
    linear-gradient(180deg,rgba(255,255,255,.14),transparent 14%,transparent 77%,rgba(17,17,15,.10)),
    radial-gradient(circle at 50% 50%,rgba(255,255,255,.11),transparent 46%)
}
.slide-link{isolation:isolate}
.art-slide.is-active .slide-link{
  filter:drop-shadow(0 18px 40px rgba(17,17,15,.10))
}
.art-slide.is-active .slide-link::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(255,255,255,.05),transparent 18%,transparent 70%,rgba(0,0,0,.08)),
    radial-gradient(circle at 50% 0%,rgba(255,255,255,.09),transparent 28%)
}
.art-slide.is-active .slide-link::after{
  content:"";
  position:absolute;
  inset:-1px;
  z-index:2;
  pointer-events:none;
  border:1px solid rgba(255,255,255,.24);
  opacity:.34;
  mix-blend-mode:screen
}
.slide-overlay__copy{
  width:min(560px,58vw)
}
.slide-overlay__meta{
  display:block;
  margin-top:8px;
  font-size:9px;
  line-height:1.2;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:rgba(255,255,255,.62)
}
.slide-overlay__copy,
.slide-overlay__index,
.slide-chip{
  transition:
    opacity .28s ease,
    transform .36s cubic-bezier(.2,.72,.2,1)
}
.slide-overlay.is-changing .slide-overlay__copy,
.slide-overlay.is-changing .slide-overlay__index,
.slide-overlay.is-changing .slide-chip{
  opacity:0;
  transform:translate3d(0,8px,0)
}

@media(max-width:650px){
  .slider-stage::before{
    opacity:.72;
    background:
      radial-gradient(circle at var(--slider-x) var(--slider-y),
        rgba(255,255,255,.14) 0%,
        rgba(255,255,255,.05) 12%,
        rgba(255,255,255,0) 30%),
      radial-gradient(circle at 50% 38%,rgba(255,255,255,.14),transparent 46%)
  }

  /* restore a compact on-art overlay without covering the composition */
  .slide-overlay{
    padding:12px var(--pad);
    justify-content:space-between
  }
  .slide-overlay__top{
    position:static;
    gap:7px
  }
  .slide-overlay__bottom{
    display:flex;
    width:100%;
    align-items:flex-end;
    justify-content:space-between;
    gap:10px
  }
  .slide-overlay__copy{
    width:min(100%,320px);
    padding:12px 14px 11px;
    border-radius:15px;
    background:linear-gradient(135deg,rgba(14,14,13,.28),rgba(14,14,13,.14));
    -webkit-backdrop-filter:blur(18px) saturate(118%);
    backdrop-filter:blur(18px) saturate(118%)
  }
  .slide-overlay__eyebrow{
    display:none
  }
  .slide-overlay__copy strong{
    font-size:22px
  }
  .slide-overlay__meta{
    margin-top:6px;
    font-size:8px
  }
  .slide-overlay__copy p{
    display:none
  }
  .slide-overlay__index{
    min-height:32px;
    padding:0 10px;
    font-size:8px
  }

  /* reduce duplicated metadata below the artwork */
  .slider-copy{
    grid-template-columns:1fr auto;
    gap:6px 12px
  }
  .slider-title{
    font-size:clamp(26px,7.5vw,36px)
  }
  .slider-caption{
    display:none
  }
}
@media(prefers-reduced-motion:reduce){
  .slider-stage::before{transition:none}
}


/* v15.1 mobile gallery tightening */
@media(max-width:650px){
  .slide-overlay__copy{
    width:min(72vw,270px);
    padding:10px 12px 10px
  }
  .slide-overlay__copy strong{
    font-size:20px
  }
  .slider-copy{
    display:none
  }
  .slider-info{
    gap:12px;
    padding-top:14px
  }
}


/* v16 gallery matte-glass pass — no glow */
.slider-stage{
  --gallery-glass:rgba(18,18,17,.34);
  --gallery-glass-strong:rgba(18,18,17,.46);
  --gallery-glass-border:rgba(255,255,255,.16);
}

/* remove the v15 reactive light halo */
.slider-stage::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:3;
  pointer-events:none;
  opacity:1;
  background:
    linear-gradient(180deg,
      rgba(236,232,222,.16) 0%,
      rgba(236,232,222,.07) 8%,
      transparent 18%,
      transparent 78%,
      rgba(18,18,17,.05) 90%,
      rgba(18,18,17,.10) 100%);
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
  transition:none
}
.slider-stage::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:4;
  pointer-events:none;
  background:none
}

/* artwork itself stays optically neutral */
.art-slide.is-active .slide-link{
  filter:drop-shadow(0 14px 34px rgba(17,17,15,.08))
}
.art-slide.is-active .slide-link::before,
.art-slide.is-active .slide-link::after{
  content:none
}

/* frosted matte metadata */
.slide-chip{
  background:var(--gallery-glass);
  border-color:var(--gallery-glass-border);
  -webkit-backdrop-filter:blur(16px) saturate(72%) contrast(92%);
  backdrop-filter:blur(16px) saturate(72%) contrast(92%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 8px 20px rgba(0,0,0,.08)
}
.slide-chip--muted{
  background:rgba(18,18,17,.26);
  color:rgba(255,255,255,.70)
}
.slide-overlay__copy{
  background:var(--gallery-glass-strong);
  border-color:var(--gallery-glass-border);
  -webkit-backdrop-filter:blur(22px) saturate(70%) contrast(92%);
  backdrop-filter:blur(22px) saturate(70%) contrast(92%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    0 14px 34px rgba(0,0,0,.10)
}
.slide-overlay__copy::before{
  content:none
}
.slide-overlay__index{
  background:var(--gallery-glass);
  border-color:var(--gallery-glass-border);
  -webkit-backdrop-filter:blur(16px) saturate(70%) contrast(92%);
  backdrop-filter:blur(16px) saturate(70%) contrast(92%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055)
}

/* side fades become matte rather than luminous */
.slider-edge--left{
  background:linear-gradient(90deg,
    rgba(241,238,230,.96) 0%,
    rgba(241,238,230,.70) 34%,
    rgba(241,238,230,0) 100%)
}
.slider-edge--right{
  background:linear-gradient(270deg,
    rgba(241,238,230,.96) 0%,
    rgba(241,238,230,.70) 34%,
    rgba(241,238,230,0) 100%)
}

@media(max-width:650px){
  .slider-stage::before{
    background:
      linear-gradient(180deg,
        rgba(236,232,222,.12) 0%,
        transparent 14%,
        transparent 82%,
        rgba(18,18,17,.07) 100%)
  }
  .slide-overlay__copy{
    background:rgba(18,18,17,.42);
    -webkit-backdrop-filter:blur(18px) saturate(68%) contrast(92%);
    backdrop-filter:blur(18px) saturate(68%) contrast(92%)
  }
  .slide-chip{
    background:rgba(18,18,17,.34);
    -webkit-backdrop-filter:blur(14px) saturate(68%) contrast(92%);
    backdrop-filter:blur(14px) saturate(68%) contrast(92%)
  }
  .slide-overlay__index{
    background:rgba(18,18,17,.34)
  }
}


/* v17 responsive magazine-cover gallery */
@media(max-width:650px){
  .slider-stage{
    height:auto;
    min-height:0;
    max-height:none;
    background:#e9e5dc;
    border-top:1px solid rgba(17,17,15,.72);
    border-bottom:1px solid rgba(17,17,15,.14);
    transition:height .5s cubic-bezier(.2,.72,.2,1)
  }

  .slider-stage.is-square{
    height:100vw
  }

  .slider-stage.is-portrait{
    height:133.333vw
  }

  .slider-viewport{
    inset:0
  }

  .art-slide{
    inset:0;
    padding:0
  }

  .slide-link,
  .slide-link--square,
  .slide-link--portrait{
    width:100%;
    height:100%;
    max-width:none;
    max-height:none;
    aspect-ratio:auto;
    filter:none
  }

  .slide-link img{
    width:100%;
    height:100%;
    object-fit:contain
  }

  /* no ghost panels or cream gutters around the active cover */
  .art-slide.is-prev,
  .art-slide.is-next{
    opacity:0;
    filter:none;
    transform:translate3d(0,0,0) scale(1)
  }

  .slider-edge,
  .slider-hit{
    display:none
  }

  /* metadata sits on the artwork itself, like magazine cover furniture */
  .slide-overlay{
    inset:0;
    padding:14px var(--pad);
    justify-content:space-between
  }

  .slide-overlay__top{
    position:static
  }

  .slide-overlay__bottom{
    display:flex;
    width:100%;
    align-items:flex-end;
    justify-content:space-between;
    gap:10px
  }

  .slide-overlay__copy{
    width:min(74vw,286px);
    padding:10px 12px 10px;
    border-radius:14px
  }

  .slide-overlay__copy strong{
    font-size:20px
  }

  .slide-overlay__meta{
    font-size:8px
  }

  .slide-overlay__index{
    flex:0 0 auto
  }

  /* only controls stay below; duplicate text remains hidden */
  .slider-info{
    padding:14px var(--pad) 0;
    gap:12px
  }

  .slider-copy{
    display:none
  }

  .slider-status{
    margin-top:0
  }

  .slider-actions{
    margin-top:2px
  }
}

@media(max-width:390px){
  .slider-stage.is-square{
    height:100vw
  }

  .slider-stage.is-portrait{
    height:133.333vw
  }

  .slide-overlay{
    padding:12px var(--pad)
  }

  .slide-overlay__copy{
    width:min(76vw,260px)
  }
}


/* v18 — site architecture, rhythm, navigation, systems, notes */
:root{
  --section-y:clamp(92px,10vw,158px);
  --section-y-tight:clamp(72px,8vw,118px);
  --section-gap:clamp(48px,6vw,92px);
}

/* Header states */
.topbar{
  transition:
    background .32s ease,
    color .32s ease,
    border-color .32s ease,
    backdrop-filter .32s ease;
  border-bottom:1px solid transparent;
}
.topbar.is-solid{
  mix-blend-mode:normal;
  -webkit-backdrop-filter:blur(18px) saturate(120%);
  backdrop-filter:blur(18px) saturate(120%);
}
.topbar.is-solid[data-surface="light"]{
  color:var(--ink);
  background:rgba(241,238,230,.78);
  border-bottom-color:rgba(17,17,15,.09);
}
.topbar.is-solid[data-surface="dark"]{
  color:var(--light);
  background:rgba(10,10,9,.72);
  border-bottom-color:rgba(243,239,230,.10);
}
.menu-toggle{
  display:none;
  position:relative;
  width:34px;
  height:34px;
  border:0;
  padding:0;
  background:transparent;
  cursor:pointer;
  pointer-events:auto;
}
.menu-toggle span{
  position:absolute;
  left:7px;
  right:7px;
  height:1px;
  background:currentColor;
  transition:transform .3s cubic-bezier(.2,.72,.2,1),top .3s ease;
}
.menu-toggle span:first-child{top:13px}
.menu-toggle span:last-child{top:20px}
body.menu-open .menu-toggle span:first-child{top:16px;transform:rotate(45deg)}
body.menu-open .menu-toggle span:last-child{top:16px;transform:rotate(-45deg)}
.mobile-menu{
  position:fixed;
  inset:0;
  z-index:55;
  visibility:hidden;
  opacity:0;
  pointer-events:none;
  background:rgba(10,10,9,.92);
  -webkit-backdrop-filter:blur(24px) saturate(110%);
  backdrop-filter:blur(24px) saturate(110%);
  color:var(--light);
  transition:opacity .35s ease,visibility .35s ease;
}
body.menu-open{overflow:hidden}
body.menu-open .mobile-menu{visibility:visible;opacity:1;pointer-events:auto}
.mobile-menu__inner{
  min-height:100svh;
  display:grid;
  grid-template-rows:auto 1fr auto;
  padding:100px var(--pad) 28px;
}
.mobile-menu__label{
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.15em;
  color:#817f77;
}
.mobile-menu nav{
  align-self:center;
  display:flex;
  flex-direction:column;
}
.mobile-menu nav a{
  font-family:var(--serif);
  font-size:clamp(42px,12vw,70px);
  line-height:1.03;
  letter-spacing:-.04em;
  padding:6px 0;
}
.mobile-menu__foot{
  border-top:1px solid rgba(243,239,230,.12);
  padding-top:16px;
  display:flex;
  justify-content:space-between;
  gap:20px;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.11em;
  color:#9c9990;
}

/* Section rhythm */
.work{padding:var(--section-y) 0}
.work-intro{margin-bottom:clamp(58px,8vw,112px)}
.work-outro{margin-top:clamp(82px,9vw,138px)}
.practice{padding:var(--section-y) 0}
.practice-lead{margin-top:clamp(44px,6vw,86px)}
.practice-grid{margin-top:clamp(64px,8vw,118px)}
.about{padding:var(--section-y) 0}

.section-kicker{
  display:grid;
  grid-template-columns:.32fr 1fr;
  gap:30px;
  align-items:start;
  margin-bottom:clamp(48px,6vw,86px);
}
.section-kicker>p{
  margin:0;
  max-width:44rem;
  font-family:var(--serif);
  font-size:clamp(17px,1.4vw,22px);
  line-height:1.4;
}
.section-kicker .section-index{padding-top:4px}

/* Systems */
.systems{
  position:relative;
  overflow:hidden;
  background:#0d0e0c;
  color:var(--light);
  padding:var(--section-y) 0;
}
.systems::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(120deg,rgba(255,255,255,.026),transparent 24%,transparent 76%,rgba(255,255,255,.018)),
    repeating-linear-gradient(90deg,transparent 0,transparent calc(25% - 1px),rgba(255,255,255,.035) 25%);
}
.systems .section-shell{position:relative}
.systems .section-index{color:var(--light-muted)}
.systems .section-kicker>p{color:var(--light-muted)}
.systems-head{
  display:grid;
  grid-template-columns:1fr auto;
  gap:30px;
  align-items:end;
  margin-bottom:clamp(54px,7vw,104px);
}
.systems-head h2,
.notes-head h2{
  margin:0;
  font-size:clamp(58px,7.4vw,118px);
  line-height:.85;
  letter-spacing:-.067em;
  font-weight:640;
}
.systems-head h2 em,
.notes-head h2 em{font-family:var(--serif);font-weight:400}
.systems-head>a{
  padding-bottom:5px;
  border-bottom:1px solid rgba(243,239,230,.52);
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:var(--light-muted);
}
.systems-grid{
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:clamp(16px,2vw,30px);
}
.system-card{
  position:relative;
  overflow:hidden;
  min-height:clamp(430px,38vw,620px);
  padding:22px;
  border:1px solid rgba(243,239,230,.14);
  display:grid;
  grid-template-rows:auto 1fr auto;
  background:#131411;
  transition:transform .45s cubic-bezier(.2,.72,.2,1),border-color .3s ease;
}
.system-card::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.65;
  background:
    linear-gradient(135deg,rgba(255,255,255,.045),transparent 38%),
    repeating-linear-gradient(0deg,transparent 0,transparent 27px,rgba(255,255,255,.025) 28px);
}
.system-card--geny{
  background:#bfc66f;
  color:#171812;
  border-color:rgba(23,24,18,.18);
}
.system-card--geny::before{
  background:
    linear-gradient(135deg,rgba(255,255,255,.10),transparent 38%),
    repeating-linear-gradient(90deg,transparent 0,transparent 31px,rgba(23,24,18,.035) 32px);
}
.system-card:hover{transform:translateY(-5px);border-color:rgba(243,239,230,.32)}
.system-card--geny:hover{border-color:rgba(23,24,18,.38)}
.system-card>*{position:relative;z-index:1}
.system-card__meta,
.system-card__foot{
  display:flex;
  justify-content:space-between;
  gap:20px;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:var(--light-muted);
}
.system-card--geny .system-card__meta,
.system-card--geny .system-card__foot{color:rgba(23,24,18,.58)}
.system-card__body{align-self:end;padding:40px 0}
.system-card__body h3{
  margin:0 0 18px;
  font-size:clamp(48px,5.6vw,90px);
  line-height:.86;
  letter-spacing:-.06em;
  font-weight:650;
}
.system-card__body p{
  margin:0;
  max-width:40rem;
  font-family:var(--serif);
  font-size:clamp(18px,1.55vw,25px);
  line-height:1.36;
  color:var(--light-muted);
}
.system-card--geny .system-card__body p{color:rgba(23,24,18,.68)}
.system-card__foot{
  border-top:1px solid rgba(243,239,230,.12);
  padding-top:14px;
}
.system-card--geny .system-card__foot{border-color:rgba(23,24,18,.14)}
.system-card__foot b{font-weight:500}

/* Notes */
.notes{
  background:#d6d8bd;
  color:#161712;
  padding:var(--section-y) 0;
}
.notes .section-index{color:rgba(22,23,18,.56)}
.notes .section-kicker>p{color:rgba(22,23,18,.62)}
.notes-head{margin-bottom:clamp(58px,7vw,102px)}
.notes-list{border-top:1px solid rgba(22,23,18,.48)}
.note-row{
  display:grid;
  grid-template-columns:70px 1fr auto;
  gap:clamp(20px,4vw,64px);
  align-items:start;
  padding:clamp(26px,3vw,44px) 0;
  border-bottom:1px solid rgba(22,23,18,.25);
  transition:padding-left .3s cubic-bezier(.2,.72,.2,1),background .3s ease;
}
.note-row:hover{padding-left:10px}
.note-row__index{
  padding-top:5px;
  font-size:9px;
  letter-spacing:.12em;
  color:rgba(22,23,18,.50);
}
.note-row__type{
  display:block;
  margin-bottom:9px;
  font-size:8px;
  text-transform:uppercase;
  letter-spacing:.15em;
  color:rgba(22,23,18,.52);
}
.note-row h3{
  margin:0;
  font-family:var(--serif);
  font-size:clamp(30px,3.8vw,60px);
  line-height:.98;
  letter-spacing:-.04em;
  font-weight:400;
}
.note-row p{
  margin:14px 0 0;
  max-width:58rem;
  font-family:var(--serif);
  font-size:clamp(16px,1.4vw,21px);
  line-height:1.42;
  color:rgba(22,23,18,.64);
}
.note-row__arrow{
  font-size:20px;
  transition:transform .22s ease;
}
.note-row:hover .note-row__arrow{transform:translate(3px,-3px)}

/* Long-form / project pages */
.subpage{
  min-height:100vh;
  background:var(--paper);
  color:var(--ink);
}
.page-topbar{
  height:66px;
  position:fixed;
  inset:0 0 auto;
  z-index:20;
  padding:0 var(--pad);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  color:var(--ink);
  background:rgba(241,238,230,.84);
  border-bottom:1px solid rgba(17,17,15,.08);
  -webkit-backdrop-filter:blur(18px) saturate(118%);
  backdrop-filter:blur(18px) saturate(118%);
}
.page-topbar .brand{color:inherit}
.page-topbar nav{display:flex;gap:24px;font-size:10px}
.page-hero{
  padding:clamp(140px,17vw,240px) var(--pad) clamp(72px,9vw,130px);
  border-bottom:1px solid var(--ink);
}
.page-hero__inner{
  width:min(100%,1320px);
  margin:0 auto;
}
.page-hero__meta{
  display:flex;
  justify-content:space-between;
  gap:20px;
  margin-bottom:clamp(42px,6vw,82px);
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.13em;
  color:var(--muted);
}
.page-hero h1{
  margin:0;
  max-width:1120px;
  font-size:clamp(62px,9vw,142px);
  line-height:.83;
  letter-spacing:-.072em;
  font-weight:640;
}
.page-hero h1 em{font-family:var(--serif);font-weight:400}
.page-hero__dek{
  margin:clamp(28px,4vw,52px) 0 0 auto;
  max-width:720px;
  font-family:var(--serif);
  font-size:clamp(21px,2vw,31px);
  line-height:1.28;
  color:var(--muted);
}
.article-body{
  width:min(100%,1320px);
  margin:0 auto;
  padding:clamp(70px,9vw,130px) var(--pad) clamp(100px,12vw,180px);
  display:grid;
  grid-template-columns:minmax(160px,.42fr) minmax(0,1fr);
  gap:clamp(38px,8vw,130px);
}
.article-aside{
  position:sticky;
  top:100px;
  align-self:start;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:var(--muted);
}
.article-aside a{display:block;margin-top:14px}
.article-content{max-width:820px}
.article-content h2{
  margin:0 0 28px;
  padding-top:72px;
  font-size:clamp(36px,4.7vw,68px);
  line-height:.95;
  letter-spacing:-.045em;
  font-weight:620;
}
.article-content h2:first-child{padding-top:0}
.article-content h3{
  margin:46px 0 18px;
  font-size:24px;
  letter-spacing:-.02em;
}
.article-content p,
.article-content li{
  font-family:var(--serif);
  font-size:clamp(18px,1.55vw,22px);
  line-height:1.62;
}
.article-content p{margin:0 0 24px}
.article-content ul{padding-left:1.2em;margin:0 0 30px}
.article-callout{
  margin:46px 0;
  padding:26px 0 26px 24px;
  border-left:2px solid var(--ink);
  font-family:var(--serif);
  font-size:clamp(24px,2.5vw,36px);
  line-height:1.25;
}
.formula-block{
  margin:36px 0;
  padding:24px;
  border:1px solid var(--rule);
  overflow:auto;
  background:var(--paper-2);
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:13px;
  line-height:1.7;
}
.project-facts{
  margin:40px 0 56px;
  border-top:1px solid var(--ink);
}
.project-fact{
  display:grid;
  grid-template-columns:.35fr 1fr;
  gap:24px;
  padding:15px 0;
  border-bottom:1px solid var(--rule);
}
.project-fact span:first-child{
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.12em;
  color:var(--muted);
}
.project-fact span:last-child{font-family:var(--serif);font-size:18px}
.page-next{
  background:#0d0e0c;
  color:var(--light);
  padding:clamp(64px,8vw,110px) var(--pad);
}
.page-next a{
  width:min(100%,1320px);
  margin:0 auto;
  display:grid;
  grid-template-columns:1fr auto;
  gap:24px;
  align-items:end;
}
.page-next span{font-size:9px;text-transform:uppercase;letter-spacing:.13em;color:var(--light-muted)}
.page-next strong{
  grid-column:1;
  font-family:var(--serif);
  font-size:clamp(34px,5vw,72px);
  font-weight:400;
  letter-spacing:-.045em;
}
.page-next b{font-size:28px;font-weight:400}

/* reveal additions */
.system-card,
.note-row{will-change:transform,opacity}

@media(max-width:950px){
  .topbar{grid-template-columns:1fr auto auto;gap:8px}
  .desktop-nav{display:none!important}
  .menu-toggle{display:block}
  .section-kicker{grid-template-columns:1fr;gap:18px}
  .systems-head{grid-template-columns:1fr}
  .systems-head>a{justify-self:start}
  .systems-grid{grid-template-columns:1fr}
  .system-card{min-height:440px}
  .article-body{grid-template-columns:1fr}
  .article-aside{position:static;display:flex;flex-wrap:wrap;gap:8px 18px}
  .article-aside a{margin-top:0}
}
@media(max-width:650px){
  :root{--section-y:78px;--section-y-tight:62px}
  .topbar{grid-template-columns:1fr auto}
  .topbar .external{display:none}
  .mobile-menu__foot{flex-direction:column}
  .work-intro{margin-bottom:42px}
  .systems-head h2,.notes-head h2{font-size:clamp(50px,14.5vw,72px)}
  .systems-head{margin-bottom:42px}
  .system-card{min-height:390px;padding:18px}
  .system-card__body{padding:34px 0}
  .system-card__body h3{font-size:clamp(48px,14vw,68px)}
  .notes-head{margin-bottom:42px}
  .note-row{grid-template-columns:36px 1fr auto;gap:12px;padding:24px 0}
  .note-row:hover{padding-left:0}
  .note-row h3{font-size:clamp(30px,9vw,42px)}
  .page-topbar nav{display:none}
  .page-hero{padding-top:120px}
  .page-hero__meta{flex-direction:column;gap:8px}
  .page-hero h1{font-size:clamp(58px,17vw,88px)}
  .article-body{padding-top:62px}
  .article-content h2{padding-top:56px}
  .project-fact{grid-template-columns:1fr;gap:7px}
}
@media(prefers-reduced-motion:reduce){
  .system-card,.note-row,.mobile-menu,.menu-toggle span{transition:none}
}


/* v19 final polish */
section[id]{scroll-margin-top:66px}
body.menu-open .topbar{
  color:var(--light)!important;
  background:transparent!important;
  border-bottom-color:transparent!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  mix-blend-mode:normal!important;
}
.mobile-menu__inner{
  padding-top:max(100px,calc(78px + env(safe-area-inset-top)));
  padding-bottom:max(28px,calc(18px + env(safe-area-inset-bottom)));
}
.formula-block{white-space:pre-wrap}
@media(max-width:650px){
  .page-topbar{
    padding-top:env(safe-area-inset-top);
    height:calc(60px + env(safe-area-inset-top));
  }
}


/* v20 — upcoming collection teaser + branded social SVGs */
.work-intro{margin-bottom:clamp(38px,5vw,68px)}

.collection-tease{
  margin-bottom:clamp(58px,7vw,96px);
}
.collection-tease__panel{
  position:relative;
  overflow:hidden;
  min-height:clamp(260px,26vw,390px);
  padding:clamp(20px,2.8vw,40px);
  display:grid;
  grid-template-columns:.7fr 1.8fr .5fr;
  gap:clamp(22px,4vw,70px);
  align-items:stretch;
  color:var(--light);
  background:#10110f;
  border:1px solid rgba(17,17,15,.08);
}
.collection-tease__panel::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(135deg,rgba(255,255,255,.035),transparent 30%,transparent 72%,rgba(255,255,255,.018)),
    repeating-linear-gradient(90deg,transparent 0,transparent calc(20% - 1px),rgba(255,255,255,.025) 20%);
}
.collection-tease__panel::after{
  content:"";
  position:absolute;
  left:-20%;
  top:0;
  width:22%;
  height:100%;
  pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.035),transparent);
  filter:blur(10px);
  animation:teaseScan 8s ease-in-out infinite;
}
@keyframes teaseScan{
  0%,14%{transform:translateX(0);opacity:0}
  28%{opacity:.65}
  72%{opacity:.4}
  86%,100%{transform:translateX(560%);opacity:0}
}
.collection-tease__signal{
  position:relative;
  z-index:1;
  align-self:start;
  display:flex;
  align-items:center;
  gap:10px;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.14em;
  color:var(--light-muted);
}
.collection-tease__signal>span{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#bfc66f;
  box-shadow:0 0 0 4px rgba(191,198,111,.08);
  animation:teasePulse 2.8s ease-in-out infinite;
}
@keyframes teasePulse{
  0%,100%{opacity:.45;transform:scale(.86)}
  50%{opacity:1;transform:scale(1)}
}
.collection-tease__signal b{font-weight:500}
.collection-tease__copy{
  position:relative;
  z-index:1;
  align-self:center;
}
.collection-tease__label{
  display:block;
  margin-bottom:16px;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.15em;
  color:#817f77;
}
.collection-tease__copy h3{
  margin:0;
  max-width:840px;
  font-size:clamp(48px,6vw,94px);
  line-height:.87;
  letter-spacing:-.062em;
  font-weight:640;
}
.collection-tease__copy h3 em{
  font-family:var(--serif);
  font-weight:400;
}
.collection-tease__copy p{
  margin:24px 0 0;
  font-family:var(--serif);
  font-size:clamp(16px,1.3vw,20px);
  color:#8f8d85;
}
.collection-tease__mark{
  position:relative;
  z-index:1;
  display:grid;
  place-items:end;
  align-self:end;
  color:#5f5f59;
  font-family:var(--serif);
  font-size:clamp(38px,5vw,76px);
  letter-spacing:.12em;
  filter:blur(2.5px);
  user-select:none;
}

/* social brand glyphs use local SVGs as masks so they inherit site color */
.social-icon{
  width:20px;
  height:20px;
  display:block;
  flex:0 0 auto;
  background:currentColor;
  -webkit-mask-image:var(--icon);
  mask-image:var(--icon);
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-position:center;
  mask-position:center;
  -webkit-mask-size:contain;
  mask-size:contain;
  color:var(--light-muted);
  transition:color .22s ease,transform .22s cubic-bezier(.2,.72,.2,1);
}
.social-list--icons{
  border-top:1px solid rgba(243,239,230,.28);
}
.social-list--icons a{
  grid-template-columns:28px minmax(86px,.45fr) 1fr auto;
  gap:16px;
  min-height:58px;
}
.social-list--icons .social-name{
  text-transform:uppercase;
  letter-spacing:.1em;
  color:var(--light-muted);
}
.social-list--icons a:hover .social-icon{
  color:var(--light);
  transform:scale(1.08);
}
.social-list--icons a:hover .social-name{color:var(--light)}
.social-icon--footer{
  width:16px;
  height:16px;
  color:#77756e;
}
.site-footer__social a{
  grid-template-columns:18px 1fr auto;
  gap:12px;
}
.site-footer__social a:hover .social-icon--footer{
  color:#fff;
  transform:scale(1.08);
}

@media(max-width:650px){
  .collection-tease{margin-bottom:48px}
  .collection-tease__panel{
    min-height:280px;
    grid-template-columns:1fr auto;
    grid-template-rows:auto 1fr;
    gap:24px 18px;
    padding:20px;
  }
  .collection-tease__signal{grid-column:1}
  .collection-tease__copy{
    grid-column:1/-1;
    align-self:end;
  }
  .collection-tease__copy h3{
    font-size:clamp(46px,13.5vw,66px);
  }
  .collection-tease__copy p{margin-top:18px}
  .collection-tease__mark{
    grid-column:2;
    grid-row:1;
    align-self:start;
    font-size:42px;
  }
  .social-list--icons a{
    grid-template-columns:24px 1fr auto;
    gap:13px;
  }
  .social-list--icons b{display:none}
  .social-icon{width:18px;height:18px}
}

@media(prefers-reduced-motion:reduce){
  .collection-tease__panel::after,
  .collection-tease__signal>span{animation:none}
}


/* v21 — stable iOS fixed header */
.topbar{
  position:fixed!important;
  top:0!important;
  right:0!important;
  bottom:auto!important;
  left:0!important;
  inset:auto!important;
  width:100%;
  height:66px;
  z-index:100;
  isolation:isolate;
  mix-blend-mode:normal!important;
  background:transparent!important;
  border-bottom:0!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  -webkit-transform:translate3d(0,0,0);
  transform:translate3d(0,0,0);
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
  will-change:transform;
  transition:color .24s ease;
}

.topbar::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  opacity:0;
  pointer-events:none;
  background:transparent;
  border-bottom:1px solid transparent;
  -webkit-backdrop-filter:blur(18px) saturate(118%);
  backdrop-filter:blur(18px) saturate(118%);
  transition:opacity .24s ease,background .24s ease,border-color .24s ease;
}

.topbar.is-solid::before{opacity:1}

.topbar.is-solid[data-surface="light"]{
  color:var(--ink)!important;
}
.topbar.is-solid[data-surface="light"]::before{
  background:rgba(241,238,230,.82);
  border-bottom-color:rgba(17,17,15,.09);
}

.topbar.is-solid[data-surface="dark"]{
  color:var(--light)!important;
}
.topbar.is-solid[data-surface="dark"]::before{
  background:rgba(10,10,9,.78);
  border-bottom-color:rgba(243,239,230,.10);
}

body.menu-open .topbar::before{
  opacity:0!important;
  background:transparent!important;
  border-bottom-color:transparent!important;
}

@media(max-width:950px){
  .topbar{
    height:60px;
    min-height:60px;
    max-height:60px;
    grid-template-columns:1fr auto;
    align-items:center;
    padding-top:0;
    padding-bottom:0;
  }
  .topbar .brand,
  .topbar .menu-toggle{
    align-self:center;
  }
}

@supports (padding-top:max(0px)){
  @media(max-width:950px) and (display-mode:standalone){
    .topbar{
      height:calc(60px + env(safe-area-inset-top));
      min-height:calc(60px + env(safe-area-inset-top));
      max-height:calc(60px + env(safe-area-inset-top));
      padding-top:env(safe-area-inset-top);
    }
  }
}


/* v22 — Telegram/iOS WebView-safe mobile header */
@media(max-width:950px){
  .topbar{
    position:-webkit-sticky!important;
    position:sticky!important;
    top:0!important;
    right:auto!important;
    bottom:auto!important;
    left:auto!important;
    inset:auto!important;
    width:100%;
    height:60px!important;
    min-height:60px!important;
    max-height:60px!important;
    margin:0 0 -60px 0;
    padding:0 var(--pad)!important;
    -webkit-transform:none!important;
    transform:none!important;
    will-change:auto!important;
    -webkit-backface-visibility:visible!important;
    backface-visibility:visible!important;
    contain:none!important;
  }

  .topbar::before{
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    filter:none!important;
  }

  .topbar.is-solid[data-surface="light"]::before{
    background:rgba(241,238,230,.94)!important;
  }

  .topbar.is-solid[data-surface="dark"]::before{
    background:rgba(10,10,9,.94)!important;
  }

  body.menu-open .topbar{
    position:fixed!important;
    top:0!important;
    left:0!important;
    right:0!important;
    width:100%;
    margin:0;
  }
}

/* iOS/WKWebView: avoid all compositing on the sticky bar */
@supports (-webkit-touch-callout:none){
  @media(max-width:950px){
    .topbar,
    .topbar::before{
      -webkit-backdrop-filter:none!important;
      backdrop-filter:none!important;
      -webkit-transform:none!important;
      transform:none!important;
      perspective:none!important;
    }
  }
}