/*
 * Pull People — 06 / FRONTEND V2
 * Projects / Portfolio V2 · B6.2
 * Robust native-scroll cinematic stack.
 */

.section-projects--v2-b6 {
  position: relative;
  isolation: isolate;
  overflow-x: clip;
  overflow-y: visible;
  margin-top: clamp(-10.5rem, -9vw, -7rem);
  padding: 0 0 clamp(6rem, 10vw, 9rem);
  background:
    radial-gradient(72rem 30rem at 50% 1rem, rgba(111,190,255,.13), transparent 69%),
    linear-gradient(180deg,
      rgba(2,10,19,0) 0%,
      rgba(3,14,26,.20) 7%,
      rgba(4,23,42,.52) 16%,
      rgba(7,37,65,.80) 27%,
      #0c3154 41%,
      #164c7b 58%,
      #1a588d 69%,
      #123d67 82%,
      #081e36 94%,
      #061626 100%);
}

.section-projects--v2-b6::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0 0 auto;
  height: clamp(25rem, 35vw, 36rem);
  pointer-events: none;
  background:
    radial-gradient(54rem 19rem at 50% 3%, rgba(113,188,255,.15), transparent 72%),
    linear-gradient(180deg, rgba(1,8,15,0), rgba(18,71,115,.17) 68%, transparent);
  filter: blur(20px);
}

.section-projects--v2-b6::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 28% -12% 3%;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 34%, rgba(87,162,239,.14), transparent 27%),
    radial-gradient(circle at 82% 46%, rgba(112,192,255,.12), transparent 25%),
    radial-gradient(circle at 50% 78%, rgba(60,139,226,.10), transparent 32%);
  filter: blur(48px);
}

.projects-v2-b6__scene {
  --pp-title-x: 0px;
  --pp-summary-x: 0px;
  --pp-intro-opacity: 1;
  position: relative;
  z-index: 4;
  min-height: 148svh;
}

.projects-v2-b6__viewport {
  position: sticky;
  top: 0;
  height: 100svh;
  min-height: 38rem;
  overflow: clip;
}

.projects-v2-b6__stage {
  position: relative;
  height: 100%;
}

.projects-v2-b6__intro {
  position: absolute;
  top: clamp(8rem, 13svh, 10rem);
  right: 0;
  left: 0;
  display: grid;
  gap: 1.3rem;
}

.projects-v2-b6__eyebrow {
  margin: 0;
  color: rgba(126,196,255,.98);
  letter-spacing: .08em;
}

.projects-v2-b6__intro-grid {
  display: grid;
  grid-template-columns: minmax(18rem,40rem) minmax(21rem,35rem);
  justify-content: space-between;
  align-items: start;
  gap: clamp(2rem,5vw,7rem);
}

.projects-v2-b6__title-block {
  transform: translate3d(var(--pp-title-x),0,0);
  opacity: var(--pp-intro-opacity);
  will-change: transform,opacity;
}

.projects-v2-b6__summary {
  justify-self: end;
  max-width: 35rem;
  padding-top: .55rem;
  transform: translate3d(var(--pp-summary-x),0,0);
  opacity: var(--pp-intro-opacity);
  will-change: transform,opacity;
}

.projects-v2-b6__title-block h2 {
  margin: 0;
  max-width: 7ch;
  color: #f6f9ff;
  font-size: clamp(3.5rem,6.4vw,6.7rem);
  line-height: .89;
  letter-spacing: -.062em;
}

.projects-v2-b6__kicker {
  margin: 0;
  max-width: 34rem;
  color: rgba(226,238,252,.91);
  font-size: clamp(1.12rem,1.36vw,1.4rem);
  line-height: 1.5;
  letter-spacing: -.018em;
}

.projects-v2-b6 .projects-section__lead {
  margin: 1rem 0 0;
  max-width: 34rem;
  color: rgba(211,227,245,.72);
  font-size: clamp(1rem,1.08vw,1.12rem);
  line-height: 1.72;
}

.projects-v2-b6__stack {
  position: relative;
  z-index: 20;
  display: grid;
  gap: 0;
  margin-top: -56svh;
  padding-bottom: 0;
}

.projects-v2-b6 .project-case.projects-v2-card {
  grid-area: auto !important;
  position: sticky !important;
  top: calc(13.5svh + (var(--pp-card-order) * 1.15rem));
  z-index: var(--pp-card-z) !important;
  display: block !important;
  width: min(82rem,calc(100% - 1rem));
  height: 70svh;
  min-height: 36rem;
  max-height: 46rem;
  margin: 0 auto calc(19svh + var(--pp-card-release-gap, 0rem)) !important;
  overflow: visible !important;
  contain: none !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  visibility: visible !important;
  opacity: 1 !important;
  filter: none !important;
  pointer-events: auto !important;
  transform: none !important;
}



.projects-v2-b6 .project-case.projects-v2-card.is-focus-card {
  z-index: 150 !important;
}

.projects-v2-b6 .projects-v2-card__shell {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0,1.62fr) minmax(20rem,.92fr);
  width: 100%;
  height: 100%;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid rgba(192,226,255,.23);
  border-radius: clamp(1.55rem,2.4vw,2.35rem);
  background:
    linear-gradient(135deg, rgba(21,50,83,.52), rgba(7,24,44,.38) 42%, rgba(18,57,96,.40)),
    rgba(7,20,37,.31);
  box-shadow:
    0 3rem 7.5rem rgba(1,7,16,.40),
    0 -1.25rem 3.5rem rgba(4,18,34,.24),
    inset 0 1px 0 rgba(255,255,255,.20),
    inset 0 -1px 0 rgba(101,181,255,.10),
    inset 0 0 0 1px rgba(255,255,255,.025);
  -webkit-backdrop-filter: blur(22px) saturate(1.26);
  backdrop-filter: blur(22px) saturate(1.26);
}

.projects-v2-b6 .projects-v2-card__shell::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 8;
  pointer-events: none;
  background:
    linear-gradient(118deg, rgba(255,255,255,.13), transparent 17% 78%, rgba(124,199,255,.11)),
    radial-gradient(28rem 12rem at 18% -4%, rgba(201,235,255,.15), transparent 70%),
    radial-gradient(26rem 14rem at 94% 108%, rgba(76,161,255,.13), transparent 72%);
  opacity: .82;
}

.projects-v2-card__glow {
  position: absolute;
  z-index: 0;
  width: 58%;
  aspect-ratio: 1;
  left: -16%;
  bottom: -38%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(121,203,255,.18), transparent 68%);
  filter: blur(42px);
  pointer-events: none;
}

.projects-v2-card__fracture {
  position: absolute;
  z-index: 12;
  inset: 0;
  pointer-events: none;
  opacity: 0;
  transform: scale(.99);
  background:
    linear-gradient(128deg, transparent 0 49.2%, rgba(218,241,255,.55) 49.7% 50.1%, transparent 50.6%) 19% 35% / 24% 1px no-repeat,
    linear-gradient(82deg, transparent 0 49.2%, rgba(178,222,255,.46) 49.7% 50.1%, transparent 50.6%) 31% 46% / 1px 19% no-repeat,
    linear-gradient(142deg, transparent 0 49.2%, rgba(214,239,255,.43) 49.7% 50.1%, transparent 50.6%) 42% 55% / 29% 1px no-repeat,
    linear-gradient(68deg, transparent 0 49.2%, rgba(172,218,255,.40) 49.7% 50.1%, transparent 50.6%) 59% 30% / 1px 22% no-repeat,
    linear-gradient(121deg, transparent 0 49.2%, rgba(220,242,255,.36) 49.7% 50.1%, transparent 50.6%) 73% 62% / 20% 1px no-repeat,
    radial-gradient(circle at 49% 48%, rgba(196,233,255,.30), transparent 4%);
  mix-blend-mode: screen;
  transition: opacity 180ms ease, transform 360ms cubic-bezier(.22,1,.36,1);
}

.projects-v2-b6 .projects-v2-card__media {
  position: relative;
  z-index: 1;
  min-width: 0;
  min-height: 0 !important;
  height: 100%;
  margin: 0 !important;
  overflow: hidden;
  border: 0 !important;
  border-radius: 0 !important;
  background:
    radial-gradient(circle at 50% 46%, rgba(128,195,255,.14), transparent 47%),
    linear-gradient(145deg, rgba(5,16,29,.70), rgba(8,28,48,.54)) !important;
}

.projects-v2-b6 .projects-v2-card__media::before {
  content: "";
  position: absolute;
  inset: -12%;
  z-index: -1;
  background-image:
    linear-gradient(145deg, rgba(2,8,15,.12), rgba(2,8,15,.50)),
    var(--pp-project-scene-image,none);
  background-position: center;
  background-size: cover;
  filter: blur(30px) saturate(1.04) brightness(.68);
  opacity: .42;
  transform: scale(1.08);
}

.projects-v2-b6 .projects-v2-card__screen {
  position: absolute !important;
  inset: clamp(1.15rem,2vw,1.75rem) !important;
  z-index: 2;
  display: grid;
  place-items: center;
  min-height: 0 !important;
  padding: clamp(.75rem,1.15vw,1rem) !important;
  overflow: hidden;
  border: 1px solid rgba(196,229,255,.12) !important;
  border-radius: clamp(1rem,1.7vw,1.4rem) !important;
  background: rgba(6,17,31,.18) !important;
  box-shadow:
    0 1.8rem 4.5rem rgba(0,0,0,.20),
    inset 0 1px 0 rgba(255,255,255,.08) !important;
  -webkit-backdrop-filter: blur(10px) saturate(1.08);
  backdrop-filter: blur(10px) saturate(1.08);
}

.projects-v2-b6 .projects-v2-card__image {
  position: relative;
  z-index: 1;
  display: block;
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center !important;
  transform: none !important;
}

