/* ###################################################################### */
/* ######################## BEGIN ACADEMY / LABS ######################### */
/* ###################################################################### */

/* ------------------------------ Shared -------------------------------- */
.page-academy .academy-hero--compact,
.page-labs .academy-hero--compact{
  margin-bottom: 20px;
}

.page-academy .academy-hero__inner,
.page-labs .academy-hero__inner{
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
  gap: 24px;
  align-items: center;
}

.page-academy .academy-kicker,
.page-labs .academy-kicker{
  display: inline-flex;
  align-items: center;
  padding: 8px 12px;
  border-radius: 999px;
  margin-bottom: 14px;
  border: 1px solid rgba(0,255,255,0.12);
  background: rgba(8,16,24,0.64);
  color: rgba(235,248,255,0.88);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.page-academy .academy-hero__panel,
.page-labs .academy-hero__panel{
  position: relative;
  min-height: 170px;
  border-radius: 24px;
  overflow: hidden;
  border: 1px solid rgba(0,255,255,0.10);
  background:
    radial-gradient(circle at 62% 36%, rgba(0,255,255,0.12), transparent 28%),
    linear-gradient(135deg, rgba(8,14,20,0.84), rgba(5,10,16,0.94));
  box-shadow:
    0 24px 54px rgba(0,0,0,0.32),
    inset 0 1px 0 rgba(255,255,255,0.04);
}

.page-academy .academy-hero__glow,
.page-labs .academy-hero__glow{
  position: absolute;
  inset: auto auto 26px 50%;
  width: 180px;
  height: 180px;
  transform: translateX(-50%);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0,255,255,0.14), transparent 70%);
  filter: blur(24px);
  pointer-events: none;
}

.page-academy .academy-hero__grid,
.page-labs .academy-hero__grid{
  position: absolute;
  inset: 0;
  background:
    linear-gradient(rgba(0,255,255,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,255,255,0.04) 1px, transparent 1px);
  background-size: 52px 52px;
  opacity: 0.22;
  pointer-events: none;
}

.page-academy .academy-hero__badge,
.page-labs .academy-hero__badge{
  position: absolute;
  right: 18px;
  bottom: 18px;
  display: inline-flex;
  align-items: center;
  min-height: 40px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid rgba(0,255,255,0.12);
  background: rgba(7,14,22,0.78);
  color: rgba(240,248,255,0.90);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05);
}

.page-academy .academy-shell,
.page-labs .academy-shell{
  position: relative;
}

.page-academy .academy-intro,
.page-labs .academy-intro{
  position: relative;
  z-index: 2;
  margin-bottom: 18px;
}

.page-academy .academy-intro h2,
.page-labs .academy-intro h2{
  margin-bottom: 12px;
}

.page-academy [hidden],
.page-labs [hidden]{
  display: none !important;
}

/* ------------------------- Academy cinematic -------------------------- */
.page-academy{
  position: relative;
  isolation: isolate;
  min-height: 100vh;
}

.page-academy::before{
  content: "";
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(3,7,11,0.76), rgba(3,6,10,0.90)),
    url("../img/academy/academy-bg-cinematic.jpg") center 12% / cover no-repeat;
  filter: blur(2.2px) brightness(0.52) saturate(0.88);
  transform: scale(1.035);
}

.page-academy::after{
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(circle at 58% 18%, rgba(0,255,255,0.08), transparent 20%),
    radial-gradient(circle at 74% 36%, rgba(255,208,136,0.12), transparent 18%),
    linear-gradient(180deg, rgba(0,0,0,0.10), rgba(0,0,0,0.26));
}

.page-academy .academy-hero,
.page-academy .academy-library,
.page-academy .academy-desk,
.page-academy .academy-intro{
  position: relative;
  z-index: 2;
}

/* kill old decorative lamp system completely */
.page-academy .academy-desk__lamp,
.page-academy .academy-desk__lamp-glow,
.page-academy .academy-desk__lightcone,
.page-academy .academy-desk__lamp-base,
.page-academy .academy-desk__lamp-pole,
.page-academy .academy-desk__lamp-arm,
.page-academy .academy-desk__lamp-head{
  display: none !important;
}

/* ----------------------------- Shelf ---------------------------------- */
.page-academy .academy-shelf{
  position: relative;
  overflow: hidden;
  border-radius: 28px;
  padding: 30px 26px 24px;
  border: 1px solid rgba(255,172,96,0.14);
  background:
    linear-gradient(180deg, rgba(152,78,28,0.12), rgba(152,78,28,0.02) 14%, transparent 18%),
    linear-gradient(180deg, rgba(84,40,12,0.98), rgba(28,12,5,1));
  box-shadow:
    0 34px 80px rgba(0,0,0,0.56),
    inset 0 1px 0 rgba(255,255,255,0.05),
    inset 0 -1px 0 rgba(0,0,0,0.58),
    inset 0 18px 30px rgba(255,210,140,0.025),
    0 0 0 1px rgba(255,146,70,0.04);
}

.page-academy .academy-shelf::before{
  content: "";
  position: absolute;
  inset: 14px 14px auto 14px;
  height: 34px;
  border-radius: 16px 16px 10px 10px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0)),
    radial-gradient(circle at 50% 0%, rgba(255,214,140,0.06), transparent 58%);
  opacity: 0.92;
  pointer-events: none;
}

