/* Shared bleib gate — ABOUT / RECORDS / JOURNEY */
:root{
  --bleib-beige:#e3ded3;
  --bleib-beige-deep:#dcd6cb;
}
.eb-bleib-shell{
  position:relative;
  display:grid;
  grid-template-areas:"bleib-main";
  align-items:stretch;
  min-height:calc(100svh - var(--nav-height,64px));
  overflow:hidden;
}
.eb-bleib-stage{
  grid-area:bleib-main;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(48px,1fr) minmax(0,8fr) minmax(48px,1fr);
  align-items:center;
  gap:clamp(8px,2vw,24px);
  min-height:calc(100svh - var(--nav-height,64px));
  padding:clamp(88px,12vh,120px) clamp(12px,2vw,28px) clamp(32px,5vh,48px);
  box-sizing:border-box;
  transition:opacity .5s cubic-bezier(.22,1,.32,1),visibility .5s,transform .65s cubic-bezier(.22,1,.32,1);
}
.eb-bleib.is-bleib-open .eb-bleib-stage{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:scale(.97) translateY(-16px);
}
.eb-bleib-index{
  color:#171923;
  font:400 clamp(2.5rem,8vw,5.5rem)/.92 var(--display);
  letter-spacing:var(--section-title-tracking,-.045em);
  text-align:center;
  user-select:none;
}
.eb-bleib-board{
  position:relative;
  appearance:none;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:min(62vh,560px);
  margin:0;
  padding:clamp(32px,5vh,48px) clamp(20px,3vw,32px) clamp(56px,7vh,72px);
  border:0;
  border-radius:2px;
  background:var(--bleib-beige);
  color:#171923;
  cursor:pointer;
  text-align:center;
  transition:transform .45s cubic-bezier(.22,1,.32,1),box-shadow .45s ease;
}
.eb-bleib-board:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 40px rgba(23,25,35,.08);
  filter:brightness(1.025);
}
.eb-bleib-board:focus-visible{
  outline:2px solid #171923;
  outline-offset:4px;
}
.eb-bleib-board:active{
  transform:translateY(1px) scale(.995);
  box-shadow:0 5px 14px rgba(23,25,35,.12);
  filter:brightness(.97);
  transition-duration:80ms;
}
.eb-bleib-eyebrow{
  margin:0 0 clamp(10px,1.6vh,16px);
  color:#55565b;
  font:500 11px/1 var(--mono);
  letter-spacing:.22em;
  text-transform:uppercase;
}
.eb-bleib-title{
  margin:0;
  font:400 clamp(3.2rem,12vw,7.5rem)/.92 var(--display);
  letter-spacing:var(--section-title-tracking,-.045em);
  text-wrap:balance;
}
.eb-bleib-hint{
  margin:clamp(18px,3vh,28px) 0 0;
  max-width:22em;
  color:#55565b;
  font:500 12px/1.45 var(--mono);
  letter-spacing:.12em;
  text-transform:uppercase;
}
.eb-bleib-bars{
  position:absolute;
  left:clamp(18px,3vw,28px);
  right:clamp(18px,3vw,28px);
  bottom:clamp(18px,3vh,24px);
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(10px,2vw,18px);
  pointer-events:none;
}
.eb-bleib-bars i{
  display:block;
  height:clamp(10px,1.2vh,14px);
  background:#111;
  border-radius:1px;
}
.eb-bleib-panel{
  grid-area:bleib-main;
  z-index:1;
  display:flex;
  flex-direction:column;
  min-height:0;
  max-height:calc(100svh - var(--nav-height,64px));
  overflow-x:hidden;
  overflow-y:hidden;
  overscroll-behavior:auto;
  padding:0;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(12px);
  transition:opacity .55s cubic-bezier(.22,1,.32,1) .08s,visibility .55s .08s,transform .7s cubic-bezier(.22,1,.32,1) .06s,padding .55s cubic-bezier(.22,1,.32,1);
}
.eb-bleib.is-bleib-open .eb-bleib-panel{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:none;
  padding:clamp(56px,8vh,72px) 0 clamp(32px,6vh,56px);
}
.eb-bleib-back{
  position:sticky;
  top:0;
  z-index:6;
  flex:none;
  display:flex;
  align-items:center;
  gap:8px;
  width:fit-content;
  margin:0 auto clamp(12px,2vh,18px);
  padding:10px 18px;
  border:1px solid #b8b0a4;
  border-radius:999px;
  background:#fff;
  color:#171923;
  font:500 12px/1 var(--mono);
  letter-spacing:.12em;
  text-transform:uppercase;
  cursor:pointer;
  box-shadow:0 8px 24px rgba(23,25,35,.06);
}
.eb-bleib-back[hidden]{display:none!important}
#original.story-keep-bleib .eb-bleib-back{
  background:#14120f;
  border-color:#f6f2e866;
  color:#f6f2e8;
}
.eb-bleib-back:hover{transform:translateY(-1px)}
.eb-bleib-back:focus-visible{outline:2px solid var(--cobalt);outline-offset:3px}