.projects-v2-b6 .projects-v2-card__content {
  position: relative;
  z-index: 4;
  display: flex !important;
  min-width: 0;
  height: 100%;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  gap: .85rem;
  margin: 0 !important;
  padding: clamp(2rem,3vw,3.1rem) !important;
  overflow: hidden;
  border: 0 !important;
  background:
    linear-gradient(155deg, rgba(19,51,88,.48), rgba(8,27,49,.54)),
    rgba(9,27,49,.32) !important;
  box-shadow: inset 1px 0 0 rgba(184,224,255,.11) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.18);
  backdrop-filter: blur(18px) saturate(1.18);
}

.projects-v2-b6 .projects-v2-card__meta {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: auto;
}

.projects-v2-b6 .projects-v2-card__number {
  display: inline-grid;
  place-items: center;
  width: 2.75rem;
  aspect-ratio: 1;
  border: 1px solid rgba(184,224,255,.17);
  border-radius: 50%;
  color: rgba(235,246,255,.9);
  background: rgba(104,174,255,.07);
  font-size: .7rem;
  letter-spacing: .10em;
}

.projects-v2-b6 .project-case__featured {
  margin: 0;
  color: rgba(142,203,255,.92);
  font-size: .7rem;
  letter-spacing: .075em;
  text-transform: uppercase;
}

.projects-v2-b6 .project-case__featured--muted {
  color: rgba(210,229,247,.64);
}

.projects-v2-b6 .project-case__copy {
  display: grid;
  gap: .75rem;
}

.projects-v2-b6 .project-case__title {
  margin: 0;
  max-width: 11ch;
  color: #f8fbff;
  font-size: clamp(2.1rem,3.25vw,3.85rem) !important;
  line-height: .98 !important;
  letter-spacing: -.048em;
}

.projects-v2-b6 .project-case__intervention {
  margin: 0;
  max-width: 31rem;
  color: rgba(225,237,250,.76);
  font-size: clamp(.95rem,1.02vw,1.07rem);
  line-height: 1.67;
}