.page-academy .academy-shelf::after{
  content: "";
  position: absolute;
  left: 4%;
  right: 4%;
  bottom: -8px;
  height: 16px;
  border-radius: 50%;
  background: radial-gradient(
    ellipse at center,
    rgba(0,0,0,0.55),
    rgba(0,0,0,0.0)
  );
  filter: blur(6px);
}

.page-academy .academy-shelf__row{
  position: relative;
  display: flex;
  align-items: flex-end;
  gap: 11px;
  min-height: 194px;
  padding: 14px 10px 30px;
}

.page-academy .academy-shelf__row::before{
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: 18px;
  height: 18px;
  border-radius: 14px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.12), rgba(255,255,255,0.024) 24%, rgba(0,0,0,0.44) 100%),
    linear-gradient(90deg, rgba(96,62,36,0.98), rgba(40,24,12,1), rgba(96,62,36,0.98));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    inset 0 -2px 6px rgba(0,0,0,0.34),
    0 10px 18px rgba(0,0,0,0.28);
  pointer-events: none;
}

/* ###### BEGIN BOOK COLORS RESTORE ###### */

.page-academy .academy-spine{
  color: #fff;
  font-weight: 700;
  position: relative;

  background: linear-gradient(180deg, rgba(255,255,255,0.15), rgba(0,0,0,0.4)),
              var(--book-color, #1f2f3a);

  border: 1px solid rgba(255,255,255,0.08);

  box-shadow:
    inset 0 2px 6px rgba(255,255,255,0.15),
    inset 0 -6px 12px rgba(0,0,0,0.5),
    0 10px 20px rgba(0,0,0,0.4);
}

/* einzelne Farben */
.academy-spine:nth-child(1){ --book-color:#1e88e5; }
.academy-spine:nth-child(2){ --book-color:#3949ab; }
.academy-spine:nth-child(3){ --book-color:#00897b; }
.academy-spine:nth-child(4){ --book-color:#6d4c41; }
.academy-spine:nth-child(5){ --book-color:#546e7a; }
.academy-spine:nth-child(6){ --book-color:#5e35b1; }
.academy-spine:nth-child(7){ --book-color:#f4511e; }
.academy-spine:nth-child(8){ --book-color:#2e7d32; }
.academy-spine:nth-child(9){ --book-color:#00897b; }
.academy-spine:nth-child(10){ --book-color:#c62828; }
.academy-spine:nth-child(11){ --book-color:#6a1b9a; }
.academy-spine:nth-child(12){ --book-color:#9e9d24; }

/* ###### END BOOK COLORS RESTORE ###### */

.page-academy .academy-spine--wide{
  width: 54px;
}

.page-academy .academy-spine::before{
  content: "";
  position: absolute;
  left: 6px;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(255,255,255,0.16), rgba(255,255,255,0.03));
  opacity: 0.42;
}

.page-academy .academy-spine::after{
  content: none !important;
}

.page-academy .academy-spine__level{
  position: relative;
  z-index: 2;
  min-width: 26px;
  height: 24px;
  padding: 0 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.18), rgba(255,255,255,0.03)),
    linear-gradient(135deg, rgba(28,38,52,0.96), rgba(14,20,28,0.96));
  border: 1px solid rgba(255,255,255,0.12);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.12),
    0 4px 10px rgba(0,0,0,0.18);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.08em;
  line-height: 1;
}

.page-academy .academy-spine__title{
  position: relative;
  z-index: 2;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.045em;
  line-height: 1.08;
}

.page-academy .academy-spine:hover,
.page-academy .academy-spine:focus-visible{
  transform: translateY(-8px) scale(1.045);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.10),
    inset 0 -3px 10px rgba(0,0,0,0.54),
    0 18px 30px rgba(0,0,0,0.40),
    0 0 18px rgba(255,214,140,0.05);
}

.page-academy .academy-spine.is-selected{
  transform: translateY(-16px) scale(1.06);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.12),
    inset 0 -3px 10px rgba(0,0,0,0.54),
    0 24px 36px rgba(0,0,0,0.44),
    0 0 20px rgba(255,214,140,0.07);
}

.page-academy .academy-spine[data-spine-style="foundation"]{ background: linear-gradient(180deg, rgba(255,255,255,0.12), rgba(255,255,255,0) 16%), linear-gradient(180deg, rgba(19,79,114,0.98), rgba(8,29,42,1)); }
.page-academy .academy-spine[data-spine-style="switching"]{ background: linear-gradient(180deg, rgba(255,255,255,0.12), rgba(255,255,255,0) 16%), linear-gradient(180deg, rgba(48,70,164,0.98), rgba(15,23,62,1)); }
.page-academy .academy-spine[data-spine-style="routing"]{ background: linear-gradient(180deg, rgba(255,255,255,0.12), rgba(255,255,255,0) 16%), linear-gradient(180deg, rgba(27,108,80,0.98), rgba(8,36,29,1)); }
.page-academy .academy-spine[data-spine-style="diagnostics"]{ background: linear-gradient(180deg, rgba(255,255,255,0.12), rgba(255,255,255,0) 16%), linear-gradient(180deg, rgba(146,92,26,0.98), rgba(54,28,7,1)); }
.page-academy .academy-spine[data-spine-style="ipv4"]{ background: linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0) 16%), linear-gradient(180deg, rgba(33,103,128,0.98), rgba(10,39,49,1)); }
.page-academy .academy-spine[data-spine-style="subnetting"]{ background: linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0) 16%), linear-gradient(180deg, rgba(78,34,120,0.98), rgba(22,10,40,1)); }
.page-academy .academy-spine[data-spine-style="vlan"]{ background: linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0) 16%), linear-gradient(180deg, rgba(118,72,18,0.98), rgba(37,20,5,1)); }
.page-academy .academy-spine[data-spine-style="services"]{ background: linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0) 16%), linear-gradient(180deg, rgba(22,104,74,0.98), rgba(8,34,27,1)); }
.page-academy .academy-spine[data-spine-style="routing-paths"]{ background: linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0) 16%), linear-gradient(180deg, rgba(24,86,80,0.98), rgba(8,31,29,1)); }
.page-academy .academy-spine[data-spine-style="firewall"]{ background: linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0) 16%), linear-gradient(180deg, rgba(126,33,48,0.98), rgba(40,8,15,1)); }
.page-academy .academy-spine[data-spine-style="packets"]{ background: linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0) 16%), linear-gradient(180deg, rgba(105,78,28,0.98), rgba(38,24,8,1)); }
.page-academy .academy-spine[data-spine-style="incident"]{ background: linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0) 16%), linear-gradient(180deg, rgba(98,103,28,0.98), rgba(33,36,8,1)); }