#portfolio.portfolio-bleib{
  position:relative;
  min-height:calc(100svh - var(--nav-height,64px));
  padding:0;
  background:#121214;
  overflow:visible;
}
#portfolio.portfolio-bleib .eb-bleib-stage{
  background:#121214;
}
#portfolio.portfolio-bleib .eb-bleib-index{color:var(--bleib-beige,#e3ded3)}
#portfolio.portfolio-bleib .eb-bleib-board{
  background:var(--bleib-beige,#e3ded3);
  color:#171923;
}
#portfolio.portfolio-bleib .eb-bleib-panel{
  background:#121214;
}
#portfolio.portfolio-bleib.is-bleib-open .eb-bleib-panel{
  height:calc(100svh - var(--nav-height,64px));
  min-height:0;
  max-height:calc(100svh - var(--nav-height,64px));
  box-sizing:border-box;
  overflow:hidden;
  padding-top:clamp(48px,7vh,64px);
}
#portfolio.portfolio-bleib.is-bleib-open #portfolio-mount{
  flex:1 1 auto;
  min-height:0;
  height:0;
  overflow:hidden;
}
#portfolio.portfolio-bleib.is-bleib-open .portfolio-sample-note{
  position:sticky;
  bottom:0;
}

#original.story-keep-bleib{
  min-height:calc(100svh - var(--nav-height,64px));
  height:auto;
  padding:0;
  overflow:visible;
}
#original.story-keep-bleib .eb-bleib-stage{
  background:var(--bleib-beige,#e3ded3);
  background-image:none;
}
#original.story-keep-bleib .eb-bleib-index{color:#171923}
#original.story-keep-bleib .eb-bleib-board{
  background:#171512;
  color:var(--bleib-beige,#e3ded3);
}
#original.story-keep-bleib .eb-bleib-title{color:var(--bleib-beige,#e3ded3)}
#original.story-keep-bleib .eb-bleib-eyebrow{color:rgba(227,222,211,.7)}
#original.story-keep-bleib .eb-bleib-hint{color:rgba(227,222,211,.62)}
#original.story-keep-bleib .eb-bleib-bars i{background:var(--bleib-beige,#e3ded3)}
#original.story-keep-bleib .eb-bleib-panel{
  background:#121214;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15'%3E%3Crect x='6.5' y='6.5' width='2' height='2' rx='1' ry='1' fill='rgb(255%2C255%2C255)' fill-opacity='0.08'/%3E%3C/svg%3E");
  background-size:15px 15px;
}
#original.story-keep-bleib.is-bleib-open .eb-bleib-panel{
  padding-top:clamp(48px,7vh,64px);
  padding-bottom:0;
}
#original.story-keep-bleib.is-bleib-open .story-keep__pin{
  min-height:calc(100svh - var(--nav-height,64px) - 80px);
}
#original.story-keep-bleib:not(.is-bleib-open) .story-keep__pin{
  visibility:hidden;
  height:0;
  overflow:hidden;
}

#contact.contact-bleib{
  position:relative;
  min-height:calc(100svh - var(--nav-height,64px));
  padding:0;
  background:#121214;
  overflow:visible;
}
#contact.contact-bleib .eb-bleib-stage{
  background:#121214;
}
#contact.contact-bleib .eb-bleib-index{color:var(--bleib-beige,#e3ded3)}
#contact.contact-bleib .eb-bleib-board{
  background:var(--bleib-beige,#e3ded3);
  color:#171923;
}
#contact.contact-bleib .eb-bleib-panel{
  background:#121214;
}
#contact.contact-bleib.is-bleib-open .eb-bleib-panel{
  padding-top:clamp(48px,7vh,64px);
  max-height:none;
  overflow:visible;
  overscroll-behavior:auto;
}
#contact.contact-bleib.is-bleib-open .eb-bleib-shell{overflow:visible}
#contact.contact-bleib.is-bleib-open #contact-mount{
  flex:1 1 auto;
  min-height:calc(100svh - var(--nav-height,64px) - 120px);
  height:auto;
}
#contact.contact-bleib:not(.is-bleib-open) #contact-mount{
  height:0;
  min-height:0;
  overflow:hidden;
  visibility:hidden;
}
#contact.contact-bleib:not(.is-bleib-open) .contact-site-footer{
  display:none;
}
#contact.contact-bleib.is-bleib-open .contact-site-footer{
  display:flex;
  position:relative;
  bottom:auto;
}