.projects-v2-b6 .project-case__status {
  margin: 0;
  color: rgba(139,201,255,.90);
  font-size: .75rem;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.projects-v2-b6 .project-case__deliverables {
  display: flex !important;
  flex-wrap: wrap;
  gap: .45rem;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none;
}

.projects-v2-b6 .project-case__deliverables li {
  margin: 0 !important;
  padding: .48rem .68rem !important;
  border: 1px solid rgba(169,213,255,.15) !important;
  border-radius: 999px !important;
  color: rgba(230,241,252,.83);
  background: rgba(104,163,233,.055) !important;
  font-size: .69rem;
}

.projects-v2-b6 .project-case__link {
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  min-height: 2.75rem;
  color: #f7fbff;
  font-weight: 700;
  text-decoration: none;
}

.projects-v2-b6 .project-case__link:focus-visible,
.projects-v2-b6__button:focus-visible {
  outline: 2px solid rgba(159,215,255,.96);
  outline-offset: 4px;
}

.projects-v2-b6__footer {
  position: relative;
  z-index: 30;
  display: flex;
  justify-content: center;
  margin-top: clamp(3rem, 6svh, 5rem);
  padding-top: 0;
}

.projects-v2-b6__button {
  display: inline-flex;
  min-height: 3.9rem;
  align-items: center;
  justify-content: center;
  gap: .7rem;
  padding: 0 1.55rem;
  border: 1px solid rgba(188,225,255,.21);
  border-radius: 999px;
  color: #f7fbff;
  text-decoration: none;
  background:
    linear-gradient(145deg, rgba(158,216,255,.14), rgba(44,102,170,.13)),
    rgba(8,25,47,.31);
  -webkit-backdrop-filter: blur(16px) saturate(1.16);
  backdrop-filter: blur(16px) saturate(1.16);
}

@media (hover: hover) and (pointer: fine) {
  .projects-v2-b6 .projects-v2-card:hover .projects-v2-card__fracture,
  .projects-v2-b6 .projects-v2-card:focus-within .projects-v2-card__fracture {
    opacity: .72;
    transform: scale(1.008);
  }
}

@media (hover: none), (pointer: coarse) {
  .projects-v2-b6 .projects-v2-card.is-active-card .projects-v2-card__fracture {
    animation: pp-project-fracture-pulse 760ms ease both;
  }
}

@keyframes pp-project-fracture-pulse {
  0% { opacity: 0; transform: scale(.995); }
  34% { opacity: .56; transform: scale(1.006); }
  100% { opacity: .18; transform: scale(1); }
}

@media (max-width: 1023px) {
  .projects-v2-b6__intro-grid {
    grid-template-columns: minmax(0,1fr) minmax(18rem,.82fr);
    gap: 2rem;
  }

  .projects-v2-b6__title-block h2 {
    font-size: clamp(3.1rem,7.4vw,5.2rem);
  }

  .projects-v2-b6 .project-case.projects-v2-card {
    top: calc(12.5svh + (var(--pp-card-order) * .85rem));
    width: min(94%,64rem);
    height: 72svh;
  }

  .projects-v2-b6 .projects-v2-card__shell {
    grid-template-columns: minmax(0,1.34fr) minmax(17rem,.86fr);
  }
}

@media (max-width: 767px) {
  .section-projects--v2-b6 {
    margin-top: -4.5rem;
    padding-bottom: 5.5rem;
  }

  .projects-v2-b6__scene {
    min-height: 132svh;
  }

  .projects-v2-b6__intro {
    top: clamp(5.8rem,10.5svh,7rem);
  }

  .projects-v2-b6__intro-grid {
    grid-template-columns: 1fr;
    gap: 1.05rem;
  }

  .projects-v2-b6__title-block h2 {
    max-width: 8.3ch;
    font-size: clamp(2.6rem,12vw,4.15rem);
  }

  .projects-v2-b6__summary {
    justify-self: start;
    max-width: 31rem;
    padding-top: 0;
  }

  .projects-v2-b6__kicker {
    font-size: 1rem;
  }

  .projects-v2-b6 .projects-section__lead {
    margin-top: .68rem;
    font-size: .91rem;
    line-height: 1.58;
  }

  .projects-v2-b6__stack {
    margin-top: -48svh;
    padding-bottom: 0;
  }

  .projects-v2-b6 .project-case.projects-v2-card {
    top: calc(10.5svh + (var(--pp-card-order) * .55rem));
    width: calc(100% - .7rem);
    height: 78svh;
    min-height: 35rem;
    max-height: 41rem;
    margin-bottom: calc(14svh + var(--pp-card-release-gap-mobile, 0rem)) !important;
  }

  .projects-v2-b6 .projects-v2-card__shell {
    grid-template-columns: 1fr;
    grid-template-rows: minmax(10rem,38%) minmax(0,62%);
    border-radius: 1.4rem;
    -webkit-backdrop-filter: blur(13px) saturate(1.16);
    backdrop-filter: blur(13px) saturate(1.16);
  }

  .projects-v2-b6 .projects-v2-card__screen {
    inset: .7rem !important;
    padding: .45rem !important;
    -webkit-backdrop-filter: blur(7px) saturate(1.04);
    backdrop-filter: blur(7px) saturate(1.04);
  }

  .projects-v2-b6 .projects-v2-card__content {
    gap: .5rem;
    padding: 1rem !important;
    -webkit-backdrop-filter: blur(10px) saturate(1.10);
    backdrop-filter: blur(10px) saturate(1.10);
  }

  .projects-v2-b6 .project-case__title {
    font-size: clamp(1.75rem,8.2vw,2.65rem) !important;
  }

  .projects-v2-b6 .project-case__intervention {
    display: -webkit-box;
    overflow: hidden;
    font-size: .84rem;
    line-height: 1.47;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }

  .projects-v2-b6 .project-case__deliverables li {
    padding: .36rem .5rem !important;
    font-size: .6rem;
  }

  .projects-v2-b6__button {
    width: 100%;
  }
}

.section-projects--v2-b6[data-cinematic="off"] {
  margin-top: 0;
  padding-top: clamp(4rem,8vw,7rem);
}

.section-projects--v2-b6[data-cinematic="off"] .projects-v2-b6__scene {
  min-height: 0;
}

.section-projects--v2-b6[data-cinematic="off"] .projects-v2-b6__viewport {
  position: relative;
  height: auto;
  min-height: 0;
  overflow: visible;
}

.section-projects--v2-b6[data-cinematic="off"] .projects-v2-b6__stage {
  height: auto;
}

.section-projects--v2-b6[data-cinematic="off"] .projects-v2-b6__intro {
  position: relative;
  top: auto;
  margin-bottom: clamp(2.5rem,5vw,4rem);
}

.section-projects--v2-b6[data-cinematic="off"] .projects-v2-b6__title-block,
.section-projects--v2-b6[data-cinematic="off"] .projects-v2-b6__summary {
  transform: none !important;
  opacity: 1 !important;
}

.section-projects--v2-b6[data-cinematic="off"] .projects-v2-b6__stack {
  display: grid;
  gap: 1.25rem;
  margin-top: 0;
  padding-bottom: 0;
}

.section-projects--v2-b6[data-cinematic="off"] .project-case.projects-v2-card {
  position: relative !important;
  top: auto;
  width: 100%;
  height: auto;
  min-height: clamp(32rem,58vw,43rem);
  margin-bottom: 0 !important;
}

@media (max-width: 767px) {
  .section-projects--v2-b6[data-cinematic="off"] .projects-v2-card__shell {
    min-height: 35rem;
  }
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .projects-v2-b6 .projects-v2-card__shell,
  .projects-v2-b6 .projects-v2-card__content,
  .projects-v2-b6__button {
    background-color: rgba(8,27,49,.96) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .section-projects--v2-b6 {
    margin-top: 0;
    padding-top: clamp(4rem,8vw,7rem);
  }

  .projects-v2-b6__scene {
    min-height: 0;
  }

  .projects-v2-b6__viewport {
    position: relative;
    height: auto;
    min-height: 0;
    overflow: visible;
  }

  .projects-v2-b6__intro {
    position: relative;
    top: auto;
    margin-bottom: 3rem;
  }

  .projects-v2-b6__title-block,
  .projects-v2-b6__summary {
    transform: none !important;
    opacity: 1 !important;
  }

  .projects-v2-b6__stack {
    display: grid;
    gap: 1.25rem;
    margin-top: 0;
  }

  .projects-v2-b6 .project-case.projects-v2-card {
    position: relative !important;
    top: auto;
    height: auto;
    min-height: clamp(32rem,58vw,43rem);
    margin-bottom: 0 !important;
  }

  .projects-v2-b6 *,
  .projects-v2-b6 *::before,
  .projects-v2-b6 *::after {
    animation: none !important;
    transition: none !important;
  }
}



/* B6.4 — stack readability:
   later cards stop slightly lower, preserving a visible glass rim of the previous layer. */
.projects-v2-b6 .project-case.projects-v2-card + .project-case.projects-v2-card {
  scroll-margin-top: 16svh;
}


/* B6.5 — final release.
   The last project retains a short protagonist hold, then the CTA follows
   immediately. No extra viewport-sized dead zone. */
.section-projects--v2-b6 {
  background:
    radial-gradient(72rem 30rem at 50% 1rem, rgba(111,190,255,.13), transparent 69%),
    linear-gradient(180deg,
      rgba(2,10,19,0) 0%,
      rgba(3,14,26,.20) 7%,
      rgba(4,23,42,.52) 16%,
      rgba(7,37,65,.80) 27%,
      #0c3154 41%,
      #164c7b 58%,
      #1a588d 69%,
      #123d67 84%,
      #0a2744 94%,
      #061626 100%);
}


/* B6.6 — controlled stack release.
   Card 03 starts leaving its sticky anchor before the CTA enters the viewport,
   so the section hands off naturally instead of overlapping/breaking at the end. */
@media (max-width: 767px) {
  .projects-v2-b6__footer {
    margin-top: 5svh;
  }
}


/* B6.7 — synchronized final pile.
   Each card carries a compensating bottom margin equal to the difference
   between its sticky anchor and the last card's anchor. As the stack reaches
   its parent boundary, 01/02/03 release together and keep their glass rims
   visible as one final composition. */
.projects-v2-b6 .project-case.projects-v2-card {
  transition: box-shadow 220ms ease;
}

@media (prefers-reduced-motion: reduce) {
  .projects-v2-b6 .project-case.projects-v2-card {
    margin-bottom: 0 !important;
  }
}


/* ==========================================================================
   B7 — Optical Glass polish
   Visual-only refinement. B6.7 mechanics remain untouched.
   ========================================================================== */

.projects-v2-b6 .projects-v2-card__shell {
  border-color: rgba(202, 233, 255, .24);
  background:
    linear-gradient(132deg,
      rgba(188, 225, 255, .075) 0%,
      rgba(92, 159, 230, .045) 18%,
      rgba(10, 31, 55, .30) 48%,
      rgba(28, 76, 124, .20) 100%),
    rgba(7, 20, 37, .22);
  box-shadow:
    0 3rem 7.5rem rgba(1, 7, 16, .38),
    0 -1.25rem 3.5rem rgba(4, 18, 34, .22),
    0 0 0 1px rgba(114, 189, 255, .025),
    inset 0 1px 0 rgba(255, 255, 255, .24),
    inset 0 -1px 0 rgba(111, 187, 255, .11),
    inset 1px 0 0 rgba(255, 255, 255, .035);
  -webkit-backdrop-filter: blur(22px) saturate(1.28);
  backdrop-filter: blur(22px) saturate(1.28);
}

.projects-v2-b6 .projects-v2-card__shell::before {
  background:
    linear-gradient(115deg,
      rgba(255, 255, 255, .18) 0%,
      rgba(255, 255, 255, .055) 13%,
      transparent 25% 73%,
      rgba(103, 188, 255, .10) 100%),
    radial-gradient(34rem 14rem at 12% -7%,
      rgba(214, 240, 255, .18),
      rgba(214, 240, 255, 0) 72%),
    radial-gradient(28rem 16rem at 98% 106%,
      rgba(86, 170, 255, .13),
      rgba(86, 170, 255, 0) 72%);
  opacity: .88;
}

.projects-v2-b6 .projects-v2-card__shell::after {
  content: "";
  position: absolute;
  inset: 1px;
  z-index: 10;
  border-radius: inherit;
  pointer-events: none;
  opacity: .62;
  background:
    linear-gradient(102deg,
      transparent 0 15%,
      rgba(255, 255, 255, .055) 21%,
      transparent 28% 68%,
      rgba(111, 199, 255, .05) 77%,
      transparent 84%),
    radial-gradient(42rem 8rem at 50% -3%,
      rgba(226, 245, 255, .13),
      transparent 72%);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, .025),
    inset 0 1.25rem 3.5rem rgba(255, 255, 255, .018),
    inset 0 -2rem 4rem rgba(61, 140, 230, .035);
  transition: opacity 220ms ease, transform 420ms cubic-bezier(.22, 1, .36, 1);
  transform: translate3d(0, 0, 0);
}

.projects-v2-b6 .projects-v2-card__media {
  background:
    radial-gradient(circle at 48% 42%, rgba(135, 202, 255, .15), transparent 46%),
    linear-gradient(145deg, rgba(5, 16, 29, .58), rgba(8, 28, 48, .46)) !important;
}

.projects-v2-b6 .projects-v2-card__screen {
  border-color: rgba(211, 237, 255, .14) !important;
  background:
    linear-gradient(145deg, rgba(146, 203, 255, .045), rgba(4, 14, 27, .16)),
    rgba(6, 17, 31, .14) !important;
  box-shadow:
    0 1.8rem 4.5rem rgba(0, 0, 0, .18),
    inset 0 1px 0 rgba(255, 255, 255, .105),
    inset 0 0 0 1px rgba(116, 190, 255, .025) !important;
}

.projects-v2-b6 .projects-v2-card__content {
  background:
    linear-gradient(156deg,
      rgba(128, 190, 255, .075) 0%,
      rgba(18, 49, 84, .30) 24%,
      rgba(7, 25, 46, .42) 100%),
    rgba(8, 25, 46, .24) !important;
  box-shadow:
    inset 1px 0 0 rgba(198, 231, 255, .13),
    inset 0 1px 0 rgba(255, 255, 255, .035) !important;
  -webkit-backdrop-filter: blur(18px) saturate(1.20);
  backdrop-filter: blur(18px) saturate(1.20);
}

.projects-v2-b6 .projects-v2-card__number,
.projects-v2-b6 .project-case__deliverables li {
  box-shadow:
    inset 0 1px rgba(255, 255, 255, .08),
    inset 0 -1px rgba(89, 163, 247, .04);
}

.projects-v2-b6 .projects-v2-card__fracture {
  opacity: 0;
  transform: scale(.995);
  background:
    linear-gradient(128deg,
      transparent 0 49.45%,
      rgba(231, 247, 255, .62) 49.72% 49.95%,
      transparent 50.22%) 20% 34% / 23% 1px no-repeat,
    linear-gradient(79deg,
      transparent 0 49.45%,
      rgba(196, 230, 255, .50) 49.72% 49.95%,
      transparent 50.22%) 31% 44% / 1px 19% no-repeat,
    linear-gradient(143deg,
      transparent 0 49.45%,
      rgba(224, 243, 255, .52) 49.72% 49.95%,
      transparent 50.22%) 42% 53% / 27% 1px no-repeat,
    linear-gradient(64deg,
      transparent 0 49.45%,
      rgba(185, 226, 255, .44) 49.72% 49.95%,
      transparent 50.22%) 58% 28% / 1px 22% no-repeat,
    linear-gradient(122deg,
      transparent 0 49.45%,
      rgba(218, 240, 255, .40) 49.72% 49.95%,
      transparent 50.22%) 70% 60% / 19% 1px no-repeat,
    linear-gradient(94deg,
      transparent 0 49.45%,
      rgba(176, 221, 255, .34) 49.72% 49.95%,
      transparent 50.22%) 51% 48% / 1px 11% no-repeat,
    radial-gradient(circle at 49% 48%,
      rgba(215, 241, 255, .25),
      transparent 4.5%);
  filter:
    drop-shadow(0 0 .45rem rgba(164, 219, 255, .10))
    drop-shadow(0 0 1.15rem rgba(72, 157, 255, .04));
  transition:
    opacity 190ms ease,
    transform 360ms cubic-bezier(.22, 1, .36, 1),
    filter 220ms ease;
}

@media (hover: hover) and (pointer: fine) {
  .projects-v2-b6 .projects-v2-card:hover .projects-v2-card__shell,
  .projects-v2-b6 .projects-v2-card:focus-within .projects-v2-card__shell {
    border-color: rgba(217, 240, 255, .33);
    box-shadow:
      0 3.25rem 8rem rgba(1, 7, 16, .42),
      0 -1.35rem 3.75rem rgba(4, 18, 34, .24),
      0 0 0 1px rgba(120, 199, 255, .035),
      inset 0 1px 0 rgba(255, 255, 255, .28),
      inset 0 -1px 0 rgba(111, 187, 255, .13);
  }

  .projects-v2-b6 .projects-v2-card:hover .projects-v2-card__shell::after,
  .projects-v2-b6 .projects-v2-card:focus-within .projects-v2-card__shell::after {
    opacity: .94;
    transform: translate3d(.35%, -.25%, 0);
  }

  .projects-v2-b6 .projects-v2-card:hover .projects-v2-card__fracture,
  .projects-v2-b6 .projects-v2-card:focus-within .projects-v2-card__fracture {
    opacity: .68;
    transform: scale(1.006);
    filter:
      drop-shadow(0 0 .55rem rgba(174, 226, 255, .16))
      drop-shadow(0 0 1.35rem rgba(80, 165, 255, .07));
  }
}

@media (hover: none), (pointer: coarse) {
  .projects-v2-b6 .projects-v2-card.is-active-card .projects-v2-card__shell::after {
    animation: pp-project-glass-flare 900ms ease-out both;
  }
}

@keyframes pp-project-glass-flare {
  0% {
    opacity: .50;
    transform: translate3d(-.45%, .2%, 0);
  }
  42% {
    opacity: .92;
    transform: translate3d(.30%, -.15%, 0);
  }
  100% {
    opacity: .62;
    transform: translate3d(0, 0, 0);
  }
}

@media (max-width: 767px) {
  .projects-v2-b6 .projects-v2-card__shell {
    background:
      linear-gradient(138deg,
        rgba(177, 220, 255, .07),
        rgba(14, 43, 73, .30) 42%,
        rgba(8, 26, 48, .40)),
      rgba(7, 20, 37, .28);
    -webkit-backdrop-filter: blur(13px) saturate(1.16);
    backdrop-filter: blur(13px) saturate(1.16);
  }

  .projects-v2-b6 .projects-v2-card__content {
    -webkit-backdrop-filter: blur(10px) saturate(1.10);
    backdrop-filter: blur(10px) saturate(1.10);
  }

  .projects-v2-b6 .projects-v2-card__fracture {
    filter: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .projects-v2-b6 .projects-v2-card__shell::after,
  .projects-v2-b6 .projects-v2-card__fracture {
    animation: none !important;
    transition: none !important;
    transform: none !important;
  }
}


/* ==========================================================================
   B7.1 — Glass reinforcement + anti-darkening stabilization
   Scope: visual refinement + paint/compositing optimization only.
   No change to B6.7/B7 interaction mechanics.
   ========================================================================== */

.projects-v2-b6 {
  isolation: isolate;
}

.projects-v2-b6 .projects-v2-card,
.projects-v2-b6 .projects-v2-card__shell,
.projects-v2-b6 .projects-v2-card__media,
.projects-v2-b6 .projects-v2-card__screen,
.projects-v2-b6 .projects-v2-card__content {
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  will-change: transform, opacity;
}

.projects-v2-b6 .projects-v2-card__shell,
.projects-v2-b6 .projects-v2-card__content,
.projects-v2-b6 .projects-v2-card__screen {
  contain: paint;
}

.projects-v2-b6 .projects-v2-card__shell {
  border-color: rgba(214, 240, 255, .30);
  background:
    linear-gradient(134deg,
      rgba(233, 246, 255, .10) 0%,
      rgba(164, 214, 255, .06) 12%,
      rgba(27, 71, 112, .19) 42%,
      rgba(8, 23, 40, .14) 71%,
      rgba(72, 136, 198, .17) 100%),
    rgba(16, 43, 71, .12);
  box-shadow:
    0 2.2rem 5.5rem rgba(1, 8, 18, .24),
    0 0 0 1px rgba(180, 226, 255, .035),
    inset 0 1px 0 rgba(255, 255, 255, .30),
    inset 0 -1px 0 rgba(123, 194, 255, .12),
    inset 1px 0 0 rgba(255, 255, 255, .05),
    inset 0 0 4rem rgba(120, 194, 255, .03);
  -webkit-backdrop-filter: blur(18px) saturate(1.22) brightness(1.05);
  backdrop-filter: blur(18px) saturate(1.22) brightness(1.05);
}

.projects-v2-b6 .projects-v2-card__shell::before {
  opacity: .95;
  background:
    linear-gradient(116deg,
      rgba(255, 255, 255, .18) 0%,
      rgba(255, 255, 255, .08) 9%,
      rgba(255, 255, 255, .02) 15%,
      transparent 26% 72%,
      rgba(123, 202, 255, .10) 100%),
    radial-gradient(38rem 12rem at 14% -8%,
      rgba(233, 246, 255, .20),
      rgba(233, 246, 255, 0) 70%),
    radial-gradient(28rem 18rem at 88% 108%,
      rgba(102, 178, 255, .12),
      rgba(102, 178, 255, 0) 72%),
    linear-gradient(180deg,
      rgba(255, 255, 255, .02),
      rgba(255, 255, 255, 0) 18%);
}

.projects-v2-b6 .projects-v2-card__shell::after {
  opacity: .78;
  background:
    linear-gradient(104deg,
      transparent 0 10%,
      rgba(255, 255, 255, .08) 16%,
      rgba(255, 255, 255, .025) 19%,
      transparent 24% 67%,
      rgba(137, 208, 255, .06) 75%,
      transparent 82%),
    radial-gradient(42rem 8rem at 50% -4%,
      rgba(235, 247, 255, .16),
      transparent 72%),
    radial-gradient(20rem 20rem at 86% 82%,
      rgba(99, 173, 255, .05),
      transparent 66%);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, .03),
    inset 0 1.25rem 3.2rem rgba(255, 255, 255, .025),
    inset 0 -1.6rem 3.6rem rgba(81, 156, 236, .028);
}

.projects-v2-b6 .projects-v2-card__media {
  background:
    radial-gradient(circle at 48% 42%, rgba(150, 211, 255, .17), transparent 46%),
    linear-gradient(145deg, rgba(7, 20, 36, .32), rgba(10, 28, 48, .24)) !important;
}

.projects-v2-b6 .projects-v2-card__screen {
  border-color: rgba(222, 243, 255, .16) !important;
  background:
    linear-gradient(146deg,
      rgba(190, 225, 255, .04),
      rgba(6, 18, 34, .10)),
    rgba(8, 22, 39, .10) !important;
  box-shadow:
    0 1.25rem 3.5rem rgba(0, 0, 0, .12),
    inset 0 1px 0 rgba(255, 255, 255, .11),
    inset 0 0 0 1px rgba(116, 190, 255, .028) !important;
}

.projects-v2-b6 .projects-v2-card__content {
  background:
    linear-gradient(156deg,
      rgba(178, 221, 255, .07) 0%,
      rgba(42, 91, 140, .18) 24%,
      rgba(10, 30, 54, .21) 100%),
    rgba(10, 29, 50, .12) !important;
  box-shadow:
    inset 1px 0 0 rgba(215, 239, 255, .15),
    inset 0 1px 0 rgba(255, 255, 255, .04),
    inset 0 0 3rem rgba(140, 201, 255, .02) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.16) brightness(1.04);
  backdrop-filter: blur(14px) saturate(1.16) brightness(1.04);
}

.projects-v2-b6 .projects-v2-card__fracture {
  opacity: 0;
  background:
    linear-gradient(128deg,
      transparent 0 49.45%,
      rgba(237, 248, 255, .72) 49.72% 49.95%,
      transparent 50.22%) 20% 34% / 23% 1px no-repeat,
    linear-gradient(79deg,
      transparent 0 49.45%,
      rgba(206, 235, 255, .58) 49.72% 49.95%,
      transparent 50.22%) 31% 44% / 1px 19% no-repeat,
    linear-gradient(143deg,
      transparent 0 49.45%,
      rgba(229, 245, 255, .58) 49.72% 49.95%,
      transparent 50.22%) 42% 53% / 27% 1px no-repeat,
    linear-gradient(64deg,
      transparent 0 49.45%,
      rgba(194, 229, 255, .48) 49.72% 49.95%,
      transparent 50.22%) 58% 28% / 1px 22% no-repeat,
    linear-gradient(122deg,
      transparent 0 49.45%,
      rgba(222, 241, 255, .44) 49.72% 49.95%,
      transparent 50.22%) 70% 60% / 19% 1px no-repeat,
    linear-gradient(94deg,
      transparent 0 49.45%,
      rgba(188, 225, 255, .38) 49.72% 49.95%,
      transparent 50.22%) 51% 48% / 1px 11% no-repeat,
    radial-gradient(circle at 49% 48%,
      rgba(224, 244, 255, .20),
      transparent 5%);
  filter:
    drop-shadow(0 0 .35rem rgba(185, 229, 255, .12))
    drop-shadow(0 0 .95rem rgba(93, 174, 255, .05));
}

@media (hover: hover) and (pointer: fine) {
  .projects-v2-b6 .projects-v2-card:hover .projects-v2-card__shell,
  .projects-v2-b6 .projects-v2-card:focus-within .projects-v2-card__shell {
    border-color: rgba(224, 245, 255, .38);
    box-shadow:
      0 2.5rem 6rem rgba(1, 8, 18, .26),
      0 0 0 1px rgba(184, 229, 255, .04),
      inset 0 1px 0 rgba(255, 255, 255, .32),
      inset 0 -1px 0 rgba(129, 201, 255, .14),
      inset 0 0 4rem rgba(164, 219, 255, .035);
  }

  .projects-v2-b6 .projects-v2-card:hover .projects-v2-card__fracture,
  .projects-v2-b6 .projects-v2-card:focus-within .projects-v2-card__fracture {
    opacity: .76;
    filter:
      drop-shadow(0 0 .42rem rgba(193, 232, 255, .16))
      drop-shadow(0 0 1.05rem rgba(93, 174, 255, .06));
  }
}

@media (hover: none), (pointer: coarse) {
  .projects-v2-b6 .projects-v2-card__shell {
    -webkit-backdrop-filter: blur(12px) saturate(1.12) brightness(1.03);
    backdrop-filter: blur(12px) saturate(1.12) brightness(1.03);
  }

  .projects-v2-b6 .projects-v2-card__content {
    -webkit-backdrop-filter: blur(10px) saturate(1.08) brightness(1.03);
    backdrop-filter: blur(10px) saturate(1.08) brightness(1.03);
  }
}

@media (prefers-reduced-motion: reduce) {
  .projects-v2-b6 .projects-v2-card,
  .projects-v2-b6 .projects-v2-card__shell,
  .projects-v2-b6 .projects-v2-card__media,
  .projects-v2-b6 .projects-v2-card__screen,
  .projects-v2-b6 .projects-v2-card__content {
    will-change: auto;
  }
}


/* ==========================================================================
   B7.2 — Satellite Glass 2.5D
   Visual-only. Inspired by Hero V5 satellite materiality.
   B6.7 stack mechanics and B7.1 stability remain untouched.
   ========================================================================== */

.projects-v2-b6 .projects-v2-card__shell {
  position: relative;
  isolation: isolate;
  border-color: rgba(220, 243, 255, .34);
  background:
    linear-gradient(132deg,
      rgba(244, 251, 255, .115) 0%,
      rgba(180, 222, 255, .075) 10%,
      rgba(53, 112, 169, .115) 28%,
      rgba(12, 35, 60, .16) 53%,
      rgba(37, 91, 145, .13) 78%,
      rgba(153, 210, 255, .075) 100%),
    rgba(13, 36, 60, .10);
  box-shadow:
    0 2.6rem 6.4rem rgba(0, 7, 18, .24),
    0 .65rem 1.7rem rgba(3, 15, 30, .15),
    0 0 0 1px rgba(179, 226, 255, .045),
    inset 0 1px 0 rgba(255, 255, 255, .34),
    inset 1px 0 0 rgba(255, 255, 255, .07),
    inset 0 -1px 0 rgba(107, 185, 255, .15),
    inset -1px 0 0 rgba(74, 151, 231, .075),
    inset 0 0 4.5rem rgba(141, 207, 255, .028);
}

.projects-v2-b6 .projects-v2-card__shell::before {
  opacity: 1;
  background:
    linear-gradient(118deg,
      rgba(255,255,255,.23) 0%,
      rgba(255,255,255,.095) 7%,
      rgba(255,255,255,.025) 14%,
      transparent 25% 66%,
      rgba(141, 208, 255, .075) 79%,
      rgba(210, 239, 255, .10) 100%),
    radial-gradient(36rem 13rem at 12% -6%,
      rgba(244, 251, 255, .22),
      rgba(244, 251, 255, 0) 72%),
    radial-gradient(27rem 15rem at 96% 104%,
      rgba(86, 170, 255, .14),
      rgba(86, 170, 255, 0) 72%);
}

.projects-v2-b6 .projects-v2-card__shell::after {
  opacity: .92;
  background:
    linear-gradient(180deg,
      rgba(255,255,255,.095) 0,
      rgba(255,255,255,.025) 3px,
      transparent 9px),
    linear-gradient(90deg,
      rgba(255,255,255,.08) 0,
      transparent 7px 98%,
      rgba(121,196,255,.055) 100%),
    linear-gradient(108deg,
      transparent 0 13%,
      rgba(255,255,255,.095) 19%,
      rgba(255,255,255,.025) 22%,
      transparent 28% 70%,
      rgba(126,202,255,.06) 78%,
      transparent 85%),
    radial-gradient(42rem 9rem at 50% -3%,
      rgba(238, 249, 255, .18),
      transparent 72%);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.035),
    inset 0 1.35rem 3.2rem rgba(255,255,255,.03),
    inset 0 -1.7rem 3.7rem rgba(73,149,235,.035);
}