/* ------------------------------ Desk ---------------------------------- */
.page-academy .academy-desk{
  position: relative;
  overflow: hidden;
  min-height: 300px;
  border-radius: 28px;
  border: 1px solid rgba(0,255,255,0.10);
  background:
    linear-gradient(180deg, rgba(7,12,18,0.96), rgba(3,6,10,0.99));
  box-shadow:
    0 28px 70px rgba(0,0,0,0.44),
    inset 0 1px 0 rgba(255,255,255,0.03),
    0 0 0 1px rgba(0,255,255,0.02);
}

.page-academy .academy-desk::before{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 36%, rgba(0,255,255,0.05), transparent 34%),
    linear-gradient(90deg, rgba(255,255,255,0.018), transparent 16%, transparent 84%, rgba(255,255,255,0.018));
}

.page-academy .academy-desk::after{
  content: "";
  position: absolute;
  left: 12%;
  right: 12%;
  bottom: -12px;
  height: 28px;
  border-radius: 999px;
  background: radial-gradient(ellipse at center, rgba(0,0,0,0.46), transparent 72%);
  filter: blur(10px);
  pointer-events: none;
}

.page-academy .academy-desk__empty{
  position: relative;
  z-index: 2;
  min-height: 210px;
  display: grid;
  place-items: center;
  text-align: center;
  gap: 10px;
  padding: 24px;
}

.page-academy .academy-desk__empty::before{
  content: "";
  position: absolute;
  inset: 14% 18% 18% 18%;
  pointer-events: none;
  background: radial-gradient(circle at center, rgba(255,220,160,0.05), transparent 56%);
}

.page-academy .academy-desk__empty-icon{
  font-size: 2.2rem;
  filter: drop-shadow(0 10px 18px rgba(0,0,0,0.24));
}

/* ---------------------------- Focus book ------------------------------- */
.page-academy .academy-focus-book{
  position: relative;
  z-index: 3;
  margin-top: 8px;
  transform-style: preserve-3d;
  perspective: 2200px;
}

.page-academy .academy-focus-book::before{
  content: "";
  position: absolute;
  left: 8%;
  right: 8%;
  bottom: -18px;
  height: 28px;
  border-radius: 999px;
  background: radial-gradient(ellipse at center, rgba(0,0,0,0.50), transparent 72%);
  filter: blur(12px);
  pointer-events: none;
  opacity: 0.9;
}

.page-academy .academy-focus-book__cover,
.page-academy .academy-focus-book__reader{
  position: relative;
  overflow: hidden;
  border-radius: 28px;
  background:
    radial-gradient(circle at 16% 18%, rgba(0,255,255,0.08), transparent 26%),
    radial-gradient(circle at 76% 22%, rgba(255,215,140,0.04), transparent 20%),
    linear-gradient(135deg, rgba(11,17,26,0.98), rgba(7,11,18,1));
  box-shadow:
    0 34px 78px rgba(0,0,0,0.50),
    inset 0 1px 0 rgba(255,255,255,0.04),
    0 0 0 1px rgba(255,255,255,0.02);
  transform-style: preserve-3d;
  backface-visibility: hidden;
}

.page-academy .academy-focus-book__cover{
  min-height: 220px;
  padding: 24px 24px 20px 38px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: end;
}

.page-academy .academy-focus-book__cover::before{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(255,255,255,0.03), transparent 14%, transparent 84%, rgba(255,255,255,0.02)),
    radial-gradient(circle at 80% 60%, rgba(255,228,168,0.04), transparent 24%);
}

