/* MATCH THE HERO (14 Nov 2026): How it works + Packages get the same
   near-black, warm look as the 3D hero and About. Nothing is remade:
   the film frames and the package cards stay as they are; only the
   colour grade, edges and background change. No text changes. */

/* 1. HOW IT WORKS: no rounded "new page" edge, film graded darker and warmer,
      and its edges melt into black so it flows out of the hero */
#how{clip-path:none!important;background:#050404!important}
#how .hf-pin{background:#050404}
#how #hcv{filter:brightness(.82) contrast(1.08) saturate(.85) sepia(.12)}
#how .hf-veil{background:
  linear-gradient(180deg,#050404 0%,rgba(5,4,4,.55) 14%,rgba(5,4,4,0) 32%,rgba(5,4,4,0) 55%,rgba(5,4,4,.85) 100%),
  radial-gradient(120% 90% at 50% 50%,rgba(5,4,4,0) 55%,rgba(5,4,4,.75) 100%)!important}

/* 2. PACKAGES: the same black room as the hero, with the warm Colombo skyline
      lines low behind the cards and an orange floor glow (no photo, no blue) */
#packages #show{background:#050404!important}
#packages #show::before{inset:auto 0 18% 0!important;height:34%!important;filter:none!important;
  background:url(../assets/3d/sky-line.webp) center bottom/auto 100% repeat-x!important;
  opacity:.32;-webkit-mask:linear-gradient(90deg,transparent,#000 18%,#000 82%,transparent);mask:linear-gradient(90deg,transparent,#000 18%,#000 82%,transparent)}
#packages #show::after{height:40%!important;background:
  radial-gradient(55% 60% at 50% 100%,rgba(255,90,20,.22) 0%,rgba(255,90,20,0) 70%),
  linear-gradient(180deg,transparent,rgba(5,4,4,.7))!important}