@media(max-width:900px){
  .eb-bleib-stage{
    grid-template-columns:minmax(36px,.6fr) minmax(0,1fr) minmax(36px,.6fr);
    padding-top:clamp(80px,14vh,108px);
  }
}
@media(max-width:760px){
  /* Give the closed chapter card a real mobile column instead of squeezing
     it between the decorative desktop index numbers. */
  .eb-bleib-stage{
    position:relative;
    display:grid;
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:minmax(0,1fr);
    gap:0;
    padding:clamp(72px,11vh,104px) 16px clamp(28px,5vh,44px);
  }
  .eb-bleib-index{display:none}
  .eb-bleib-stage::before{
    content:"2026";
    position:absolute;
    top:clamp(34px,5vh,52px);
    right:18px;
    z-index:3;
    color:#55565b;
    font:500 10px/1 var(--mono);
    letter-spacing:.2em;
  }
  .eb-bleib-board{
    width:100%;
    min-height:min(58vh,520px);
    padding:clamp(34px,7vh,58px) 22px clamp(62px,9vh,82px);
  }
  .eb-bleib-title{font-size:clamp(3rem,15vw,4.5rem);line-height:.92}
  .eb-bleib-hint{max-width:18em;margin-top:22px;font-size:11px;line-height:1.55}
}
@media(prefers-reduced-motion:reduce){
  .eb-bleib.is-bleib-open .eb-bleib-stage{transform:none}
  .eb-bleib.is-bleib-open .eb-bleib-panel{transform:none}
  .eb-bleib:not(.is-bleib-open) .eb-bleib-panel{display:none}
}

/* Contact intro: restore the two chapter numbers as card-corner markers on
   phones; the shared mobile card remains wide and centered. */
@media(max-width:768px){
  #portfolio.portfolio-bleib .eb-bleib-stage::before,
  #original.story-keep-bleib .eb-bleib-stage::before,
  #contact.contact-bleib .eb-bleib-stage::before{content:none}
  #portfolio.portfolio-bleib .eb-bleib-index,
  #original.story-keep-bleib .eb-bleib-index,
  #contact.contact-bleib .eb-bleib-index{
    display:block;
    position:absolute;
    top:24px;
    z-index:4;
    color:#55565b;
    font:400 clamp(26px,8vw,32px)/1 var(--display);
    letter-spacing:-.04em;
  }
  #portfolio.portfolio-bleib .eb-bleib-index--prev,
  #original.story-keep-bleib .eb-bleib-index--prev,
  #contact.contact-bleib .eb-bleib-index--prev{left:20px}
  #portfolio.portfolio-bleib .eb-bleib-index--next,
  #original.story-keep-bleib .eb-bleib-index--next,
  #contact.contact-bleib .eb-bleib-index--next{right:20px}
  #contact.contact-bleib .eb-bleib-board{
    min-height:430px;
    max-width:420px;
    margin-inline:auto;
    box-sizing:border-box;
  }
  #contact.contact-bleib .eb-bleib-eyebrow{
    margin-bottom:22px;
    font-size:10px;
    letter-spacing:.18em;
  }
  #contact.contact-bleib .eb-bleib-title{
    max-width:100%;
    font-size:clamp(40px,13vw,58px);
    line-height:.92;
    letter-spacing:-.04em;
    white-space:nowrap;
  }
  #contact.contact-bleib .eb-bleib-hint{
    margin-top:24px;
    max-width:100%;
    font-size:10px;
    line-height:1.5;
    letter-spacing:.14em;
  }
  #contact.contact-bleib .eb-bleib-bars{
    left:50%;
    right:auto;
    bottom:28px;
    display:flex;
    width:auto;
    transform:translateX(-50%);
    gap:8px;
  }
  #contact.contact-bleib .eb-bleib-bars i{width:52px;height:4px}
}