.projects-v2-b6 .projects-v2-card__media {
  background:
    radial-gradient(circle at 50% 42%, rgba(159, 217, 255, .17), transparent 45%),
    linear-gradient(146deg,
      rgba(14, 38, 65, .25),
      rgba(5, 18, 34, .18)) !important;
}

.projects-v2-b6 .projects-v2-card__screen {
  border-color: rgba(224, 243, 255, .19) !important;
  border-radius: clamp(1.05rem, 1.8vw, 1.5rem) !important;
  background:
    linear-gradient(145deg,
      rgba(242, 250, 255, .055),
      rgba(128, 194, 255, .025) 20%,
      rgba(7, 22, 40, .08) 62%,
      rgba(73, 141, 211, .03)),
    rgba(8, 22, 39, .075) !important;
  box-shadow:
    0 1.5rem 3.4rem rgba(0,0,0,.12),
    0 .3rem .8rem rgba(0,0,0,.08),
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 1px 0 0 rgba(255,255,255,.045),
    inset 0 -1px 0 rgba(101,182,255,.08),
    inset 0 0 2.6rem rgba(146,206,255,.025) !important;
  transition:
    border-color 220ms ease,
    box-shadow 220ms ease,
    transform 260ms cubic-bezier(.22,1,.36,1);
}

