.stw-lateral-gallery{
  --stw-ink:#111111;
  --stw-paper:#ffffff;
  --stw-dim:#8a8a8a;
  --stw-orange:#F28D00;
  --stw-yellow:#FFD800;

  position:relative;
  width:100%;
  height:80vh;
  min-height:420px;
  overflow:hidden;
  background:var(--stw-paper);
  font-family:'Mulish', sans-serif;
  color:var(--stw-ink);
  container-type:size;
  container-name:stw-gallery;
  display:flex;
  flex-direction:column;
}

.stw-lateral-gallery *{box-sizing:border-box;}

.stw-lateral-gallery .stw-info-bar{
  flex:0 0 auto;
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:1rem;
  max-height:0;
  opacity:0;
  overflow:hidden;
  padding:0 5%;
  transition:max-height 0.5s ease, opacity 0.4s ease, padding 0.5s ease;
}
.stw-lateral-gallery .stw-info-bar.is-visible{
  max-height:16px;
  opacity:1;
  padding:clamp(4px, 2cqb, 8px) 5%;
}

.stw-lateral-gallery .stw-stage{
  position:relative;
  flex:1 1 auto;
  min-height:0;
  display:flex;
  align-items:center;
  overflow:hidden;
  padding-bottom:20px;
}

.stw-lateral-gallery .stw-track{
  display:flex;
  align-items:center;
  height:100%;
  gap:15px;
  padding:0 8cqi;
  will-change:transform;
}

.stw-lateral-gallery .stw-intro{
  flex-shrink:0;
  width:min(70cqi, 420px);
  padding-right:min(6cqi, 48px);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  align-self:stretch;
  min-height:0;
}
.stw-lateral-gallery .stw-intro .stw-intro-logo{
  height:clamp(194px, 29cqb, 324px) !important;
  width:auto !important;
  max-width:100%;
  flex-shrink:1;
  min-height:0;
  margin-bottom:clamp(1rem, 4cqb, 1.6rem);
  display:block;
  object-fit:contain;
}
.stw-lateral-gallery .stw-intro .stw-eyebrow{
  font-family:'Jost', sans-serif;
  font-size:clamp(0.78rem, 1.55cqb, 0.94rem);
  letter-spacing:0.14em;
  text-transform:uppercase;
  color:var(--stw-orange);
  margin-bottom:clamp(0.6rem, 2cqb, 1rem);
  flex-shrink:0;
}
.stw-lateral-gallery .stw-intro h1{
  font-family:'Jost', sans-serif;
  font-weight:500;
  font-size:clamp(1.9rem, 4.5cqb, 3.05rem);
  line-height:1.15;
  text-transform:lowercase;
  color:var(--stw-ink);
  margin:0;
  flex-shrink:0;
}
.stw-lateral-gallery .stw-intro p{
  margin-top:clamp(0.8rem, 3cqb, 1.4rem);
  max-width:34ch;
  font-size:clamp(0.97rem, 1.9cqb, 1.16rem);
  line-height:1.65;
  color:var(--stw-ink);
  flex-shrink:0;
}

.stw-lateral-gallery .stw-intro .stw-scroll-cue{
  margin-top:clamp(1.4rem, 4cqb, 2.2rem);
  display:flex;
  align-items:center;
  gap:6px;
  color:var(--stw-dim);
  flex-shrink:0;
}
.stw-lateral-gallery .stw-intro .stw-scroll-cue svg{
  width:16px;
  height:16px;
  flex-shrink:0;
  animation:stw-bounce-cue-left 1.6s ease-in-out infinite;
}
.stw-lateral-gallery .stw-intro .stw-scroll-cue span{
  font-family:'Jost', sans-serif;
  font-size:0.72rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
}

@keyframes stw-bounce-cue{
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(5px);}
}

@keyframes stw-bounce-cue-left{
  0%,100%{transform:translateX(0);}
  50%{transform:translateX(-5px);}
}

