/* Nordic BioBuilt — cinematic site intro (v2.5.8) */
.nbb-intro{display:none}
html.nbb-intro-active,html.nbb-intro-active body{overflow:hidden!important}

html.nbb-intro-active .nbb-intro{
  --nbb-intro-bloom:1.2s;
  display:block;position:fixed;inset:0;z-index:2147483000;overflow:hidden;
  background:#16241a var(--nbb-intro-poster) center/cover no-repeat;
  opacity:1;transition:opacity 1.05s cubic-bezier(.45,0,.2,1);
  -webkit-tap-highlight-color:transparent;
}
@media (orientation:portrait){html.nbb-intro-active .nbb-intro{background-image:var(--nbb-intro-poster-portrait)}}

.nbb-intro-video{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;
  display:block;background:transparent;opacity:0;transform:scale(1);transform-origin:52% 44%;
  transition:opacity .45s ease,transform var(--nbb-intro-bloom) cubic-bezier(.55,0,.8,.25),filter var(--nbb-intro-bloom) ease-in;
}
.nbb-intro.is-playing .nbb-intro-video{opacity:1}

/* soft cinematic edge while the gates open, gone once the light takes over */
.nbb-intro-vignette{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 75% 70% at 50% 48%,transparent 55%,rgba(8,14,10,.42) 100%);transition:opacity .6s ease}

/* the light: grows out of the sun and fills the screen */
.nbb-intro-bloom{
  position:absolute;inset:-15%;pointer-events:none;opacity:0;transform:scale(.55);transform-origin:52% 44%;
  background:radial-gradient(circle at 52% 44%,#fffefa 0%,#fff8e6 26%,#fbedc9 55%,#f3e1b4 80%,#efd9a6 100%);
  transition:opacity var(--nbb-intro-bloom) cubic-bezier(.55,0,.7,.4),transform var(--nbb-intro-bloom) cubic-bezier(.2,.65,.3,1);
}
.nbb-intro.is-bloom .nbb-intro-bloom{opacity:1;transform:scale(1)}
.nbb-intro.is-bloom .nbb-intro-video{transform:scale(1.14);filter:brightness(1.45) saturate(1.08)}
.nbb-intro.is-bloom .nbb-intro-vignette{opacity:0}
.nbb-intro.is-fast{--nbb-intro-bloom:.42s}

/* needs the html.nbb-intro-active prefix to outrank the base rule's opacity:1 */
html.nbb-intro-active .nbb-intro.is-out{opacity:0;pointer-events:none}

/* skip */
.nbb-intro-skip{
  position:absolute;z-index:3;right:max(22px,env(safe-area-inset-right));bottom:max(26px,calc(env(safe-area-inset-bottom) + 18px));
  display:inline-flex;align-items:center;gap:9px;margin:0;padding:11px 16px 11px 18px;cursor:pointer;
  font:600 11px/1 var(--nbb-ui-font,"Manrope",system-ui,sans-serif);letter-spacing:.16em;text-transform:uppercase;
  color:#fff;background:rgba(14,24,17,.32);border:1px solid rgba(255,255,255,.3);border-radius:999px;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  opacity:0;animation:nbbIntroIn .7s ease 1.1s forwards;transition:background .25s ease,border-color .25s ease,opacity .3s ease;
}
.nbb-intro-skip:hover{background:rgba(14,24,17,.55);border-color:rgba(255,255,255,.55)}
.nbb-intro-skip:focus-visible{outline:2px solid #fff;outline-offset:3px}
.nbb-intro-skip svg{transition:transform .25s ease}
.nbb-intro-skip:hover svg{transform:translateX(2px)}
.nbb-intro.is-bloom .nbb-intro-skip{opacity:0!important;animation:none;pointer-events:none}

/* progress hairline */
.nbb-intro-progress{position:absolute;z-index:2;left:0;right:0;bottom:0;height:2px;background:rgba(255,255,255,.12);transition:opacity .4s ease}
.nbb-intro-progress i{display:block;height:100%;background:var(--nbb-clay,#c49a63);transform:scaleX(0);transform-origin:0 50%;transition:transform .3s linear}
.nbb-intro.is-bloom .nbb-intro-progress{opacity:0}

@keyframes nbbIntroIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* the landing: page arrives out of the light */
html.nbb-intro-revealing .nbb-site-shell{animation:nbbIntroLand 1.15s cubic-bezier(.2,.7,.2,1) both}
@keyframes nbbIntroLand{
  from{transform:scale(1.045);filter:brightness(1.55) saturate(.8) blur(6px)}
  to{transform:none;filter:none}
}

@media (max-width:600px){
  .nbb-intro-skip{padding:10px 14px 10px 15px;font-size:10.5px;letter-spacing:.14em}
}

/* v2.5.9 portrait film shows the whole gate in a band with misted forest above and
   below; the sun sits a little lower in that frame, so the light grows from there. */
@media (orientation:portrait){
  .nbb-intro-bloom{background:radial-gradient(circle at 53% 47%,#fffefa 0%,#fff8e6 26%,#fbedc9 55%,#f3e1b4 80%,#efd9a6 100%);transform-origin:53% 47%}
  .nbb-intro-video{transform-origin:53% 47%}
}