.projects-v2-b6 .projects-v2-card__content {
  border-left: 1px solid rgba(220, 242, 255, .13) !important;
  background:
    linear-gradient(154deg,
      rgba(226, 243, 255, .075) 0%,
      rgba(124, 185, 241, .04) 13%,
      rgba(29, 72, 115, .14) 38%,
      rgba(9, 28, 49, .15) 100%),
    rgba(10, 29, 50, .085) !important;
  box-shadow:
    inset 1px 0 0 rgba(255,255,255,.08),
    inset 0 1px 0 rgba(255,255,255,.055),
    inset 0 -1px 0 rgba(92,172,255,.05),
    inset 0 0 3.2rem rgba(147, 209, 255, .025) !important;
  transition:
    background 220ms ease,
    box-shadow 220ms ease;
}

.projects-v2-b6 .projects-v2-card__number {
  border-color: rgba(213, 239, 255, .22);
  background:
    linear-gradient(145deg,
      rgba(240, 249, 255, .09),
      rgba(76, 151, 226, .045)),
    rgba(91, 157, 229, .035);
  box-shadow:
    0 .5rem 1.2rem rgba(2, 12, 25, .12),
    inset 0 1px 0 rgba(255,255,255,.14),
    inset 0 -1px 0 rgba(82,166,255,.07);
}

.projects-v2-b6 .project-case__deliverables li {
  border-color: rgba(198, 229, 255, .18) !important;
  background:
    linear-gradient(145deg,
      rgba(231, 244, 255, .055),
      rgba(69, 139, 211, .028)),
    rgba(88, 151, 220, .025) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.09),
    inset 0 -1px 0 rgba(76,153,236,.04);
}

.projects-v2-b6 .projects-v2-card__fracture {
  filter:
    drop-shadow(0 0 .28rem rgba(207, 239, 255, .14))
    drop-shadow(0 0 .75rem rgba(97, 180, 255, .05));
}

@media (hover: hover) and (pointer: fine) {
  .projects-v2-b6 .projects-v2-card:hover .projects-v2-card__shell,
  .projects-v2-b6 .projects-v2-card:focus-within .projects-v2-card__shell {
    border-color: rgba(231, 247, 255, .43);
    box-shadow:
      0 2.8rem 6.8rem rgba(0,7,18,.27),
      0 .8rem 2rem rgba(3,15,30,.16),
      0 0 0 1px rgba(192,234,255,.055),
      inset 0 1px 0 rgba(255,255,255,.39),
      inset 1px 0 0 rgba(255,255,255,.08),
      inset 0 -1px 0 rgba(112,193,255,.17),
      inset 0 0 4.8rem rgba(158,218,255,.035);
  }

  .projects-v2-b6 .projects-v2-card:hover .projects-v2-card__screen,
  .projects-v2-b6 .projects-v2-card:focus-within .projects-v2-card__screen {
    transform: translate3d(0, -2px, 0) scale(.998);
    border-color: rgba(232, 247, 255, .24) !important;
    box-shadow:
      0 1.8rem 3.8rem rgba(0,0,0,.14),
      0 .4rem 1rem rgba(0,0,0,.08),
      inset 0 1px 0 rgba(255,255,255,.19),
      inset 1px 0 0 rgba(255,255,255,.055),
      inset 0 -1px 0 rgba(111,191,255,.09),
      inset 0 0 3rem rgba(166,220,255,.035) !important;
  }

  .projects-v2-b6 .projects-v2-card:hover .projects-v2-card__content,
  .projects-v2-b6 .projects-v2-card:focus-within .projects-v2-card__content {
    background:
      linear-gradient(154deg,
        rgba(238, 248, 255, .09) 0%,
        rgba(139, 198, 250, .05) 13%,
        rgba(34, 80, 126, .145) 38%,
        rgba(9, 28, 49, .15) 100%),
      rgba(10, 29, 50, .085) !important;
  }

  .projects-v2-b6 .projects-v2-card:hover .projects-v2-card__shell::after,
  .projects-v2-b6 .projects-v2-card:focus-within .projects-v2-card__shell::after {
    opacity: 1;
    transform: translate3d(.28%, -.18%, 0);
  }

  .projects-v2-b6 .projects-v2-card:hover .projects-v2-card__fracture,
  .projects-v2-b6 .projects-v2-card:focus-within .projects-v2-card__fracture {
    opacity: .72;
  }
}

@media (max-width: 767px) {
  .projects-v2-b6 .projects-v2-card__shell {
    background:
      linear-gradient(136deg,
        rgba(241, 250, 255, .09),
        rgba(113, 184, 244, .04) 16%,
        rgba(24, 66, 107, .15) 48%,
        rgba(9, 28, 49, .17)),
      rgba(12, 34, 58, .11);
    border-color: rgba(215, 240, 255, .27);
  }

  .projects-v2-b6 .projects-v2-card__content {
    border-left: 0 !important;
    border-top: 1px solid rgba(219, 241, 255, .12) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .projects-v2-b6 .projects-v2-card__screen,
  .projects-v2-b6 .projects-v2-card__content,
  .projects-v2-b6 .projects-v2-card__shell::after {
    transition: none !important;
    transform: none !important;
  }
}


/* ==========================================================================
   B7.3 — Satellite depth correction
   Goal: actual 2.5D materiality + readable front card.
   Mechanics/runtime remain untouched.
   ========================================================================== */

/* Real depth cue: each project gets two glass plates behind the front shell,
   echoing the Hero satellite construction without adding a new runtime. */
.projects-v2-b6 .project-case.projects-v2-card {
  isolation: isolate;
  perspective: 1400px;
  transform-style: preserve-3d;
}

.projects-v2-b6 .project-case.projects-v2-card::before,
.projects-v2-b6 .project-case.projects-v2-card::after {
  content: "";
  position: absolute;
  pointer-events: none;
  left: clamp(.65rem, 1.1vw, 1rem);
  right: clamp(.65rem, 1.1vw, 1rem);
  top: clamp(.45rem, .85vw, .75rem);
  bottom: clamp(-.8rem, -1vw, -.55rem);
  border-radius: clamp(1.45rem, 2.3vw, 2.25rem);
  transform-origin: 50% 50%;
}

.projects-v2-b6 .project-case.projects-v2-card::before {
  z-index: 0;
  border: 1px solid rgba(155, 216, 255, .23);
  background:
    linear-gradient(145deg,
      rgba(76, 151, 220, .22),
      rgba(4, 19, 36, .74) 58%,
      rgba(20, 73, 126, .34));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.15),
    inset 0 -1px 0 rgba(76,171,255,.11),
    0 1.2rem 2.9rem rgba(0,0,0,.22);
  opacity: .84;
  transform: translate3d(0, .42rem, -18px) scale(.993);
}