.stw-lateral-gallery .stw-cta{
  flex-shrink:0;
  width:min(70cqi, 380px);
  padding-left:min(2cqi, 16px);
  padding-bottom:15px;
  display:flex;
  flex-direction:column;
  align-self:stretch;
  min-height:0;
}
.stw-lateral-gallery .stw-cta-main{
  flex:1 1 auto;
  min-height:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.stw-lateral-gallery .stw-cta h2{
  font-family:'Jost', sans-serif;
  font-weight:500;
  font-size:clamp(1.55rem, 3.3cqb, 2.25rem);
  line-height:1.2;
  text-transform:lowercase;
  color:var(--stw-ink);
  margin:0;
  flex-shrink:0;
}
.stw-lateral-gallery .stw-cta p{
  margin-top:clamp(0.6rem, 2.5cqb, 1.1rem);
  max-width:30ch;
  font-size:clamp(0.95rem, 1.75cqb, 1.1rem);
  line-height:1.6;
  color:var(--stw-ink);
  flex-shrink:0;
}
.stw-lateral-gallery .stw-cta a{
  margin-top:clamp(1rem, 3.5cqb, 1.6rem);
  flex-shrink:0;
  display:inline-flex;
  align-items:center;
  width:fit-content;
  font-family:'Jost', sans-serif;
  font-size:clamp(0.85rem, 1.65cqb, 1rem);
  letter-spacing:0.05em;
  text-transform:uppercase;
  text-decoration:none;
  background:var(--stw-yellow);
  color:var(--stw-ink);
  padding:clamp(0.6rem, 2.5cqb, 0.85rem) clamp(1.1rem, 2.4cqb, 1.6rem);
  border-radius:40px;
}
.stw-lateral-gallery .stw-cta a:hover{filter:brightness(0.96);}
.stw-lateral-gallery .stw-cta a:focus-visible{outline:2px solid var(--stw-ink);outline-offset:3px;}

.stw-lateral-gallery .stw-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:3;
  width:clamp(26px, 4cqi, 36px);
  height:clamp(26px, 4cqi, 36px);
  border-radius:50%;
  border:none;
  background:rgba(255,255,255,0.85);
  box-shadow:0 2px 10px rgba(0,0,0,0.12);
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  color:var(--stw-ink);
  opacity:0;
  pointer-events:none;
  transition:opacity 0.25s ease, transform 0.2s ease, background 0.2s ease;
}
.stw-lateral-gallery:hover .stw-nav:not(.is-disabled),
.stw-lateral-gallery .stw-nav:focus-visible{
  opacity:1;
  pointer-events:auto;
}
.stw-lateral-gallery .stw-nav:hover{background:#ffffff;}
.stw-lateral-gallery .stw-nav:active{transform:translateY(-50%) scale(0.94);}
.stw-lateral-gallery .stw-nav svg{width:17px;height:17px;flex-shrink:0;}
.stw-lateral-gallery .stw-nav.is-disabled{opacity:0;pointer-events:none;}
.stw-lateral-gallery .stw-nav-prev{left:clamp(10px, 2.5cqi, 24px);}
.stw-lateral-gallery .stw-nav-next{right:clamp(10px, 2.5cqi, 24px);}

.stw-lateral-gallery .stw-cta .stw-about-link{
  margin-top:clamp(1rem, 3.5cqb, 1.6rem);
  flex-shrink:0;
  display:inline-flex;
  align-items:center;
  gap:8px;
  width:fit-content;
  border:none;
  background:rgba(17,17,17,0.08);
  border-radius:20px;
  cursor:pointer;
  padding:8px 16px 8px 12px;
  text-decoration:none;
  color:#111111;
  transition:background 0.2s ease, color 0.2s ease;
}
.stw-lateral-gallery .stw-cta .stw-about-link svg{
  width:16px;
  height:16px;
  flex-shrink:0;
  animation:stw-bounce-cue 1.6s ease-in-out infinite;
}
.stw-lateral-gallery .stw-cta .stw-about-link span{
  font-family:'Jost', sans-serif;
  font-weight:500;
  font-size:0.88rem;
  letter-spacing:0.06em;
  text-transform:uppercase;
  white-space:nowrap;
}
.stw-lateral-gallery .stw-cta .stw-about-link:hover{background:rgba(17,17,17,0.18);}

.stw-back-up-wrap{
  display:flex;
  justify-content:center;
  padding:14px 0;
}
.stw-back-up{
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:none;
  background:rgba(17,17,17,0.08);
  border-radius:20px;
  cursor:pointer;
  color:#111111;
  padding:8px 16px 8px 12px;
  transition:background 0.2s ease, color 0.2s ease;
}
.stw-back-up svg{width:16px;height:16px;flex-shrink:0;}
.stw-back-up span{
  font-family:'Jost', sans-serif;
  font-weight:500;
  font-size:0.88rem;
  letter-spacing:0.06em;
  text-transform:uppercase;
  white-space:nowrap;
}
.stw-back-up:hover{background:rgba(17,17,17,0.18);}


.stw-lateral-gallery .stw-frame{
  position:relative;
  flex-shrink:0;
  height:100%;
  width:auto;
}

.stw-lateral-gallery .stw-plate{
  position:relative;
  display:block;
  height:100%;
  width:auto;
  overflow:hidden;
  background:#f2f2f2;
}
.stw-lateral-gallery .stw-plate img{
  height:100%;
  width:auto;
  display:block;
}
.stw-lateral-gallery .stw-plate.stw-img-error img{display:none;}
.stw-lateral-gallery .stw-plate.stw-img-error::after{
  content:attr(data-title);
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:1.5rem;
  text-align:center;
  font-family:'Jost', sans-serif;
  font-size:0.8rem;
  letter-spacing:0.04em;
  text-transform:uppercase;
  color:var(--stw-dim);
  background:#f2f2f2;
}

.stw-lateral-gallery .stw-plate::before{
  content:"";
  position:absolute;
  inset:-10px;
  border:1.5px solid var(--stw-ink);
  pointer-events:none;
}

.stw-lateral-gallery .stw-tint-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(0deg, rgba(17,17,17,0.72) 0%, rgba(17,17,17,0.32) 45%, rgba(17,17,17,0.12) 100%);
  pointer-events:none;
}