.page-academy .academy-focus-book__cover-spine{
  position: absolute;
  left: 0;
  top: 14px;
  bottom: 14px;
  width: 10px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(0,255,255,0.34), rgba(0,255,255,0.10));
}

.page-academy .academy-focus-book__eyebrow{
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(0,255,255,0.12);
  background: rgba(8,16,24,0.48);
  color: rgba(236,248,255,0.88);
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.10em;
  text-transform: uppercase;
}

.page-academy .academy-focus-book__cover-content h3{
  margin: 10px 0 10px;
  font-size: clamp(1.9rem, 1.45rem + 0.9vw, 2.8rem);
  line-height: 1.02;
  max-width: 10ch;
}

.page-academy .academy-focus-book__cover-content p{
  max-width: 580px;
  margin-bottom: 14px;
  color: rgba(232,240,246,0.92);
  line-height: 1.58;
}

.page-academy .academy-focus-book__meta{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}

.page-academy .academy-focus-book__tag,
.page-academy .academy-focus-book__status{
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(34,44,54,0.86);
  color: rgba(241,247,252,0.92);
  font-size: 0.74rem;
  font-weight: 800;
}

.page-academy .academy-focus-book__cover-actions{
  display: flex;
  align-items: center;
  gap: 10px;
  align-self: end;
}

.page-academy .academy-focus-book__btn,
.page-academy .academy-reader__nav{
  min-height: 40px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid rgba(0,255,255,0.13);
  background: rgba(8,14,20,0.90);
  color: #f2f8fb;
  font-weight: 800;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.05),
    0 8px 16px rgba(0,0,0,0.18);
  transition:
    transform .22s ease,
    box-shadow .22s ease,
    background .22s ease;
}

.page-academy .academy-focus-book__btn:hover,
.page-academy .academy-reader__nav:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 18px rgba(0,0,0,0.12);
}

.page-academy .academy-focus-book.is-placing{
  animation: academyBookPlace 980ms cubic-bezier(.16,.88,.18,1) both;
}

.page-academy .academy-focus-book.is-putting-away{
  animation: academyBookPutAway 880ms cubic-bezier(.22,.82,.2,1) both;
}

@keyframes academyBookPlace{
  0%{
    opacity: 0;
    transform: translate3d(0,-118px,0) scale(0.74) rotateX(20deg) rotateZ(-8deg);
    filter: blur(2px) saturate(0.92);
  }
  55%{
    opacity: 1;
    transform: translate3d(0,8px,0) scale(1.02) rotateX(5deg) rotateZ(0.8deg);
    filter: blur(0) saturate(1.02);
  }
  100%{
    opacity: 1;
    transform: translate3d(0,0,0) scale(1) rotateX(0deg) rotateZ(0deg);
    filter: blur(0) saturate(1);
  }
}

@keyframes academyBookPutAway{
  0%{
    opacity: 1;
    transform: translate3d(0,0,0) scale(1) rotateX(0deg) rotateZ(0deg);
  }
  100%{
    opacity: 0;
    transform: translate3d(0,-110px,0) scale(0.76) rotateX(16deg) rotateZ(-6deg);
    filter: blur(2px) saturate(0.92);
  }
}

/* ------------------------- Open book / reader ------------------------- */
.page-academy .academy-focus-book__reader{
  min-height: 500px;
  padding: 18px;
}

.page-academy .academy-focus-book__reader.is-opening-reader{
  animation: academyReaderAAAOpen 980ms cubic-bezier(.16,.86,.18,1) both;
}

@keyframes academyReaderAAAOpen{
  0%{
    opacity: 0;
    transform:
      perspective(2200px)
      rotateX(18deg)
      rotateY(-7deg)
      translateY(26px)
      scale(.965);
    filter: blur(2px) brightness(.94);
  }
  42%{
    opacity: 1;
    transform:
      perspective(2200px)
      rotateX(7deg)
      rotateY(-2deg)
      translateY(-4px)
      scale(1.006);
    filter: blur(0) brightness(1);
  }
  100%{
    opacity: 1;
    transform:
      perspective(2200px)
      rotateX(0deg)
      rotateY(0deg)
      translateY(0)
      scale(1);
    filter: blur(0) brightness(1);
  }
}

.page-academy .academy-sheet-stack{
  position: relative;
  min-height: 430px;
  perspective: 4200px;
  transform-style: preserve-3d;
}

.page-academy .academy-sheet{
  position: absolute;
  inset: 0;
  transform-origin: left center;
  transform-style: preserve-3d;
  transition:
    transform 1120ms cubic-bezier(.2,.82,.18,1),
    z-index 0s linear 0s;
  will-change: transform;
}

.page-academy .academy-sheet.is-current-sheet{
  filter: drop-shadow(0 10px 18px rgba(0,0,0,0.10));
}

.page-academy .academy-sheet.is-turned{
  transform: rotateY(-178deg) translateZ(1px);
}

.page-academy .academy-sheet.is-flipping-next-temp{
  animation: academyPageFlipNextAAA 1120ms cubic-bezier(.2,.82,.18,1) both;
  z-index: 160 !important;
}