@media(max-width:768px){
  #portfolio.portfolio-bleib,
  #portfolio.portfolio-bleib .eb-bleib-stage,
  #portfolio.portfolio-bleib .eb-bleib-panel,
  #contact.contact-bleib,
  #contact.contact-bleib .eb-bleib-stage,
  #contact.contact-bleib .eb-bleib-panel{
    background:#121214!important;
  }
  #portfolio.portfolio-bleib .eb-bleib-index,
  #contact.contact-bleib .eb-bleib-index{
    color:#e3ded3!important;
  }
  #portfolio.portfolio-bleib .eb-bleib-board,
  #contact.contact-bleib .eb-bleib-board{
    background:#e3ded3!important;
    color:#171512!important;
    width:min(100%,420px);
    min-height:min(52svh,430px);
  }
  #portfolio.portfolio-bleib .eb-bleib-stage::before,
  #contact.contact-bleib .eb-bleib-stage::before{
    color:rgba(227,222,211,.62);
  }
  #original.story-keep-bleib,
  #original.story-keep-bleib .eb-bleib-stage{
    background:#e3ded3!important;
    background-image:none!important;
  }
  #original.story-keep-bleib .eb-bleib-index{color:#171512!important}
  #original.story-keep-bleib .eb-bleib-board{
    background:#171512!important;
    color:#e3ded3!important;
    width:min(100%,420px);
    min-height:min(52svh,430px);
  }
  #original.story-keep-bleib .eb-bleib-stage::before{color:#55565b}
  #contact.contact-bleib.is-bleib-open .ctl-card{
    width:100%;
    max-width:100%;
    margin:0;
  }
  #original.story-keep-bleib.is-bleib-open .eb-bleib-panel{
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
  }
  /* Opened records stays one phone screen. A taller panel let the page
     drift and clipped the gallery inside a short frame. */
  #portfolio.portfolio-bleib.is-bleib-open,
  #portfolio.portfolio-bleib.is-bleib-open .eb-bleib-shell,
  #portfolio.portfolio-bleib.is-bleib-open .eb-bleib-panel{
    height:calc(100svh - var(--nav-height,64px))!important;
    min-height:0!important;
    max-height:calc(100svh - var(--nav-height,64px))!important;
    overflow:hidden!important;
    touch-action:none;
  }
  #portfolio.portfolio-bleib.is-bleib-open #portfolio-mount{
    flex:1 1 auto!important;
    height:auto!important;
    min-height:0!important;
    overflow:hidden!important;
  }
  #portfolio.portfolio-bleib.is-bleib-open .records-soultrace{
    flex:none;
    margin:8px 16px 0;
  }
  #portfolio.portfolio-bleib.is-bleib-open .portfolio-scroll-indicator{
    flex:none;
    margin:8px 16px 10px;
  }
}

#portfolio.portfolio-bleib:not(.is-bleib-open),
#portfolio.portfolio-bleib:not(.is-bleib-open) .eb-bleib-stage,
#portfolio.portfolio-bleib:not(.is-bleib-open) .eb-bleib-panel,
#portfolio.portfolio-bleib:not(.is-bleib-open) .eb-bleib-shell{
  background:#121214!important;
}
#portfolio.portfolio-bleib .eb-bleib-index{color:#e3ded3!important}
#portfolio.portfolio-bleib .eb-bleib-board{
  background:#e3ded3!important;
  color:#171512!important;
}

#original.story-keep-bleib:not(.is-bleib-open),
#original.story-keep-bleib:not(.is-bleib-open)[data-act="1"],
#original.story-keep-bleib:not(.is-bleib-open)[data-act="2"],
#original.story-keep-bleib:not(.is-bleib-open) .eb-bleib-stage,
#original.story-keep-bleib:not(.is-bleib-open) .eb-bleib-shell{
  background:#e4ddd0!important;
  background-image:none!important;
}
#original.story-keep-bleib .eb-bleib-index{color:#171512!important}
#original.story-keep-bleib .eb-bleib-board{
  background:#171512!important;
  color:#e3ded3!important;
}
#original.story-keep-bleib .eb-bleib-title{color:#e3ded3!important}
#original.story-keep-bleib .eb-bleib-eyebrow,
#original.story-keep-bleib .eb-bleib-hint{color:rgba(227,222,211,.68)!important}
#original.story-keep-bleib .eb-bleib-bars i{background:#e3ded3!important}