.stw-lateral-gallery .stw-tint-caption{
  position:absolute;
  left:0; right:0; bottom:0;
  padding:2.6rem 1.2rem 1.2rem;
  display:flex;
  flex-direction:column;
  gap:0.4rem;
  pointer-events:none;
}
.stw-lateral-gallery .stw-tint-title{
  font-family:'Jost', sans-serif;
  font-weight:500;
  font-size:clamp(1.05rem, 2.1cqb, 1.35rem);
  letter-spacing:0.02em;
  text-transform:uppercase;
  color:#ffffff;
  text-shadow:0 1px 4px rgba(0,0,0,0.5);
  margin:0;
}
.stw-lateral-gallery .stw-tint-desc{
  font-family:'Mulish', sans-serif;
  font-size:clamp(0.85rem, 1.65cqb, 1rem);
  line-height:1.5;
  color:rgba(255,255,255,0.85);
  max-width:32ch;
  text-shadow:0 1px 4px rgba(0,0,0,0.5);
}

.stw-lateral-gallery .stw-hover-title{
  position:absolute;
  left:0; right:0; bottom:0;
  padding:2.4rem 1.1rem 1rem;
  background:linear-gradient(0deg, rgba(0,0,0,0.55), transparent);
  opacity:0;
  transform:translateY(6px);
  transition:opacity 0.35s ease, transform 0.35s ease;
  pointer-events:none;
}
.stw-lateral-gallery .stw-plate:hover .stw-hover-title,
.stw-lateral-gallery .stw-plate:focus-visible .stw-hover-title{
  opacity:1;
  transform:translateY(0);
}
.stw-lateral-gallery .stw-hover-title h2{
  font-family:'Jost', sans-serif;
  font-weight:500;
  font-size:clamp(0.95rem, 1.9cqb, 1.18rem);
  letter-spacing:0.02em;
  text-transform:uppercase;
  color:#ffffff;
  margin:0;
}

@container stw-gallery (max-width: 640px){
  .stw-lateral-gallery .stw-intro{width:min(85cqi, 340px);}
  .stw-lateral-gallery .stw-cta{width:min(85cqi, 340px);}
}