.page-academy .academy-sheet.is-flipping-prev-temp{
  animation: academyPageFlipPrevAAA 1120ms cubic-bezier(.2,.82,.18,1) both;
  z-index: 160 !important;
}

@keyframes academyPageFlipNextAAA{
  0%{
    transform: rotateY(0deg) translateZ(0);
    filter: brightness(1) drop-shadow(0 6px 10px rgba(0,0,0,0.08));
  }
  18%{
    transform: rotateY(-12deg) translateZ(6px);
    filter: brightness(1.01) drop-shadow(0 10px 16px rgba(0,0,0,0.08));
  }
  40%{
    transform: rotateY(-48deg) translateZ(10px);
    filter: brightness(.99) drop-shadow(0 16px 22px rgba(0,0,0,0.10));
  }
  66%{
    transform: rotateY(-118deg) translateZ(8px);
    filter: brightness(.95) drop-shadow(0 18px 24px rgba(0,0,0,0.12));
  }
  100%{
    transform: rotateY(-178deg) translateZ(1px);
    filter: brightness(.92) drop-shadow(0 8px 14px rgba(0,0,0,0.08));
  }
}

@keyframes academyPageFlipPrevAAA{
  0%{
    transform: rotateY(-178deg) translateZ(1px);
    filter: brightness(.92) drop-shadow(0 8px 14px rgba(0,0,0,0.08));
  }
  28%{
    transform: rotateY(-122deg) translateZ(8px);
    filter: brightness(.95) drop-shadow(0 18px 24px rgba(0,0,0,0.12));
  }
  56%{
    transform: rotateY(-54deg) translateZ(10px);
    filter: brightness(.99) drop-shadow(0 16px 22px rgba(0,0,0,0.10));
  }
  82%{
    transform: rotateY(-14deg) translateZ(6px);
    filter: brightness(1.01) drop-shadow(0 10px 16px rgba(0,0,0,0.08));
  }
  100%{
    transform: rotateY(0deg) translateZ(0);
    filter: brightness(1) drop-shadow(0 6px 10px rgba(0,0,0,0.08));
  }
}

.page-academy .academy-sheet__face{
  position: absolute;
  inset: 0;
  overflow: hidden;
  padding: 22px 26px 78px 34px;
  border-radius: 20px;
  border: 1px solid rgba(186,174,148,0.42);
  background:
    linear-gradient(180deg, rgba(248,244,235,0.998), rgba(235,229,215,0.996));
  color: #243244;
  box-shadow:
    0 24px 56px rgba(0,0,0,0.28),
    inset 0 1px 0 rgba(255,255,255,0.82),
    inset -28px 0 28px rgba(120,108,84,0.05);
  backface-visibility: hidden;
}

.page-academy .academy-sheet__face--back{
  transform: rotateY(180deg);
  background:
    linear-gradient(180deg, rgba(243,238,226,0.998), rgba(232,225,210,0.996));
  box-shadow:
    0 22px 50px rgba(0,0,0,0.26),
    inset 0 1px 0 rgba(255,255,255,0.76),
    inset 24px 0 28px rgba(120,108,84,0.05);
}

.page-academy .academy-sheet__face::before{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.22), rgba(255,255,255,0) 42%),
    repeating-linear-gradient(180deg, rgba(0,0,0,0) 0px, rgba(0,0,0,0) 27px, rgba(0,0,0,0.018) 28px);
  opacity: .62;
}

.page-academy .academy-sheet__face::after{
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 86px;
  height: 86px;
  background:
    linear-gradient(135deg, transparent 48%, rgba(255,255,255,0.58) 49%, rgba(246,240,225,0.92) 64%, rgba(193,177,146,0.22) 76%, rgba(0,0,0,0.18) 100%);
  opacity: .88;
}

.page-academy .academy-sheet__spine{
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 12px;
  background: linear-gradient(180deg, rgba(220,208,182,0.72), rgba(158,146,120,0.18));
}

.page-academy .academy-sheet__paper-edge{
  position: absolute;
  left: 10px;
  top: 0;
  bottom: 0;
  width: 14px;
  background: linear-gradient(180deg, rgba(255,255,255,0.84), rgba(230,224,208,0.72));
  box-shadow:
    inset 1px 0 0 rgba(255,255,255,0.92),
    inset -1px 0 0 rgba(120,108,84,0.12);
}

.page-academy .academy-sheet__eyebrow{
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  background: rgba(210,220,216,0.46);
  color: rgba(70,84,96,0.86);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.10em;
  text-transform: uppercase;
}

.page-academy .academy-sheet h3{
  margin: 16px 0 12px;
  color: #243244;
  font-size: clamp(1.6rem, 1.2rem + 0.7vw, 2rem);
  max-width: 74%;
  line-height: 1.06;
}

.page-academy .academy-sheet p,
.page-academy .academy-sheet__list{
  max-width: 78%;
  color: #344455;
  line-height: 1.68;
}

.page-academy .academy-sheet__list{
  padding-left: 1.2rem;
}

.page-academy .academy-sheet__placeholder{
  min-height: 92px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  border: 1px dashed rgba(164,149,122,0.30);
  background: rgba(255,255,255,0.44);
  color: rgba(53,67,84,0.82);
}