.projects-v2-b6 .project-case.projects-v2-card::after {
  z-index: -1;
  left: clamp(1rem, 1.5vw, 1.4rem);
  right: clamp(1rem, 1.5vw, 1.4rem);
  top: clamp(.8rem, 1.25vw, 1.15rem);
  bottom: clamp(-1.25rem, -1.45vw, -.9rem);
  border: 1px solid rgba(112, 195, 255, .15);
  background:
    linear-gradient(145deg,
      rgba(40, 106, 173, .16),
      rgba(2, 13, 27, .78) 62%,
      rgba(15, 55, 100, .26));
  box-shadow:
    0 1.45rem 3.4rem rgba(0,0,0,.26),
    inset 0 1px 0 rgba(255,255,255,.075);
  opacity: .54;
  transform: translate3d(0, .72rem, -34px) scale(.987);
}

.projects-v2-b6 .projects-v2-card__shell {
  position: relative;
  z-index: 2;
  transform-style: preserve-3d;
  border-color: rgba(203, 235, 255, .36);
  background:
    radial-gradient(circle at 16% 0%,
      rgba(255,255,255,.13),
      transparent 31%),
    linear-gradient(145deg,
      rgba(32, 88, 148, .48),
      rgba(4, 18, 35, .74) 56%,
      rgba(16, 58, 105, .48));
  color: #f4f9ff;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.31),
    inset 0 -1px 0 rgba(78,178,255,.16),
    inset 1px 0 0 rgba(214,242,255,.09),
    0 1.55rem 3.8rem rgba(0,0,0,.27),
    0 0 2rem rgba(60,160,255,.085);
  -webkit-backdrop-filter: blur(17px) saturate(148%);
  backdrop-filter: blur(17px) saturate(148%);
  transition:
    border-color 200ms ease,
    box-shadow 240ms ease,
    transform 300ms cubic-bezier(.17,.77,.2,1);
}

/* Front surface is intentionally denser than B7.2.
   We keep glass, but the active/top card no longer exposes readable copy
   from the cards underneath. */
.projects-v2-b6 .projects-v2-card__content {
  border-left: 1px solid rgba(208, 236, 255, .18) !important;
  background:
    radial-gradient(circle at 18% 0%,
      rgba(214, 239, 255, .065),
      transparent 31%),
    linear-gradient(154deg,
      rgba(38, 88, 137, .60) 0%,
      rgba(10, 38, 69, .77) 42%,
      rgba(5, 24, 46, .84) 100%) !important;
  box-shadow:
    inset 1px 0 0 rgba(255,255,255,.10),
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 -1px 0 rgba(85,171,255,.06),
    -1.25rem 0 3rem rgba(0, 9, 20, .08) !important;
  -webkit-backdrop-filter: blur(11px) saturate(1.12);
  backdrop-filter: blur(11px) saturate(1.12);
}

/* The project screenshot behaves like a raised inner glass panel. */
.projects-v2-b6 .projects-v2-card__screen {
  border-color: rgba(213, 239, 255, .22) !important;
  background:
    linear-gradient(145deg,
      rgba(219, 242, 255, .045),
      rgba(6, 22, 40, .20)),
    rgba(5, 18, 33, .24) !important;
  box-shadow:
    0 1.45rem 3.5rem rgba(0,0,0,.20),
    0 .35rem .9rem rgba(0,0,0,.12),
    inset 0 1px 0 rgba(255,255,255,.15),
    inset 0 -1px 0 rgba(92,174,255,.07),
    inset 0 0 2.8rem rgba(136, 205, 255, .025) !important;
}

/* Reflection now reads as a narrow surface highlight, not a transparent wash. */
.projects-v2-b6 .projects-v2-card__shell::before {
  opacity: .68;
  background:
    linear-gradient(111deg,
      transparent 12%,
      rgba(255,255,255,.13) 36%,
      rgba(142,216,255,.035) 49%,
      transparent 65%),
    radial-gradient(32rem 11rem at 15% -7%,
      rgba(235, 248, 255, .16),
      transparent 72%);
}

.projects-v2-b6 .projects-v2-card__shell::after {
  opacity: .46;
  background:
    linear-gradient(180deg,
      rgba(255,255,255,.085) 0,
      rgba(255,255,255,.025) 3px,
      transparent 10px),
    linear-gradient(90deg,
      rgba(255,255,255,.055) 0,
      transparent 8px 98%,
      rgba(111,190,255,.05) 100%);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.025),
    inset 0 1rem 2.6rem rgba(255,255,255,.018);
}

@media (hover: hover) and (pointer: fine) {
  .projects-v2-b6 .projects-v2-card:hover .projects-v2-card__shell,
  .projects-v2-b6 .projects-v2-card:focus-within .projects-v2-card__shell {
    transform: translate3d(0, -.22rem, 0) scale(.998);
    border-color: rgba(220, 246, 255, .58);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.38),
      inset 0 -1px 0 rgba(84,184,255,.19),
      inset 1px 0 0 rgba(214,242,255,.11),
      0 1.85rem 4.2rem rgba(0,0,0,.30),
      0 0 2.15rem rgba(65,169,255,.18);
  }

  .projects-v2-b6 .projects-v2-card:hover::before,
  .projects-v2-b6 .projects-v2-card:focus-within::before {
    transform: translate3d(0, .62rem, -22px) scale(.991);
    border-color: rgba(173, 226, 255, .31);
  }

  .projects-v2-b6 .projects-v2-card:hover::after,
  .projects-v2-b6 .projects-v2-card:focus-within::after {
    transform: translate3d(0, 1rem, -40px) scale(.984);
    opacity: .62;
  }
}

@media (max-width: 767px) {
  .projects-v2-b6 .project-case.projects-v2-card {
    perspective: 1100px;
  }

  .projects-v2-b6 .project-case.projects-v2-card::before {
    bottom: -.5rem;
    transform: translate3d(0, .28rem, -14px) scale(.994);
  }

  .projects-v2-b6 .project-case.projects-v2-card::after {
    bottom: -.8rem;
    opacity: .42;
    transform: translate3d(0, .48rem, -26px) scale(.989);
  }

  .projects-v2-b6 .projects-v2-card__content {
    border-left: 0 !important;
    border-top: 1px solid rgba(208, 236, 255, .15) !important;
    background:
      linear-gradient(154deg,
        rgba(34, 79, 125, .66),
        rgba(7, 31, 58, .82) 52%,
        rgba(4, 22, 42, .87)) !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .projects-v2-b6 .projects-v2-card__shell,
  .projects-v2-b6 .project-case.projects-v2-card::before,
  .projects-v2-b6 .project-case.projects-v2-card::after {
    transition: none !important;
  }
}


/* ==========================================================================
   B7.4 — Projects satellite UI language
   Goal: make project cards + archive CTA visually closer to Hero satellites.
   No runtime/stack logic changes.
   ========================================================================== */

.projects-v2-b6 {
  --pp-sat-line: rgba(214, 239, 255, .74);
  --pp-sat-line-soft: rgba(171, 221, 255, .34);
  --pp-sat-fill-top: rgba(15, 43, 77, .92);
  --pp-sat-fill-bottom: rgba(7, 18, 34, .95);
  --pp-sat-core: rgba(4, 12, 25, .88);
  --pp-sat-glow: rgba(95, 183, 255, .26);
  --pp-sat-text-soft: rgba(206, 224, 241, .74);
}

/* ----- Main project cards: dark core + luminous perimeter like the hero tags ----- */
.projects-v2-b6 .project-case.projects-v2-card {
  isolation: isolate;
}

.projects-v2-b6 .project-case.projects-v2-card::before {
  border-color: rgba(220, 244, 255, .28);
  background:
    radial-gradient(30rem 10rem at 20% -6%, rgba(255,255,255,.09), transparent 70%),
    linear-gradient(150deg,
      rgba(29, 82, 133, .22) 0%,
      rgba(4, 16, 31, .78) 56%,
      rgba(16, 56, 97, .24) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    0 1.25rem 3rem rgba(0,0,0,.18);
  opacity: .72;
}

.projects-v2-b6 .project-case.projects-v2-card::after {
  border-color: rgba(141, 212, 255, .16);
  background:
    linear-gradient(150deg,
      rgba(19, 70, 121, .11) 0%,
      rgba(2, 11, 22, .78) 60%,
      rgba(14, 49, 84, .12) 100%);
  box-shadow:
    0 1.4rem 3rem rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.06);
  opacity: .42;
}

.projects-v2-b6 .projects-v2-card__shell {
  position: relative;
  border-radius: clamp(1.85rem, 2.35vw, 2.4rem);
  border: 1px solid rgba(219, 242, 255, .34);
  background:
    radial-gradient(circle at 84% 18%, rgba(108, 189, 255, .06), transparent 22%),
    radial-gradient(circle at 16% 0%, rgba(255,255,255,.10), transparent 24%),
    linear-gradient(180deg,
      rgba(18, 49, 86, .92) 0%,
      rgba(8, 22, 43, .95) 45%,
      rgba(3, 10, 21, .98) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.28),
    inset 0 0 0 1px rgba(104,185,255,.05),
    inset 0 -1px 0 rgba(111, 188, 255, .14),
    0 0 0 1px rgba(86, 169, 255, .06),
    0 .55rem 1.2rem rgba(0,0,0,.16),
    0 1.6rem 4rem rgba(0,0,0,.26),
    0 0 2.1rem rgba(62, 159, 255, .12);
  -webkit-backdrop-filter: blur(12px) saturate(122%);
  backdrop-filter: blur(12px) saturate(122%);
}

/* Outer luminous ring */
.projects-v2-b6 .projects-v2-card__shell::before {
  opacity: 1;
  inset: .35rem;
  border-radius: inherit;
  background:
    linear-gradient(180deg, rgba(255,255,255,.20), rgba(255,255,255,0) 10%),
    radial-gradient(circle at 82% 18%, rgba(169, 223, 255, .09), transparent 16%),
    linear-gradient(120deg,
      rgba(255,255,255,.19) 0%,
      rgba(255,255,255,.04) 16%,
      transparent 30% 74%,
      rgba(141,212,255,.07) 100%);
  box-shadow:
    inset 0 0 0 1px rgba(218, 241, 255, .18),
    inset 0 1px 0 rgba(255,255,255,.17),
    0 0 0 1px rgba(102, 189, 255, .10);
  mix-blend-mode: screen;
}

/* Inner satellite capsule feeling */
.projects-v2-b6 .projects-v2-card__shell::after {
  opacity: .95;
  inset: .95rem;
  border-radius: clamp(1.45rem, 2vw, 1.8rem);
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), transparent 8%),
    linear-gradient(145deg,
      rgba(9, 24, 42, .62) 0%,
      rgba(2, 8, 17, .00) 32%,
      rgba(2, 8, 17, .00) 68%,
      rgba(80, 170, 255, .04) 100%);
  box-shadow:
    inset 0 0 0 1px rgba(192, 232, 255, .08),
    inset 0 1px 0 rgba(255,255,255,.05),
    0 0 0 1px rgba(19, 52, 88, .12);
}

