/* Premium Cell C opening portal. Desktop uses the richer canvas treatment; mobile uses
   a pre-rendered H.264 loop so the device's hardware video decoder handles every frame. */
html.tcg-intro-lock,
html.tcg-intro-lock body{overflow:hidden!important;overscroll-behavior:none;touch-action:none;background:#000}

#tcg-intro-portal{display:none;position:fixed;inset:0;z-index:2147483000;background:#000;color:#fff;place-items:center;opacity:1;overflow:hidden;isolation:isolate;contain:layout paint style;transition:opacity .56s cubic-bezier(.22,.61,.36,1);-webkit-tap-highlight-color:transparent;will-change:opacity;transform:translateZ(0);backface-visibility:hidden}
html.tcg-intro-enabled #tcg-intro-portal{display:grid}
#tcg-intro-portal.is-leaving{opacity:0;pointer-events:none}
#tcg-intro-portal .portal-shell{position:relative;width:100%;height:100%;height:100svh;min-height:460px;display:grid;place-items:center;overflow:hidden;background:#000}

/* Desktop canvas layers */
#tcg-intro-portal .portal-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:1;transform:translateZ(0);backface-visibility:hidden;transition:opacity .24s ease;image-rendering:auto}
#tcg-intro-portal .portal-logo-canvas{position:absolute;left:50%;top:49%;z-index:1;display:block;transform:translate3d(-50%,-50%,0);backface-visibility:hidden;opacity:1;transition:opacity .24s ease;pointer-events:none}

/* Mobile pre-render layer. The poster and first video frame are generated from the same
   composition, so swapping from poster to decoded video should not visibly jump. */
#tcg-intro-portal .portal-prerender-wrap{display:none;position:absolute;inset:0;z-index:1;background:#000;overflow:hidden;pointer-events:none}
#tcg-intro-portal .portal-mobile-poster,
#tcg-intro-portal .portal-mobile-video{position:absolute;inset:0;width:100%;height:100%;display:block;object-fit:cover;object-position:center center;background:#000;backface-visibility:hidden}
#tcg-intro-portal .portal-mobile-poster{opacity:1;transition:opacity .16s linear}
#tcg-intro-portal .portal-mobile-video{opacity:0;transition:opacity .16s linear}
#tcg-intro-portal.is-video-ready .portal-mobile-video{opacity:1}
#tcg-intro-portal.is-video-ready .portal-mobile-poster{opacity:0}

/* Small orange exit bloom only. No transforms are applied to the video itself. */
#tcg-intro-portal .portal-shell::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;background:radial-gradient(circle at 50% 49%,rgba(234,91,12,.22),rgba(234,91,12,.05) 24%,transparent 52%);transition:opacity .22s ease}
#tcg-intro-portal.is-activating .portal-shell::after{opacity:1}

#tcg-intro-portal .portal-brand{position:absolute;top:max(26px,5svh);left:50%;transform:translate3d(-50%,0,0);display:flex;flex-direction:column;align-items:center;gap:10px;z-index:3;pointer-events:none;opacity:.9;transition:opacity .24s ease,transform .34s cubic-bezier(.22,.61,.36,1);will-change:opacity,transform}
#tcg-intro-portal .portal-brand img{display:block;width:clamp(86px,9vw,126px);height:auto;filter:drop-shadow(0 0 18px rgba(234,91,12,.11))}
#tcg-intro-portal .portal-brand span{font:700 9px/1.2 "Cell C Sans","Helvetica Neue",Arial,sans-serif;text-transform:uppercase;letter-spacing:.17em;color:rgba(255,255,255,.42);white-space:nowrap}

#tcg-intro-portal .portal-cta-wrap{position:absolute;left:50%;bottom:clamp(34px,10svh,92px);transform:translate3d(-50%,0,0);z-index:4;display:grid;place-items:center;gap:12px;opacity:1;transition:opacity .24s ease,transform .34s cubic-bezier(.22,.61,.36,1);will-change:opacity,transform}
#tcg-intro-portal .portal-cta{appearance:none;border:1px solid rgba(234,91,12,.82);background:linear-gradient(180deg,rgba(30,30,30,.96),rgba(8,8,8,.98));color:#fff;min-width:clamp(172px,18vw,228px);height:58px;padding:0 26px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;gap:15px;font:750 clamp(15px,1.35vw,18px)/1 "Cell C Sans","Helvetica Neue",Arial,sans-serif;letter-spacing:.025em;cursor:pointer;box-shadow:0 0 0 1px rgba(255,255,255,.035) inset,0 0 24px rgba(234,91,12,.22),0 16px 54px rgba(0,0,0,.64);transition:transform .18s ease,border-color .22s ease,box-shadow .22s ease,opacity .24s ease;will-change:transform,opacity}
#tcg-intro-portal .portal-cta::after{content:'›';display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#ea5b0c;color:#000;font-size:22px;font-weight:800;line-height:1;transition:transform .22s ease,box-shadow .22s ease;box-shadow:0 0 16px rgba(234,91,12,.3)}
#tcg-intro-portal .portal-cta:hover{transform:translateY(-2px) scale(1.015);border-color:#ff7a21;box-shadow:0 0 0 1px rgba(255,255,255,.05) inset,0 0 36px rgba(234,91,12,.38),0 18px 58px rgba(0,0,0,.7)}
#tcg-intro-portal .portal-cta:hover::after{transform:translateX(3px);box-shadow:0 0 22px rgba(234,91,12,.5)}
#tcg-intro-portal .portal-cta:active{transform:scale(.985)}
#tcg-intro-portal .portal-cta:focus-visible{outline:2px solid #fff;outline-offset:5px}
#tcg-intro-portal.is-activating .portal-cta{opacity:0;transform:translateY(8px) scale(.97);pointer-events:none}
#tcg-intro-portal .portal-hint{font:600 9px/1.2 "Cell C Sans","Helvetica Neue",Arial,sans-serif;text-transform:uppercase;letter-spacing:.12em;color:rgba(255,255,255,.3);white-space:nowrap;transition:opacity .22s ease}
#tcg-intro-portal.is-activating .portal-hint{opacity:0}

/* First paint stays black until the chosen engine has a visible frame ready. */
#tcg-intro-portal.is-booting .portal-canvas,
#tcg-intro-portal.is-booting .portal-logo-canvas,
#tcg-intro-portal.is-booting .portal-prerender-wrap{opacity:0}
#tcg-intro-portal.is-booting .portal-brand{opacity:0;transform:translate3d(-50%,-4px,0)}
#tcg-intro-portal.is-booting .portal-cta-wrap{opacity:0;transform:translate3d(-50%,6px,0)}

html.tcg-intro-prerender-mobile #tcg-intro-portal .portal-canvas,
html.tcg-intro-prerender-mobile #tcg-intro-portal .portal-logo-canvas,
html.tcg-intro-prerender-mobile #tcg-intro-portal .portal-vector-c{display:none!important}
html.tcg-intro-prerender-mobile #tcg-intro-portal .portal-prerender-wrap{display:block}

@media(max-width:760px),(pointer:coarse){
  #tcg-intro-portal{transition-duration:.42s}
  #tcg-intro-portal .portal-shell{min-height:420px}
  #tcg-intro-portal .portal-brand{top:max(20px,3.5svh);gap:8px}
  #tcg-intro-portal .portal-brand img{width:86px;filter:drop-shadow(0 0 12px rgba(234,91,12,.09))}
  #tcg-intro-portal .portal-brand span{font-size:7.5px;letter-spacing:.12em}
  #tcg-intro-portal .portal-cta-wrap{bottom:max(26px,7svh);gap:10px}
  #tcg-intro-portal .portal-cta{height:52px;min-width:168px;border-radius:13px;padding:0 22px;font-size:15px;box-shadow:0 0 0 1px rgba(255,255,255,.03) inset,0 0 18px rgba(234,91,12,.18),0 12px 34px rgba(0,0,0,.58)}
  #tcg-intro-portal .portal-cta::after{width:25px;height:25px;font-size:20px;box-shadow:0 0 12px rgba(234,91,12,.24)}
  #tcg-intro-portal .portal-cta:hover{transform:none}
}

@media(max-width:420px){
  #tcg-intro-portal .portal-brand{top:max(18px,3svh)}
  #tcg-intro-portal .portal-brand img{width:82px}
  #tcg-intro-portal .portal-cta-wrap{bottom:max(22px,5.5svh)}
  #tcg-intro-portal .portal-hint{font-size:8px;letter-spacing:.1em}
}

@media(max-height:600px){
  #tcg-intro-portal .portal-brand{top:16px}
  #tcg-intro-portal .portal-brand span{display:none}
  #tcg-intro-portal .portal-logo-canvas{top:47%}
  #tcg-intro-portal .portal-cta-wrap{bottom:20px}
}

@media(prefers-reduced-motion:reduce){
  #tcg-intro-portal{transition-duration:.2s}
  #tcg-intro-portal .portal-mobile-video{display:none!important}
  #tcg-intro-portal .portal-mobile-poster{opacity:1!important}
  #tcg-intro-portal .portal-canvas,#tcg-intro-portal .portal-logo-canvas,#tcg-intro-portal .portal-prerender-wrap,#tcg-intro-portal .portal-brand,#tcg-intro-portal .portal-cta-wrap,#tcg-intro-portal .portal-cta,#tcg-intro-portal .portal-cta::after{transition-duration:.01ms}
}