.page-academy .academy-sheet__meta{
  position: absolute;
  left: 34px;
  right: 26px;
  bottom: 22px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.page-academy .academy-sheet__tag,
.page-academy .academy-sheet__pagecount{
  color: #243244;
  font-size: 0.78rem;
  font-weight: 800;
}

.page-academy .academy-reader__controls{
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 16px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
  padding-top: 10px;
}

.page-academy .academy-reader__controls-left,
.page-academy .academy-reader__controls-right{
  display: flex;
  align-items: center;
  gap: 10px;
}

.page-academy .academy-reader__nav--ghost{
  background: rgba(22,30,38,0.75);
}

.page-academy .academy-reader__corner{
  position: relative;
  width: 82px;
  height: 82px;
  border: 0;
  background: transparent;
  padding: 0;
}

.page-academy .academy-reader__corner::before{
  content: "";
  position: absolute;
  right: 2px;
  bottom: 2px;
  width: 72px;
  height: 72px;
  background:
    linear-gradient(135deg, transparent 49%, rgba(255,255,255,0.58) 50%, rgba(246,240,225,0.92) 64%, rgba(193,177,146,0.22) 76%, rgba(0,0,0,0.18) 100%);
  opacity: .88;
}

.page-academy .academy-reader__corner::after{
  content: "";
  position: absolute;
  right: 18px;
  bottom: 22px;
  width: 24px;
  height: 24px;
  border-right: 2px solid rgba(90,104,116,0.72);
  border-bottom: 2px solid rgba(90,104,116,0.72);
  transform: rotate(-45deg);
}

/* ------------------------------ Labs ---------------------------------- */
.page-labs .academy-book{
  transition: transform .22s ease, box-shadow .22s ease;
}

.page-labs .academy-book[data-active="1"]{
  transform: translateY(-6px);
  box-shadow: 0 18px 28px rgba(0,0,0,0.24);
}

/* ----------------------------- Responsive ----------------------------- */
@media (max-width: 980px){
  .page-academy .academy-hero__inner,
  .page-labs .academy-hero__inner{
    grid-template-columns: 1fr;
  }

  .page-academy .academy-shelf__row{
    min-height: 176px;
	align-items: flex-end;
	gap: 10px;
  }

  .page-academy .academy-spine{
    width: 46px;
	min-height: 122px;
  padding: 8px 5px 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  border-radius: 10px 10px 7px 7px;
  overflow: hidden;
  }

  .page-academy .academy-spine--wide{
    width: 54px;
  }

.page-academy .academy-spine--thick{
  width: 66px;
}

  .page-academy .academy-focus-book__cover{
    grid-template-columns: 1fr;
    align-items: start;
  }

  .page-academy .academy-focus-book__cover-content h3,
  .page-academy .academy-sheet h3,
  .page-academy .academy-sheet p,
  .page-academy .academy-sheet__list{
    max-width: 100%;
  }

  .page-academy .academy-reader__controls{
    position: relative;
    left: auto;
    right: auto;
    bottom: auto;
    margin-top: 14px;
    flex-direction: column;
    align-items: stretch;
  }

  .page-academy .academy-reader__controls-left,
  .page-academy .academy-reader__controls-right{
    justify-content: space-between;
  }
}

/* ###################################################################### */
/* ######################### END ACADEMY / LABS ########################## */
/* ###################################################################### */



/* ###################################################################### */
/* ################ BEGIN ACADEMY CODE SPINES + LEGEND ################### */
/* ###################################################################### */

/* selected shelf slot should visually disappear and leave a gap */
.page-academy .academy-spine.is-gap{
  opacity: 0.02 !important;
  pointer-events: none !important;
  transform: translateY(-4px) scale(0.94) !important;
  box-shadow: none !important;
}

/* spine labels reduced to code only */
.page-academy .academy-spine{
  justify-content: flex-start;
}

/* Höhenstaffelung */
.page-academy .academy-spine[data-book-key="chapter-01"]{ min-height: 112px; }
.page-academy .academy-spine[data-book-key="chapter-02"]{ min-height: 146px; }
.page-academy .academy-spine[data-book-key="chapter-03"]{ min-height: 116px; }
.page-academy .academy-spine[data-book-key="chapter-04"]{ min-height: 154px; }

/* Platzhalter 05–12 */
.page-academy .academy-spine--placeholder:nth-of-type(5){ min-height: 118px; }
.page-academy .academy-spine--placeholder:nth-of-type(6){ min-height: 142px; }
.page-academy .academy-spine--placeholder:nth-of-type(7){ min-height: 120px; }
.page-academy .academy-spine--placeholder:nth-of-type(8){ min-height: 124px; }
.page-academy .academy-spine--placeholder:nth-of-type(9){ min-height: 130px; }
.page-academy .academy-spine--placeholder:nth-of-type(10){ min-height: 122px; }
.page-academy .academy-spine--placeholder:nth-of-type(11){ min-height: 126px; }
.page-academy .academy-spine--placeholder:nth-of-type(12){ min-height: 136px; }

.page-academy .academy-spine__title{
  margin-top: 2px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: center;
  line-height: 1;
  word-break: normal;
  overflow-wrap: normal;
}

/* einheitlichere Typografie */
.page-academy .academy-spine__level{
  min-width: 28px;
  height: 22px;
  padding: 0 8px;
  font-size: 10px;
  margin: 0 auto 10px;
}

/* legend panel between shelf and desk */
.page-academy .academy-legend{
  position: relative;
  z-index: 2;
  margin: 14px 0 18px;
  padding: 16px 18px;
  border-radius: 20px;
  border: 1px solid rgba(0,255,255,0.10);
  background:
    linear-gradient(180deg, rgba(8,14,20,0.92), rgba(4,8,13,0.96));
  box-shadow:
    0 20px 40px rgba(0,0,0,0.28),
    inset 0 1px 0 rgba(255,255,255,0.03);
}

.page-academy .academy-legend::before{
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 18%, rgba(0,255,255,0.05), transparent 20%),
    radial-gradient(circle at 82% 22%, rgba(255,210,140,0.04), transparent 18%);
}