/* Darker, more readable front slab */
.projects-v2-b6 .projects-v2-card__content {
  position: relative;
  z-index: 3;
  border-left: 1px solid rgba(190, 229, 255, .18) !important;
  background:
    radial-gradient(circle at 90% 22%, rgba(101, 187, 255, .07), transparent 16%),
    linear-gradient(180deg,
      rgba(20, 54, 94, .86) 0%,
      rgba(8, 28, 51, .93) 42%,
      rgba(4, 15, 29, .97) 100%) !important;
  box-shadow:
    inset 1px 0 0 rgba(255,255,255,.09),
    inset 0 1px 0 rgba(255,255,255,.05),
    inset 0 -1px 0 rgba(81, 165, 241, .07),
    -1rem 0 2.1rem rgba(0, 9, 20, .08) !important;
  -webkit-backdrop-filter: blur(7px);
  backdrop-filter: blur(7px);
}

.projects-v2-b6 .projects-v2-card__screen {
  position: relative;
  z-index: 2;
  border-radius: clamp(1.45rem, 2vw, 1.8rem);
  border: 1px solid rgba(209, 238, 255, .16) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.03), transparent 9%),
    linear-gradient(145deg, rgba(9, 28, 50, .54), rgba(3, 10, 20, .14)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    inset 0 0 0 1px rgba(133, 207, 255, .05),
    0 .5rem 1.1rem rgba(0,0,0,.12),
    0 1.5rem 3rem rgba(0,0,0,.18) !important;
}

/* Typographic contrast */
.projects-v2-b6 .project-case__title {
  color: #f8fbff;
  text-shadow: 0 1px 0 rgba(0,0,0,.08);
}

.projects-v2-b6 .project-case__intervention {
  color: rgba(221, 232, 244, .82);
}

.projects-v2-b6 .project-case__status {
  color: rgba(142, 206, 255, .96);
}

.projects-v2-b6 .project-case__deliverables li {
  color: rgba(228, 240, 252, .88);
  border-color: rgba(140, 205, 255, .22);
  background:
    linear-gradient(180deg, rgba(37, 85, 137, .42), rgba(10, 27, 47, .54));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 0 0 1px rgba(77, 158, 245, .06);
}

.projects-v2-b6 .project-case__link {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .82rem 1.15rem .82rem 0;
  color: #f7fbff;
}

.projects-v2-b6 .project-case__link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -.18rem;
  width: 2.2rem;
  height: 1px;
  background: linear-gradient(90deg, rgba(113,193,255,.95), rgba(113,193,255,0));
  box-shadow: 0 0 .45rem rgba(113,193,255,.38);
}

/* Small right-end dot for satellite language */
.projects-v2-b6 .projects-v2-card__content::after {
  content: "";
  position: absolute;
  top: clamp(1.15rem, 1.5vw, 1.35rem);
  right: clamp(1.1rem, 1.4vw, 1.25rem);
  width: .78rem;
  height: .78rem;
  border-radius: 999px;
  background:
    radial-gradient(circle at 38% 38%, rgba(255,255,255,.98), rgba(199,235,255,.9) 34%, rgba(116,196,255,.62) 58%, rgba(91,173,255,.16) 100%);
  box-shadow:
    0 0 0 1px rgba(210, 240, 255, .18),
    0 0 .6rem rgba(149, 217, 255, .38);
  opacity: .92;
}

/* ----- Archive button closer to hero satellite pills ----- */
.projects-v2-b6__button {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .8rem;
  min-height: 3.7rem;
  padding: 0 2.1rem;
  border-radius: 999px;
  border: 1px solid rgba(218, 241, 255, .36);
  color: #f8fbff;
  background:
    radial-gradient(circle at 85% 50%, rgba(124, 200, 255, .08), transparent 16%),
    radial-gradient(circle at 16% 0%, rgba(255,255,255,.11), transparent 26%),
    linear-gradient(180deg,
      rgba(18, 56, 97, .92) 0%,
      rgba(8, 26, 48, .96) 52%,
      rgba(5, 16, 30, .98) 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.26),
    inset 0 -1px 0 rgba(103, 183, 255, .16),
    inset 0 0 0 1px rgba(106, 188, 255, .05),
    0 0 0 1px rgba(95, 178, 255, .08),
    0 .7rem 1.5rem rgba(0,0,0,.16),
    0 1.5rem 3rem rgba(0,0,0,.22),
    0 0 1.4rem rgba(62, 159, 255, .14);
  text-shadow: 0 1px 0 rgba(0,0,0,.09);
  overflow: hidden;
}

.projects-v2-b6__button::before {
  content: "";
  position: absolute;
  inset: .28rem;
  border-radius: inherit;
  background:
    linear-gradient(180deg, rgba(255,255,255,.15), transparent 12%),
    linear-gradient(120deg,
      rgba(255,255,255,.18) 0%,
      rgba(255,255,255,.03) 16%,
      transparent 32% 74%,
      rgba(135, 212, 255, .08) 100%);
  box-shadow:
    inset 0 0 0 1px rgba(219, 242, 255, .16),
    inset 0 1px 0 rgba(255,255,255,.10);
  pointer-events: none;
  mix-blend-mode: screen;
}

.projects-v2-b6__button::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 1rem;
  width: .78rem;
  height: .78rem;
  transform: translateY(-50%);
  border-radius: 999px;
  background:
    radial-gradient(circle at 38% 38%, rgba(255,255,255,.98), rgba(199,235,255,.92) 32%, rgba(116,196,255,.62) 58%, rgba(91,173,255,.18) 100%);
  box-shadow:
    0 0 0 1px rgba(214, 239, 255, .18),
    0 0 .6rem rgba(149, 217, 255, .42);
  pointer-events: none;
}

.projects-v2-b6__button span {
  position: relative;
  z-index: 1;
}

@media (hover: hover) and (pointer: fine) {
  .projects-v2-b6 .projects-v2-card:hover .projects-v2-card__shell,
  .projects-v2-b6 .projects-v2-card:focus-within .projects-v2-card__shell {
    border-color: rgba(231, 247, 255, .52);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.35),
      inset 0 0 0 1px rgba(112,193,255,.07),
      inset 0 -1px 0 rgba(120, 197, 255, .18),
      0 0 0 1px rgba(126, 204, 255, .10),
      0 .9rem 1.8rem rgba(0,0,0,.18),
      0 1.9rem 4.3rem rgba(0,0,0,.28),
      0 0 2.4rem rgba(76, 166, 255, .18);
  }

  .projects-v2-b6__button:hover,
  .projects-v2-b6__button:focus-visible {
    border-color: rgba(236, 248, 255, .56);
    transform: translateY(-1px);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.32),
      inset 0 -1px 0 rgba(122, 200, 255, .20),
      inset 0 0 0 1px rgba(114, 193, 255, .07),
      0 0 0 1px rgba(118, 197, 255, .10),
      0 .8rem 1.6rem rgba(0,0,0,.18),
      0 1.75rem 3.3rem rgba(0,0,0,.24),
      0 0 1.8rem rgba(70, 166, 255, .20);
  }
}