.page-academy .academy-legend__title{
  margin: 0 0 10px;
  color: #edf9ff;
  font-size: 0.96rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.page-academy .academy-legend__grid{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px 14px;
}

.page-academy .academy-legend__item{
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 38px;
  padding: 8px 10px;
  border-radius: 14px;
  background: rgba(10,18,26,0.68);
  border: 1px solid rgba(255,255,255,0.04);
}

.page-academy .academy-legend__code{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 44px;
  height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.16), rgba(255,255,255,0.03)),
    linear-gradient(135deg, rgba(20,32,46,0.94), rgba(8,14,22,0.96));
  border: 1px solid rgba(255,255,255,0.10);
  color: #f3fbff;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.08em;
}

.page-academy .academy-legend__text{
  color: rgba(232,240,246,0.92);
  font-size: 0.9rem;
  line-height: 1.35;
}

@media (max-width: 980px){
  .page-academy .academy-legend__grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px){
  .page-academy .academy-legend__grid{
    grid-template-columns: 1fr;
  }
}

/* ###################################################################### */
/* ################# END ACADEMY CODE SPINES + LEGEND #################### */
/* ###################################################################### */


/* ###################################################################### */
/* ################ BEGIN FINAL REGAL + LEGENDE REFINEMENT ############### */
/* ###################################################################### */

/* --- Legende ---------------------------------------------------------- */
.page-academy .academy-legend{
  position: relative;
  z-index: 2;
  margin: 14px 0 18px;
  padding: 16px 18px;
  border-radius: 20px;
  border: 1px solid rgba(0,255,255,0.10);
  background:
    linear-gradient(180deg, rgba(8,14,20,0.92), rgba(4,8,13,0.96));
  box-shadow:
    0 20px 40px rgba(0,0,0,0.28),
    inset 0 1px 0 rgba(255,255,255,0.03);
}

.page-academy .academy-legend::before{
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 18%, rgba(0,255,255,0.05), transparent 20%),
    radial-gradient(circle at 82% 22%, rgba(255,210,140,0.04), transparent 18%);
}

.page-academy .academy-legend__title{
  margin: 0 0 10px;
  color: #edf9ff;
  font-size: 0.96rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.page-academy .academy-legend__grid{
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px 14px;
}

.page-academy .academy-legend__item{
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 38px;
  padding: 8px 10px;
  border-radius: 14px;
  background: rgba(10,18,26,0.68);
  border: 1px solid rgba(255,255,255,0.04);
}

.page-academy .academy-legend__code{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 68px;
  height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(255,255,255,0.16), rgba(255,255,255,0.03)),
    linear-gradient(135deg, rgba(20,32,46,0.94), rgba(8,14,22,0.96));
  border: 1px solid rgba(255,255,255,0.10);
  color: #f3fbff;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  white-space: nowrap;
}

.page-academy .academy-legend__text{
  color: rgba(232,240,246,0.92);
  font-size: 0.9rem;
  line-height: 1.35;
}

/* --- Regal-Bücher feintunen ------------------------------------------ */
.page-academy .academy-shelf__row{
  align-items: flex-end;
  gap: 10px;
}

.page-academy .academy-spine{
  width: 42px;
  min-height: 122px;
  padding: 8px 5px 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  border-radius: 10px 10px 7px 7px;
  overflow: hidden;
  color: #ffffff;
  border: 1px solid rgba(255,255,255,0.10);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.10),
    inset 0 -3px 10px rgba(0,0,0,0.54),
    0 12px 22px rgba(0,0,0,0.36);
}

.page-academy .academy-spine--wide{
  width: 54px;
}

.page-academy .academy-spine--thick{
  width: 66px;
}

.page-academy .academy-spine__level{
  min-width: 28px;
  height: 22px;
  padding: 0 8px;
  font-size: 10px;
  margin: 0 auto 10px;
}

.page-academy .academy-spine__title{
  margin-top: 2px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-align: center;
  line-height: 1;
  white-space: nowrap;
}

/* Höhen bewusst staffeln */
.page-academy .academy-spine[data-book-key="chapter-01"]{ min-height: 112px; }
.page-academy .academy-spine[data-book-key="chapter-02"]{ min-height: 146px; }
.page-academy .academy-spine[data-book-key="chapter-03"]{ min-height: 116px; }
.page-academy .academy-spine[data-book-key="chapter-04"]{ min-height: 154px; }

.page-academy .academy-spine--placeholder:nth-of-type(5){ min-height: 118px; }
.page-academy .academy-spine--placeholder:nth-of-type(6){ min-height: 142px; }
.page-academy .academy-spine--placeholder:nth-of-type(7){ min-height: 120px; }
.page-academy .academy-spine--placeholder:nth-of-type(8){ min-height: 124px; }
.page-academy .academy-spine--placeholder:nth-of-type(9){ min-height: 130px; }
.page-academy .academy-spine--placeholder:nth-of-type(10){ min-height: 122px; }
.page-academy .academy-spine--placeholder:nth-of-type(11){ min-height: 126px; }
.page-academy .academy-spine--placeholder:nth-of-type(12){ min-height: 136px; }

/* Farben zurück */
.page-academy .academy-spine[data-book-key="chapter-01"]{
  background:
    linear-gradient(180deg, rgba(255,255,255,0.12), rgba(255,255,255,0.00) 16%),
    linear-gradient(180deg, rgba(19,79,114,0.98), rgba(8,29,42,1));
}

.page-academy .academy-spine[data-book-key="chapter-02"]{
  background:
    linear-gradient(180deg, rgba(255,255,255,0.12), rgba(255,255,255,0.00) 16%),
    linear-gradient(180deg, rgba(48,70,164,0.98), rgba(15,23,62,1));
}

.page-academy .academy-spine[data-book-key="chapter-03"]{
  background:
    linear-gradient(180deg, rgba(255,255,255,0.12), rgba(255,255,255,0.00) 16%),
    linear-gradient(180deg, rgba(27,108,80,0.98), rgba(8,36,29,1));
}

.page-academy .academy-spine[data-book-key="chapter-04"]{
  background:
    linear-gradient(180deg, rgba(255,255,255,0.12), rgba(255,255,255,0.00) 16%),
    linear-gradient(180deg, rgba(146,92,26,0.98), rgba(54,28,7,1));
}

.page-academy .academy-spine--placeholder:nth-of-type(5){
  background:
    linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.00) 16%),
    linear-gradient(180deg, rgba(88,109,122,0.98), rgba(34,48,58,1));
}

.page-academy .academy-spine--placeholder:nth-of-type(6){
  background:
    linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.00) 16%),
    linear-gradient(180deg, rgba(98,63,174,0.98), rgba(35,18,72,1));
}

.page-academy .academy-spine--placeholder:nth-of-type(7){
  background:
    linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.00) 16%),
    linear-gradient(180deg, rgba(208,84,40,0.98), rgba(96,34,14,1));
}

.page-academy .academy-spine--placeholder:nth-of-type(8){
  background:
    linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.00) 16%),
    linear-gradient(180deg, rgba(66,132,68,0.98), rgba(24,62,26,1));
}

.page-academy .academy-spine--placeholder:nth-of-type(9){
  background:
    linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.00) 16%),
    linear-gradient(180deg, rgba(20,126,122,0.98), rgba(8,48,46,1));
}

.page-academy .academy-spine--placeholder:nth-of-type(10){
  background:
    linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.00) 16%),
    linear-gradient(180deg, rgba(184,46,52,0.98), rgba(68,12,18,1));
}

.page-academy .academy-spine--placeholder:nth-of-type(11){
  background:
    linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.00) 16%),
    linear-gradient(180deg, rgba(112,42,164,0.98), rgba(42,12,68,1));
}

.page-academy .academy-spine--placeholder:nth-of-type(12){
  background:
    linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.00) 16%),
    linear-gradient(180deg, rgba(132,136,42,0.98), rgba(56,58,12,1));
}

/* aktive Lücke im Regal */
.page-academy .academy-spine.is-gap{
  opacity: 0.05;
  pointer-events: none;
  transform: translateY(-4px) scale(0.92);
  box-shadow: none;
}

/* Responsive */
@media (max-width: 980px){
  .page-academy .academy-legend__grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px){
  .page-academy .academy-legend__grid{
    grid-template-columns: 1fr;
  }
}

/* ====== MICRO IMPERFECTION ====== */
.page-academy .academy-spine:nth-child(odd){
  transform: rotate(-0.6deg);
}

.page-academy .academy-spine:nth-child(even){
  transform: rotate(0.6deg);
}

.page-academy .academy-spine:hover{
  transform: translateY(-6px) scale(1.04) rotate(0deg);
  z-index: 3;
}

/* ====== FOCUS BOOK CINEMATIC ====== */
.page-academy .academy-desk{
  position: relative;
  overflow: hidden;
}

.page-academy .academy-desk::before{
  content: "";
  position: absolute;
  inset: -20%;
  background: radial-gradient(
    circle at 50% 20%,
    rgba(0,255,255,0.08),
    transparent 60%
  );
  pointer-events: none;
}

/* ###################################################################### */
/* ################# END FINAL REGAL + LEGENDE REFINEMENT ################ */
/* ###################################################################### */