@media (max-width: 767px) {
  .projects-v2-b6 .projects-v2-card__content {
    border-left: 0 !important;
    border-top: 1px solid rgba(190, 229, 255, .14) !important;
  }

  .projects-v2-b6 .projects-v2-card__content::after {
    top: 1rem;
    right: 1rem;
  }

  .projects-v2-b6__button {
    width: min(100%, 22rem);
    min-height: 3.45rem;
    padding-inline: 1.35rem 2.35rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .projects-v2-b6__button {
    transition: none !important;
    transform: none !important;
  }
}


/* ==========================================================================
   B7.5 — Fast-scroll compositing stabilization
   Scope: performance only. B7.4 visual language and B6.7 mechanics preserved.
   ========================================================================== */

/* Avoid promoting every large sticky child to its own persistent GPU layer.
   The intro keeps its own small transform layers; the cards do not need them. */
.projects-v2-b6 .projects-v2-card,
.projects-v2-b6 .projects-v2-card__shell,
.projects-v2-b6 .projects-v2-card__media,
.projects-v2-b6 .projects-v2-card__screen,
.projects-v2-b6 .projects-v2-card__content {
  will-change: auto !important;
}

/* The satellite look is already painted by gradients, borders and shadows.
   Removing nested backdrop filters avoids repeated sampling of three stacked
   sticky cards during high-velocity scroll. */
.projects-v2-b6 .projects-v2-card__shell,
.projects-v2-b6 .projects-v2-card__screen,
.projects-v2-b6 .projects-v2-card__content,
.projects-v2-b6__button {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Keep the atmospheric backdrop, but render it as gradients rather than
   oversized filtered layers. */
.section-projects--v2-b6::before,
.section-projects--v2-b6::after {
  filter: none !important;
}

.section-projects--v2-b6::before {
  opacity: .88;
}

.section-projects--v2-b6::after {
  opacity: .82;
}

/* Replace the large blurred glow with a radial paint. */
.projects-v2-b6 .projects-v2-card__glow {
  filter: none !important;
  width: 68%;
  left: -21%;
  bottom: -44%;
  opacity: .72;
  background:
    radial-gradient(circle,
      rgba(121,203,255,.115) 0%,
      rgba(77,164,255,.055) 34%,
      transparent 69%);
}

/* The blurred project-background plate is expensive on three overlapping
   sticky cards. Keep the contextual image, but remove the live blur. */
.projects-v2-b6 .projects-v2-card__media::before {
  filter: none !important;
  inset: -4%;
  opacity: .18;
  transform: scale(1.035);
  background-image:
    linear-gradient(145deg,
      rgba(2,8,15,.58),
      rgba(3,14,28,.74)),
    var(--pp-project-scene-image, none);
}

/* Screen blend modes can trigger extra offscreen compositing. Recreate the
   same luminous language with normal alpha compositing. */
.projects-v2-b6 .projects-v2-card__fracture,
.projects-v2-b6 .projects-v2-card__shell::before,
.projects-v2-b6__button::before {
  mix-blend-mode: normal !important;
}

/* Keep the main sticky cards as isolated paint groups, but do not ask the
   browser to create additional transform layers. */
.projects-v2-b6 .projects-v2-card__shell,
.projects-v2-b6 .projects-v2-card__screen,
.projects-v2-b6 .projects-v2-card__content {
  contain: paint;
}

/* Mobile gets the same simplified compositing path. */
@media (max-width: 767px) {
  .projects-v2-b6 .projects-v2-card__media::before {
    opacity: .14;
    transform: scale(1.02);
  }

  .projects-v2-b6 .projects-v2-card__glow {
    opacity: .55;
  }
}


/* ==========================================================================
   B7.6.1 — SAFE Hero → Projects bridge
   Built from stable B7.5. No opaque paint over the negative-margin overlap.
   No layout, Hero or runtime changes.
   ========================================================================== */

/* Critical rule: the overlap with Hero remains fully transparent.
   The Projects colour only starts AFTER the overlap has cleared. */
.section-projects--v2-b6 {
  background:
    linear-gradient(180deg,
      rgba(2,10,19,0) 0,
      rgba(2,10,19,0) 8rem,
      rgba(3,14,26,.08) 12rem,
      rgba(4,20,36,.18) 17rem,
      rgba(6,29,50,.32) 23rem,
      rgba(9,42,72,.52) 30rem,
      rgba(12,49,84,.72) 38rem,
      rgba(19,66,109,.88) 48rem,
      #174f80 60rem,
      #1a588d 72rem,
      #123d67 82%,
      #0a2744 94%,
      #061626 100%);
}

/* Remove the big top ellipse that was reading as a separate dark/blue blob.
   Keep only a very soft atmospheric lift below the handoff. */
.section-projects--v2-b6::before {
  height: 34rem;
  background:
    linear-gradient(180deg,
      transparent 0,
      transparent 20%,
      rgba(92,174,247,.028) 52%,
      rgba(92,174,247,.045) 72%,
      transparent 100%);
  opacity: 1;
}

/* Lower ambience remains away from the Hero boundary. */
.section-projects--v2-b6::after {
  inset: 34% -12% 3%;
  opacity: .72;
}

@media (max-width: 767px) {
  .section-projects--v2-b6 {
    background:
      linear-gradient(180deg,
        rgba(2,10,19,0) 0,
        rgba(2,10,19,0) 4.75rem,
        rgba(3,14,26,.08) 7rem,
        rgba(4,20,36,.18) 10rem,
        rgba(6,29,50,.32) 14rem,
        rgba(9,42,72,.50) 18rem,
        rgba(12,49,84,.70) 23rem,
        rgba(19,66,109,.86) 30rem,
        #174f80 38rem,
        #185587 47rem,
        #123d67 76%,
        #0a2744 92%,
        #061626 100%);
  }

  .section-projects--v2-b6::before {
    height: 22rem;
    background:
      linear-gradient(180deg,
        transparent 0,
        transparent 18%,
        rgba(92,174,247,.025) 55%,
        rgba(92,174,247,.038) 74%,
        transparent 100%);
  }
}

/* ==================================================================
 * Projects B10.3 — 0.9.89 archive CTA interaction polish
 * The footer CTA keeps its satellite shape at rest and gains the same
 * unmistakable luminous feedback language as the diagnostic action.
 * ================================================================== */
@media (prefers-reduced-motion: no-preference) {
  .projects-v2-b6__button {
    transition:
      transform 190ms cubic-bezier(.18,.78,.2,1),
      border-color 180ms ease,
      background 220ms ease,
      box-shadow 220ms ease;
  }

  .projects-v2-b6__button::after {
    transition: transform 190ms cubic-bezier(.18,.78,.2,1), box-shadow 190ms ease;
  }
}

@media (hover: hover) and (pointer: fine) {
  .projects-v2-b6__button:is(:hover, :focus-visible) {
    border-color: rgba(214, 241, 255, .72);
    background:
      radial-gradient(circle at 26% 0%, rgba(255,255,255,.24), transparent 35%),
      linear-gradient(180deg, #37a1ff 0%, #176ff3 66%, #0a58dc 100%);
    transform: translateY(-2px) scale(1.012);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.40),
      inset 0 -1px 0 rgba(5,56,148,.34),
      0 .32rem 0 rgba(5,62,163,.58),
      0 1rem 2.2rem rgba(7,69,170,.34),
      0 0 2.8rem rgba(86,192,255,.34);
  }

  .projects-v2-b6__button:is(:hover, :focus-visible)::after {
    transform: translateY(-50%) scale(1.18);
    box-shadow:
      0 0 0 1px rgba(234, 248, 255, .42),
      0 0 1rem rgba(174, 228, 255, .82);
  }
}

/* ==================================================================
 * Projects V2 — 0.9.92 desktop pointer ownership guard
 *
 * The section intentionally overlaps the Hero with a negative top
 * margin, but its intro/scene is purely visual. Keep that overlap
 * transparent to pointer hit-testing so Hero CTAs remain clickable.
 * Interactive project cards and the archive footer opt back in.
 * ================================================================== */
@media (min-width: 50.0625rem) {
  .section-projects--v2-b6 {
    pointer-events: none;
  }

  .section-projects--v2-b6 .projects-v2-b6__stack,
  .section-projects--v2-b6 .projects-v2-b6__footer {
    pointer-events: auto;
  }
}



/* ==================================================================
 * Projects B10.3 — 0.9.94 archive CTA neon-zone parity
 * Match the wide background illumination used by the capabilities
 * diagnostic CTA, while preserving the archive button's own shape.
 * ================================================================== */
.projects-v2-b6__footer {
  isolation: isolate;
  overflow: visible;
}

.projects-v2-b6__footer::before,
.projects-v2-b6__footer::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  border-radius: 50%;
  pointer-events: none;
  opacity: 0;
}

.projects-v2-b6__footer::after {
  z-index: -2;
  width: min(116rem, 138vw);
  height: clamp(19rem, 34vw, 31rem);
  transform: translate(-50%, -50%) scale(.88);
  background:
    radial-gradient(ellipse at 50% 54%,
      rgba(90, 186, 255, .34) 0%,
      rgba(49, 142, 245, .20) 24%,
      rgba(28, 103, 196, .10) 44%,
      rgba(10, 45, 92, .03) 59%,
      rgba(6, 29, 58, 0) 78%);
  filter: saturate(1.14) blur(.15rem);
  transition:
    opacity 260ms ease,
    transform 520ms cubic-bezier(.16,.82,.18,1),
    filter 360ms ease;
}

.projects-v2-b6__footer::before {
  z-index: -3;
  width: min(128rem, 156vw);
  height: clamp(20rem, 38vw, 35rem);
  transform: translate(-50%, -50%) scale(.84);
  background:
    radial-gradient(ellipse at 50% 52%,
      rgba(112, 199, 255, .10) 0%,
      rgba(46, 138, 242, .09) 30%,
      rgba(18, 72, 139, .05) 46%,
      rgba(5, 22, 44, 0) 76%);
  transition:
    opacity 260ms ease,
    transform 560ms cubic-bezier(.16,.82,.18,1);
}

.projects-v2-b6__footer:has(.projects-v2-b6__button:hover)::after,
.projects-v2-b6__footer:focus-within::after {
  opacity: 1;
  filter: saturate(1.24) blur(0);
  transform: translate(-50%, -50%) scale(1.18);
}

.projects-v2-b6__footer:has(.projects-v2-b6__button:hover)::before,
.projects-v2-b6__footer:focus-within::before {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1.22);
}

@media (hover: hover) and (pointer: fine) {
  .projects-v2-b6__button:is(:hover, :focus-visible) {
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.28),
      inset 0 -1px 0 rgba(105, 194, 255, .18),
      0 1.4rem 2.8rem rgba(0,0,0,.18),
      0 0 2.8rem rgba(72, 174, 255, .34),
      0 0 6.6rem rgba(55, 148, 255, .24),
      0 0 11rem rgba(47, 136, 255, .16);
  }
}

@media (max-width: 48rem) {
  .projects-v2-b6__footer::after {
    width: 144vw;
    height: 19rem;
  }

  .projects-v2-b6__footer::before {
    width: 156vw;
    height: 20rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .projects-v2-b6__footer::before,
  .projects-v2-b6__footer::after {
    transition: none !important;
    transform: translate(-50%, -50%) scale(1) !important;
  }
}

/* ==================================================================
 * Projects B10.3 — 0.9.98 desktop intro runway
 * Give the Projects heading a real hold before its lateral exit so
 * fast native scroll does not erase the intro before it can be read.
 * Cards keep their own sticky behavior; only their first appearance
 * is delayed enough to preserve the intro's readable phase.
 * ================================================================== */
@media (min-width: 50.0625rem) and (prefers-reduced-motion: no-preference) {
  .projects-v2-b6__scene {
    min-height: 200svh;
  }

  .projects-v2-b6__stack {
    margin-top: -70svh;
  }
}

