:root{
  --v15-orange:#ff5a1f;
  --v15-orange-2:#ff7a00;
  --v15-orange-soft:#fff1e8;
  --v15-cream:#fffaf5;
  --v15-paper:#ffffff;
  --v15-ink:#18120f;
  --v15-muted:#756a63;
  --v15-line:rgba(55,31,19,.11);
  --v15-shadow:0 24px 70px rgba(104,54,24,.10);
}

.v14-body{background:var(--v15-cream);color:var(--v15-ink)}
.v14-main{background:var(--v15-cream)}
.v14-header{background:rgba(255,255,255,.82)!important;border-color:rgba(92,48,22,.09)!important;box-shadow:0 10px 32px rgba(91,48,22,.07)!important}
.v14-header.is-scrolled{background:rgba(255,255,255,.95)!important;box-shadow:0 12px 34px rgba(91,48,22,.11)!important}
.v14-brand,.v14-brand strong{color:#1a130f!important}
.v14-brand-mark{background:#fff0e6!important;color:var(--v15-orange)!important}
.v14-desktop-nav a,.v14-mini-link{color:#6f635c!important}
.v14-desktop-nav a:hover,.v14-mini-link:hover{color:#18120f!important}
.v14-header-cta{background:var(--v15-orange)!important;color:#fff!important;box-shadow:0 10px 28px rgba(255,90,31,.22)!important}
.v14-kicker{color:#b24e1d!important}
.v14-kicker:before{background:currentColor!important}
.v14-btn.primary{background:var(--v15-orange)!important;color:#fff!important;box-shadow:0 14px 32px rgba(255,90,31,.20)!important}
.v14-btn.secondary{background:#fff!important;color:#221711!important;border-color:rgba(85,47,27,.14)!important}
.v14-text-link{border-bottom-color:rgba(255,90,31,.45)!important}
.v14-checks span{background:#fff!important;border-color:var(--v15-line)!important;color:#594d46!important}
.v14-checks svg{color:var(--v15-orange)!important}

/* loader */
.v14-loader{background:#fffaf5!important}
.v14-loader-ring{border-color:rgba(255,90,31,.16)!important}
.v14-loader-ring:before{border-top-color:rgba(255,90,31,.88)!important;border-right-color:rgba(255,122,0,.18)!important}
.v14-loader-ring:after{border-top-color:rgba(255,179,128,.82)!important}
.v14-loader-word{color:#17110d!important}

/* custom interaction cursor */
.v15-cursor,.v15-cursor-ring{position:fixed;left:0;top:0;pointer-events:none;z-index:9999;border-radius:999px;opacity:0;mix-blend-mode:multiply;will-change:transform}
.v15-cursor{width:8px;height:8px;background:var(--v15-orange);margin:-4px 0 0 -4px;transition:opacity .2s ease}
.v15-cursor-ring{width:34px;height:34px;border:1px solid rgba(255,90,31,.45);margin:-17px 0 0 -17px;transition:width .2s ease,height .2s ease,margin .2s ease,border-color .2s ease,opacity .2s ease}
body.v15-cursor-active .v15-cursor,body.v15-cursor-active .v15-cursor-ring{opacity:1}
body.v15-cursor-hover .v15-cursor-ring{width:58px;height:58px;margin:-29px 0 0 -29px;border-color:rgba(255,90,31,.72)}

/* hero */
.v14-hero{background:
 radial-gradient(circle at 76% 18%,rgba(255,122,0,.14),transparent 25%),
 radial-gradient(circle at 21% 72%,rgba(255,90,31,.08),transparent 25%),
 linear-gradient(180deg,#fffdfa 0%,#fff8f2 70%,#fff4ea 100%)!important}
.v14-hero:after{background:linear-gradient(145deg,#ff8d4d,#ffc38f 45%,#fff0df)!important;filter:saturate(.92)!important;box-shadow:inset 0 0 100px rgba(255,255,255,.72)!important}
.v14-hero h1,.v14-statement h2,.v14-copy h2,.v14-section-head h2,.v14-process h2,.v14-final h2,.v14-page-hero h1,.v14-detail-copy h1,.v14-how h2{color:var(--v15-ink)!important}
.v14-hero h1 strong,.v14-statement h2 strong,.v14-copy h2 strong,.v14-section-head h2 strong,.v14-process h2 strong,.v14-final h2 strong{background:none!important;color:var(--v15-orange)!important;-webkit-text-fill-color:currentColor!important}
.v14-hero p,.v14-statement p,.v14-copy>p,.v14-section-head>p,.v14-process-grid p,.v14-page-hero p,.v14-detail-copy .lead,.v14-how p{color:var(--v15-muted)!important}
.v14-hero-orbit{border-color:rgba(255,90,31,.14)!important}
.v14-float-card{background:rgba(255,255,255,.80)!important;border-color:rgba(255,90,31,.13)!important;color:var(--v15-orange)!important;box-shadow:0 22px 50px rgba(133,64,22,.10)!important}
.v14-die{background:linear-gradient(145deg,#ff5a1f,#ff8a2a)!important;box-shadow:0 24px 55px rgba(255,90,31,.26)!important}
.v14-die i{background:#fff5ed!important}
.v14-sphere{background:radial-gradient(circle at 35% 30%,#fff,#ffd2b4 46%,#ff6c24)!important;box-shadow:0 20px 40px rgba(255,90,31,.14)!important}
.v14-scroll-cue{color:#a76d4d!important}
.v14-scroll-cue i{background:linear-gradient(var(--v15-orange),transparent)!important}

/* motion marquee */
.v15-marquee{overflow:hidden;border-top:1px solid rgba(255,90,31,.14);border-bottom:1px solid rgba(255,90,31,.14);background:#fff;white-space:nowrap}
.v15-marquee-track{display:inline-flex;gap:0;min-width:max-content;animation:v15Marquee 24s linear infinite}
.v15-marquee span{display:inline-flex;align-items:center;gap:20px;padding:18px 26px;font-family:Space Grotesk,sans-serif;font-size:13px;font-weight:700;letter-spacing:.08em;color:#3c2b21;text-transform:uppercase}
.v15-marquee span:after{content:"✦";color:var(--v15-orange)}
@keyframes v15Marquee{to{transform:translateX(-50%)}}

/* section palette */
.v14-statement{background:#fff!important}
.v14-split{background:#fff8f2!important}
.v14-business-section{background:#fff!important}
.v14-games-section{background:linear-gradient(180deg,#fff3e8 0,#fffaf5 78%)!important}
.v14-process{background:#fff7ef!important}
.v14-final{background:linear-gradient(180deg,#fff 0%,#fff5ec 100%)!important}
.v14-final-ring{border-color:rgba(255,90,31,.18)!important;box-shadow:0 0 80px rgba(255,90,31,.06) inset!important}
.v14-visual-card,.v14-process-grid article,.v14-panel-preview,.v14-library-card{border-color:var(--v15-line)!important;box-shadow:var(--v15-shadow)!important}
.v14-game-card{background:#2b160d!important;box-shadow:0 18px 46px rgba(108,52,23,.13)!important}
.v14-game-card:hover{box-shadow:0 30px 72px rgba(108,52,23,.19)!important}
.v14-panel-sidebar{background:#fff8f2!important;border-right-color:var(--v15-line)!important}
.v14-panel-sidebar span.active{background:#ffe8d9!important;color:#b84b18!important}
.v14-panel-cards svg{color:var(--v15-orange)!important}
.v14-panel-list i{background:var(--v15-orange)!important}

/* interactive reveal layer */
.v15-reveal-line{display:block;overflow:hidden}
.v15-reveal-line>span{display:block;transform:translateY(115%)}
.v15-orbit-dot{position:absolute;width:8px;height:8px;border-radius:50%;background:var(--v15-orange);box-shadow:0 0 0 8px rgba(255,90,31,.08)}
.v15-progress{position:fixed;right:18px;top:50%;z-index:70;transform:translateY(-50%);width:3px;height:110px;border-radius:999px;background:rgba(91,48,22,.10);overflow:hidden}
.v15-progress>i{display:block;width:100%;height:0;background:linear-gradient(var(--v15-orange),#ffab72);border-radius:inherit}

/* hover micro-interactions */
.v14-btn,.v14-header-cta,.v14-text-link,.v14-game-card,.v14-process-grid article,.v14-panel-cards article{will-change:transform}
@media (hover:hover) and (pointer:fine){
 .v14-process-grid article{transition:transform .35s cubic-bezier(.2,.8,.2,1),background .35s ease,border-color .35s ease}
 .v14-process-grid article:hover{transform:translateY(-8px);background:#fff;border-color:rgba(255,90,31,.24)!important}
 .v14-panel-cards article{transition:transform .3s ease,border-color .3s ease}
 .v14-panel-cards article:hover{transform:translateY(-5px);border-color:rgba(255,90,31,.24)!important}
}

/* page cards */
.v14-badges span{background:#fff!important;border-color:var(--v15-line)!important;color:#66584f!important}
.v14-detail-poster{background:#2a160d!important}
.v14-library-art{background:#fff0e6!important}
.v14-library-copy small{color:#a66d4e!important}

/* footer */
.v14-footer{background:#1d130e!important;color:#fff!important}
.v14-brand-footer .v14-brand-mark{background:rgba(255,255,255,.10)!important;color:#ff9b63!important}
.v14-footer-grid>div:first-child p{color:#cdbdb4!important}
.v14-footer-grid small{color:#9f8a7d!important}
.v14-footer-grid>div:not(:first-child){color:#eadfd8!important}
.v14-footer-bottom{color:#99877c!important}

/* inherited room/create styling */
.v14-inner-body .btn-accent{background:var(--v15-orange)!important;color:#fff!important}
.v14-inner-body .platform-clean-form input:focus,.v14-inner-body .platform-clean-form select:focus{border-color:var(--v15-orange)!important;box-shadow:0 0 0 4px rgba(255,90,31,.10)!important}

@media(max-width:760px){
 .v15-progress,.v15-cursor,.v15-cursor-ring{display:none!important}
 .v15-marquee span{padding:14px 18px;font-size:11px}
 .v15-marquee-track{animation-duration:18s}
}
@media(prefers-reduced-motion:reduce){
 .v15-marquee-track{animation:none}
 .v15-cursor,.v15-cursor-ring{display:none!important}
}
.v14-loader-word{display:flex;gap:.20em;margin-left:0!important;letter-spacing:0!important;filter:none!important;opacity:1!important;animation:none!important}
.v14-loader-word span{display:inline-block;min-width:.62em;text-align:center;opacity:0;filter:blur(8px)}

/* =========================================================
   V15.1 — INTERACTIVE HERO SYSTEM
   The first screen behaves like a depth scene rather than a static banner.
   ========================================================= */
.v14-hero[data-v15-enhanced]{
  --hero-x:50%;
  --hero-y:44%;
  --hero-tilt-x:0deg;
  --hero-tilt-y:0deg;
  isolation:isolate;
  perspective:1400px;
  transform-style:preserve-3d;
  min-height:100svh;
  overflow:hidden;
  background:#fffaf5!important;
}
.v14-hero[data-v15-enhanced]:after{display:none!important}
.v15-hero-field{position:absolute;inset:-8%;z-index:0;pointer-events:none;background:
  radial-gradient(circle at var(--hero-x) var(--hero-y),rgba(255,90,31,.16) 0,rgba(255,90,31,.065) 13%,transparent 31%),
  radial-gradient(circle at 80% 16%,rgba(255,122,0,.10),transparent 22%),
  radial-gradient(circle at 15% 78%,rgba(255,90,31,.065),transparent 24%),
  linear-gradient(180deg,#fffdfa 0%,#fff9f3 68%,#fff4ea 100%);
  transition:background-position .35s ease;
  will-change:transform,opacity
}
.v15-hero-grid{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.35;background-image:
  linear-gradient(rgba(255,90,31,.045) 1px,transparent 1px),
  linear-gradient(90deg,rgba(255,90,31,.045) 1px,transparent 1px);
  background-size:72px 72px;
  mask-image:radial-gradient(circle at 50% 48%,#000 0,rgba(0,0,0,.45) 45%,transparent 76%);
  -webkit-mask-image:radial-gradient(circle at 50% 48%,#000 0,rgba(0,0,0,.45) 45%,transparent 76%);
  transform:perspective(900px) rotateX(69deg) translateY(41%);
  transform-origin:50% 100%;
  will-change:transform,opacity
}
.v15-hero-dome{position:absolute;z-index:1;left:50%;bottom:-58vw;width:min(137vw,1650px);aspect-ratio:1;transform:translate3d(-50%,0,0) scale(1);border-radius:50%;overflow:hidden;pointer-events:none;background:
  radial-gradient(circle at 31% 24%,rgba(255,255,255,.55),transparent 16%),
  radial-gradient(circle at 72% 29%,rgba(255,238,220,.52),transparent 19%),
  linear-gradient(145deg,#ff8a49 0%,#ffb67d 49%,#ffe3c8 100%);
  box-shadow:inset 0 0 130px rgba(255,255,255,.5),0 -30px 100px rgba(255,111,45,.08);
  will-change:transform,border-radius,filter
}
.v15-dome-glow{position:absolute;inset:0;border-radius:inherit;background:radial-gradient(circle at var(--hero-x) var(--hero-y),rgba(255,255,255,.34),transparent 30%);mix-blend-mode:screen;opacity:.65}
.v14-hero[data-v15-enhanced] .v14-hero-inner{z-index:7;transform-style:preserve-3d;will-change:transform,opacity,filter}
.v14-hero[data-v15-enhanced] .v14-hero-orbit{z-index:2;will-change:transform,opacity}
.v14-hero[data-v15-enhanced] .v14-float-card,.v14-hero[data-v15-enhanced] .v14-die,.v14-hero[data-v15-enhanced] .v14-sphere{z-index:5;will-change:transform,opacity,filter;transform-style:preserve-3d}
.v14-hero[data-v15-enhanced] .v14-float-card{overflow:hidden;background:rgba(255,255,255,.72);box-shadow:0 26px 70px rgba(115,55,22,.10),inset 0 0 0 1px rgba(255,255,255,.4)}
.v14-hero[data-v15-enhanced] .v14-float-card:before{content:"";position:absolute;inset:-45%;background:linear-gradient(118deg,transparent 38%,rgba(255,122,0,.14) 50%,transparent 62%);transform:translateX(-45%) rotate(12deg);animation:v151-card-sheen 7s ease-in-out infinite}
.v14-hero[data-v15-enhanced] .v14-float-card svg{position:relative;z-index:2;color:#ff5a1f}
.v15-card-index{position:absolute;right:13px;bottom:11px;z-index:2;font-size:8px;letter-spacing:.14em;color:#a89080;font-weight:800}
@keyframes v151-card-sheen{0%,72%,100%{transform:translateX(-48%) rotate(12deg);opacity:0}80%{opacity:1}92%{transform:translateX(52%) rotate(12deg);opacity:0}}
.v14-hero[data-v15-enhanced] .v14-die{box-shadow:0 28px 70px rgba(255,90,31,.25),inset 0 0 0 1px rgba(255,255,255,.12)}
.v14-hero[data-v15-enhanced] .v14-die:after{content:"";position:absolute;inset:-20%;border-radius:35%;background:radial-gradient(circle,rgba(255,90,31,.20),transparent 60%);filter:blur(18px);z-index:-1}
.v15-pointer-halo{position:absolute;z-index:3;left:0;top:0;width:260px;height:260px;border-radius:50%;pointer-events:none;opacity:0;background:radial-gradient(circle,rgba(255,90,31,.12),rgba(255,122,0,.04) 37%,transparent 70%);filter:blur(3px);transform:translate3d(-999px,-999px,0);will-change:transform,opacity}
.v15-title-mask{display:block;overflow:hidden;padding:.06em .04em .11em;margin:-.06em -.04em -.11em}
.v15-title-line{display:block;will-change:transform,filter,opacity}
.v15-title-line.line-orange{color:#ff5a1f!important;background:none!important;-webkit-text-fill-color:#ff5a1f!important}
.v15-hero-kicker,.v15-hero-lead,.v15-hero-actions{will-change:transform,opacity,filter}
.v15-hero-status{position:absolute;left:clamp(20px,4vw,62px);bottom:34px;z-index:8;display:flex;align-items:center;gap:10px;font-size:8px;letter-spacing:.15em;font-weight:800;color:#9e7b67;text-transform:uppercase;pointer-events:none}
.v15-hero-status i{width:48px;height:1px;background:linear-gradient(90deg,#ff5a1f,rgba(255,90,31,.15));transform-origin:left center}
.v15-hero-status b{font-size:8px;color:#5f493d}
.v15-orbit-runner{position:absolute;z-index:4;left:50%;top:48%;width:9px;height:9px;border-radius:50%;background:#ff5a1f;box-shadow:0 0 0 8px rgba(255,90,31,.075),0 0 22px rgba(255,90,31,.26);pointer-events:none;will-change:transform}
.runner-a{animation:v151-orbitA 13s linear infinite}
.runner-b{width:6px;height:6px;opacity:.55;animation:v151-orbitB 19s linear infinite reverse}
@keyframes v151-orbitA{from{transform:translate(-50%,-50%) rotate(0deg) translateX(min(37vw,450px)) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(360deg) translateX(min(37vw,450px)) rotate(-360deg)}}
@keyframes v151-orbitB{from{transform:translate(-50%,-50%) rotate(0deg) translateX(min(47vw,600px)) rotate(0deg)}to{transform:translate(-50%,-50%) rotate(360deg) translateX(min(47vw,600px)) rotate(-360deg)}}
.v14-hero[data-v15-enhanced] .v14-scroll-cue i{position:relative;overflow:hidden;background:rgba(255,90,31,.16)}
.v14-hero[data-v15-enhanced] .v14-scroll-cue i:after{content:"";position:absolute;left:0;top:-45%;width:1px;height:45%;background:#ff5a1f;animation:v151-scroll-cue 1.55s cubic-bezier(.65,0,.35,1) infinite}
@keyframes v151-scroll-cue{to{transform:translateY(320%)}}

/* The hero objects remain soft and editorial while still visibly reacting to input. */
@media (hover:hover) and (pointer:fine){
  .v14-hero[data-v15-enhanced] .v14-float-card{transition:box-shadow .35s ease,border-color .35s ease}
  .v14-hero[data-v15-enhanced] .v14-float-card:hover{box-shadow:0 35px 90px rgba(115,55,22,.17),inset 0 0 0 1px rgba(255,90,31,.12)}
  .v14-hero[data-v15-enhanced] .v14-btn.primary:hover{box-shadow:0 20px 42px rgba(255,90,31,.32)!important}
  .v14-hero[data-v15-enhanced] .v14-btn.secondary:hover{border-color:rgba(255,90,31,.32)!important;box-shadow:0 15px 40px rgba(103,54,24,.10)}
}

/* Stronger transition from hero to the next section. */
.v15-marquee{position:relative;z-index:8;box-shadow:0 -1px 0 rgba(255,90,31,.10)}
.v15-marquee-track{will-change:transform}

@media(max-width:900px){
 .v14-hero[data-v15-enhanced]{perspective:none}
 .v15-hero-grid{opacity:.20;background-size:54px 54px}
 .v15-pointer-halo,.v15-hero-status{display:none}
 .v15-orbit-runner{opacity:.55}
 .runner-a{animation-duration:18s}.runner-b{animation-duration:25s}
 .v15-hero-dome{bottom:-69vw;width:155vw}
}
@media(max-width:640px){
 .v15-hero-dome{bottom:-66vw;width:168vw}
 .v15-title-mask{overflow:visible}
 .v15-orbit-runner{display:none}
 .v15-hero-grid{display:none}
 .v14-hero[data-v15-enhanced] .v14-float-card:before{display:none}
}
@media(prefers-reduced-motion:reduce){
 .runner-a,.runner-b,.v14-hero[data-v15-enhanced] .v14-float-card:before,.v14-hero[data-v15-enhanced] .v14-scroll-cue i:after{animation:none!important}
 .v15-pointer-halo{display:none!important}
 .v15-title-line{transform:none!important;filter:none!important;opacity:1!important}
}

/* =========================================================
   V15.2 — Scroll Scene System
   Sections no longer just reveal; they morph into one another.
   ========================================================= */
.v152-scene{position:relative;isolation:isolate;overflow:hidden}
.v152-scene>.v14-section-shell{position:relative;z-index:3}
.v152-scene-nav{position:fixed;z-index:74;right:24px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;color:#6d5d54;font-family:Space Grotesk,sans-serif;font-size:9px;font-style:normal;pointer-events:none;mix-blend-mode:multiply}
.v152-scene-nav b,.v152-scene-nav em{font-style:normal;font-weight:700;letter-spacing:.08em}
.v152-scene-nav i{position:relative;width:2px;height:116px;border-radius:99px;background:rgba(36,24,18,.10);overflow:hidden}
.v152-scene-nav i span{position:absolute;left:0;top:0;width:100%;height:0;background:#ff5a1f;border-radius:99px}

/* 02 — statement: orange sun takes over the canvas */
.v152-statement{min-height:100svh;background:#fffaf5!important;display:flex;align-items:center}
.v152-statement-sun{position:absolute;z-index:0;left:50%;top:58%;width:min(44vw,560px);aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%) scale(.18);background:linear-gradient(145deg,#ff7a00 0%,#ff5a1f 62%,#ff8b48 100%);box-shadow:0 40px 110px rgba(255,90,31,.20);will-change:transform,border-radius}
.v152-statement .v14-section-shell{will-change:transform,opacity}

/* 03 — QR scene: white/cream surface opens from the orange scene */
.v152-qr{min-height:100svh;background:#ff5a1f!important;display:flex;align-items:center}
.v152-qr-backdrop{position:absolute;z-index:0;left:50%;top:50%;width:42vw;aspect-ratio:1;border-radius:50%;background:#fffaf5;transform:translate(-50%,-50%) scale(.08);box-shadow:0 0 0 1px rgba(255,255,255,.18);will-change:transform,border-radius}
.v152-qr .v14-copy{position:relative;z-index:3}
.v152-qr .v14-visual-card{z-index:3;will-change:transform,clip-path}
.v152-qr.is-light .v14-copy h2,.v152-qr.is-light .v14-copy>p{color:#18120f}

/* 04 — games: cards begin as a deck and fan into the actual layout */
.v152-games{min-height:100svh;background:#fffaf5!important}
.v152-games-orbit{position:absolute;z-index:0;left:50%;top:58%;width:min(88vw,1180px);aspect-ratio:1;border:1px solid rgba(255,90,31,.16);border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 12vw rgba(255,90,31,.025);will-change:transform,opacity}
.v152-games .v14-section-shell{position:relative;z-index:2}
.v152-games .v14-game-gallery{perspective:1500px;transform-style:preserve-3d}
.v152-games .v14-game-card{will-change:transform,opacity;transform-origin:50% 55%}

/* 05 — merchant panel: orange color field wipes across the screen */
.v152-business{min-height:100svh;background:#fffaf5!important;display:flex;align-items:center}
.v152-business-wash{position:absolute;z-index:0;right:-12vw;top:50%;width:50vw;aspect-ratio:1;border-radius:50%;background:#ff5a1f;transform:translateY(-50%) scale(.16);transform-origin:50% 50%;will-change:transform,border-radius}
.v152-business .v14-panel-preview{position:relative;z-index:3;will-change:transform,opacity}
.v152-business .v14-copy{position:relative;z-index:3;will-change:transform,opacity,color}

/* 06 — process: line draws first, then the three cards physically spread */
.v152-process{min-height:100svh;background:#fffaf5!important;display:flex;align-items:center}
.v152-process-line{position:absolute;z-index:0;left:50%;top:17%;bottom:12%;width:1px;background:linear-gradient(180deg,transparent,#ff5a1f 18%,#ff5a1f 80%,transparent);transform:scaleY(0);transform-origin:top;opacity:.42}
.v152-process .v14-process-grid{perspective:1300px;transform-style:preserve-3d}
.v152-process .v14-process-grid article{will-change:transform,opacity}

/* 07 — final: an orange circle expands until it becomes the background */
.v152-final{min-height:100svh;background:#fffaf5!important;display:flex;align-items:center}
.v152-final-fill{position:absolute;z-index:0;left:50%;top:50%;width:min(30vw,390px);aspect-ratio:1;border-radius:50%;background:#ff5a1f;transform:translate(-50%,-50%) scale(.12);will-change:transform,border-radius}
.v152-final .v14-final-ring{z-index:1}
.v152-final .v14-section-shell{position:relative;z-index:2}
.v152-final .v14-kicker,.v152-final h2,.v152-final h2 strong{will-change:color,transform,opacity}

/* smoother perceived section seam */
.v152-statement,.v152-qr,.v152-games,.v152-business,.v152-process,.v152-final{box-shadow:0 -1px 0 rgba(255,90,31,.05)}

@media(max-width:900px){
  .v152-scene-nav{display:none}
  .v152-statement,.v152-qr,.v152-games,.v152-business,.v152-process,.v152-final{min-height:auto}
  .v152-statement-sun{width:70vw;opacity:.13;transform:translate(-50%,-50%) scale(1)}
  .v152-qr{background:#fffaf5!important}
  .v152-qr-backdrop,.v152-business-wash,.v152-process-line{display:none}
  .v152-games-orbit{width:130vw;opacity:.35}
  .v152-final-fill{width:76vw;opacity:.08;transform:translate(-50%,-50%) scale(1)}
}
@media(prefers-reduced-motion:reduce){
  .v152-statement-sun,.v152-qr-backdrop,.v152-business-wash,.v152-final-fill{transform:translate(-50%,-50%) scale(1)!important}
  .v152-process-line{transform:scaleY(1)!important}
}
/* scene text colors are driven through CSS variables so GSAP can tween them
   without fighting the base theme's !important declarations. */
.v152-statement{--v152-title:#18120f;--v152-accent:#ff5a1f;--v152-copy:#6f6058;--v152-kicker:#b24e1d}
.v152-statement h2{color:var(--v152-title)!important}.v152-statement h2 strong{color:var(--v152-accent)!important}.v152-statement p{color:var(--v152-copy)!important}.v152-statement .v14-kicker{color:var(--v152-kicker)!important}
.v152-business{--v152-title:#18120f;--v152-accent:#ff5a1f;--v152-copy:#6f6058;--v152-kicker:#b24e1d}
.v152-business h2{color:var(--v152-title)!important}.v152-business h2 strong{color:var(--v152-accent)!important}.v152-business .v14-copy>p{color:var(--v152-copy)!important}.v152-business .v14-kicker{color:var(--v152-kicker)!important}
.v152-final{--v152-title:#18120f;--v152-accent:#ff5a1f;--v152-kicker:#b24e1d}
.v152-final h2{color:var(--v152-title)!important}.v152-final h2 strong{color:var(--v152-accent)!important}.v152-final .v14-kicker{color:var(--v152-kicker)!important}

/* =========================================================
   V15.3 — PRODUCT EXPLOSION SCENE
   A true scroll-driven cinematic section built from isolated
   pieces of the user's QR-menu food composition.
   ========================================================= */
.v153-explosion{position:relative;min-height:100svh;background:#fffaf5;isolation:isolate;overflow:hidden}
.v153-explosion-stage{position:relative;height:100svh;min-height:680px;overflow:hidden;background:
  radial-gradient(circle at 50% 48%,rgba(255,180,116,.24),transparent 24%),
  linear-gradient(180deg,#fffdf9 0%,#fff7ef 55%,#fff1e5 100%)}
.v153-explosion-stage:before{content:"";position:absolute;inset:0;z-index:0;background:
  radial-gradient(circle at 25% 18%,rgba(255,90,31,.08),transparent 19%),
  radial-gradient(circle at 81% 72%,rgba(255,122,0,.075),transparent 23%);pointer-events:none}
.v153-explosion-glow{position:absolute;z-index:0;left:50%;top:52%;width:min(52vw,760px);aspect-ratio:1;border-radius:50%;transform:translate(-50%,-50%) scale(.25);background:radial-gradient(circle,#ffb26f 0%,#ff7a00 42%,#ff5a1f 66%,transparent 67%);filter:blur(2px);opacity:.10;will-change:transform,opacity}
.v153-explosion-orbit{position:absolute;z-index:0;left:50%;top:51%;border:1px solid rgba(255,90,31,.14);border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;will-change:transform,opacity}
.v153-explosion-orbit.orbit-one{width:min(62vw,900px);aspect-ratio:1}
.v153-explosion-orbit.orbit-two{width:min(88vw,1280px);aspect-ratio:1;border-style:dashed;opacity:.48}
.v153-explosion-copy{position:absolute;z-index:20;left:clamp(24px,6vw,96px);top:50%;width:min(520px,40vw);transform:translateY(-50%);will-change:transform,opacity,filter}
.v153-explosion-copy h2{font-family:Space Grotesk,sans-serif;font-size:clamp(58px,7.3vw,110px);line-height:.84;letter-spacing:-.07em;margin:16px 0 22px;color:#18120f}
.v153-explosion-copy h2 span,.v153-explosion-copy h2 strong{display:block}
.v153-explosion-copy h2 strong{color:#ff5a1f;font-weight:600}
.v153-explosion-copy p{max-width:470px;color:#6f6058;font-size:14px;line-height:1.72;margin:0}
.v153-explosion-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:24px}
.v153-explosion-assets{position:absolute;inset:0;z-index:8;pointer-events:none;perspective:1600px;transform-style:preserve-3d}
.v153-piece-wrap{position:absolute;display:block;transform-style:preserve-3d;will-change:transform,opacity,filter;pointer-events:none}
.v153-piece{display:block;width:100%;height:auto;filter:drop-shadow(0 28px 35px rgba(86,38,12,.17));will-change:transform;user-select:none;-webkit-user-drag:none}
.wrap-phone{left:50%;top:50%;width:clamp(205px,20vw,330px);z-index:12}
.wrap-qr{left:17%;top:57%;width:clamp(170px,17vw,280px);z-index:7}
.wrap-burger{left:52%;top:30%;width:clamp(280px,31vw,500px);z-index:9}
.wrap-cola{left:78%;top:25%;width:clamp(180px,20vw,320px);z-index:8}
.wrap-pizza{left:78%;top:54%;width:clamp(220px,26vw,400px);z-index:7}
.wrap-pasta{left:38%;top:69%;width:clamp(220px,25vw,390px);z-index:8}
.wrap-dessert{left:69%;top:73%;width:clamp(190px,22vw,350px);z-index:6}
.wrap-particles{left:61%;top:50%;width:clamp(180px,20vw,330px);z-index:5;opacity:.9}
.v153-step-copy{position:absolute;z-index:22;right:clamp(24px,4vw,62px);bottom:42px;text-align:right;display:grid;gap:4px;max-width:290px;pointer-events:none}
.v153-step-copy span{font-size:8px;font-weight:800;letter-spacing:.16em;color:#b35625;text-transform:uppercase}
.v153-step-copy b{font-family:Space Grotesk,sans-serif;font-size:18px;letter-spacing:-.03em;color:#2a1b14}
.v153-explosion-meter{position:absolute;z-index:22;left:clamp(24px,4vw,62px);bottom:48px;width:min(220px,24vw);height:2px;background:rgba(81,39,19,.10);overflow:hidden}
.v153-explosion-meter i{display:block;height:100%;width:0;background:#ff5a1f;transform-origin:left center}
.v153-explosion.is-burst .v153-piece{filter:drop-shadow(0 34px 44px rgba(86,38,12,.22))}

@media(max-width:1000px){
 .v153-explosion-stage{min-height:720px}
 .v153-explosion-copy{left:28px;width:min(500px,48vw)}
 .wrap-qr{left:8%}.wrap-pasta{left:29%}.wrap-burger{left:50%}.wrap-cola{left:80%}.wrap-pizza{left:80%}.wrap-dessert{left:67%}
}
@media(max-width:900px){
 .v153-explosion{min-height:auto}
 .v153-explosion-stage{height:auto;min-height:880px;padding:96px 18px 110px;display:flex;flex-direction:column;justify-content:flex-start}
 .v153-explosion-copy{position:relative;left:auto;top:auto;transform:none;width:min(620px,100%);z-index:20}
 .v153-explosion-copy h2{font-size:clamp(52px,14vw,78px)}
 .v153-explosion-assets{position:relative;height:520px;margin-top:24px;inset:auto}
 .v153-piece-wrap{transform:none!important;opacity:1!important;filter:none!important}
 .wrap-phone{left:50%;top:50%;width:195px;transform:translate(-50%,-50%) rotate(5deg)!important;z-index:12}
 .wrap-burger{left:2%;top:13%;width:230px;transform:rotate(-8deg)!important}
 .wrap-cola{left:auto;right:0;top:5%;width:160px;transform:rotate(10deg)!important}
 .wrap-pizza{left:auto;right:-4%;top:46%;width:205px;transform:rotate(6deg)!important}
 .wrap-pasta{left:-5%;top:59%;width:210px;transform:rotate(-5deg)!important}
 .wrap-dessert{left:auto;right:5%;top:70%;width:170px}
 .wrap-qr{left:4%;top:37%;width:145px;z-index:10}
 .wrap-particles{left:56%;top:44%;width:150px}
 .v153-step-copy,.v153-explosion-meter,.v153-explosion-orbit{display:none}
 .v153-explosion-glow{width:95vw;opacity:.08;top:64%}
}
@media(max-width:620px){
 .v153-explosion-stage{min-height:830px;padding-top:84px}
 .v153-explosion-copy p{font-size:13px}
 .v153-explosion-assets{height:470px}
 .wrap-phone{width:170px}.wrap-burger{width:190px}.wrap-cola{width:135px}.wrap-pizza{width:175px}.wrap-pasta{width:175px}.wrap-dessert{width:145px}.wrap-qr{width:120px}.wrap-particles{width:125px}
}
@media(prefers-reduced-motion:reduce){
 .v153-piece-wrap,.v153-explosion-copy,.v153-explosion-glow,.v153-explosion-orbit{transform:none!important;opacity:1!important;filter:none!important}
 .v153-explosion-meter i{width:100%!important}
}
.v153-orange-wipe{position:absolute;z-index:15;left:50%;top:50%;width:min(30vw,420px);aspect-ratio:1;border-radius:50%;background:#ff5a1f;transform:translate(-50%,-50%) scale(.08);opacity:0;pointer-events:none;will-change:transform,opacity,border-radius}

/* V15.3.1 responsive scroll: native browser scrolling, immediate motion response. */
html{scroll-behavior:auto}



/* V15.3.2 — native-scroll contract
   The browser owns wheel/touch input. Desktop scene locking is handled by
   ScrollTrigger pinning, not by oversized sticky containers. */
html,body{overflow-y:auto!important;overscroll-behavior-y:auto!important;scroll-behavior:auto!important}
.v14-main{overflow:visible!important}
.v153-explosion{height:auto!important;min-height:0!important;overflow:hidden!important}
.v153-explosion-stage{position:relative!important;top:auto!important;height:100svh!important;min-height:640px!important;overflow:hidden!important}
[data-v15-enhanced],[data-v152-scene]{overscroll-behavior:auto!important}
@media(min-width:981px){
  .v152-statement,.v152-qr,.v152-games,.v152-business,.v152-process,.v152-final{min-height:0!important}
}

.v14-loader.is-done{pointer-events:none!important}.v15-progress,.v152-scene-nav,.v15-cursor,.v15-cursor-ring{pointer-events:none!important}

/* V15.3.3 — early reveal / no blank runway */
@media(min-width:901px){
  .v152-qr,.v152-games,.v152-business,.v152-process,.v152-final{content-visibility:visible!important;}
  .v152-qr>.v14-section-shell,.v152-games>.v14-section-shell,.v152-business>.v14-section-shell,.v152-process>.v14-section-shell,.v152-final>.v14-section-shell{opacity:1;}
}
.v153-piece-wrap{backface-visibility:hidden;transform-origin:center center}

/* V15.3.5 — Product Explosion is the homepage opening scene */
.v14-home-body .v14-main{padding-top:0!important}
.v14-home-body .v153-explosion{margin-top:0!important}
.v14-home-body .v153-explosion-stage{padding-top:0}


/* =========================================================
   V15.4.6 — FINAL DESKTOP SCROLL LOCK + PIN GAP FIX
   Desktop scenes are exactly one viewport tall in CSS. GSAP ScrollTrigger
   creates the scroll runway and pins the actual section. This prevents the
   next section from entering the viewport before the current composition is
   complete. There are no 180–300vh sticky runways anymore.
   ========================================================= */
@media (min-width:981px){
  .v153-explosion{
    height:100dvh!important;
    min-height:0!important;
    overflow:hidden!important;
  }
  .v153-explosion-stage{
    position:relative!important;
    top:auto!important;
    height:100dvh!important;
    min-height:0!important;
    overflow:hidden!important;
  }

  .v154-scroll-scene{
    /* Do not make position !important here. ScrollTrigger must be able to
       switch the section to position:fixed while it is pinned. */
    position:relative;
    height:100dvh!important;
    min-height:0!important;
    padding:0!important;
    overflow:hidden!important;
    isolation:isolate;
  }
  .v154-stage{
    position:relative!important;
    top:auto!important;
    height:100dvh!important;
    min-height:0!important;
    overflow:hidden!important;
    display:flex;
    align-items:center;
    width:100%;
    padding:78px 0 42px;
  }
  .v154-stage>.v14-section-shell{
    position:relative;
    z-index:3;
    width:min(1180px,calc(100% - 40px));
    margin:auto;
  }
  .v152-games .v154-stage>.v14-section-shell,
  .v152-process .v154-stage>.v14-section-shell{align-self:center}
  .v152-final .v154-stage{justify-content:center;text-align:center}
  .v152-qr-backdrop,.v152-games-orbit,.v152-business-wash,
  .v152-process-line,.v152-final-fill,.v14-final-ring{position:absolute!important}

  /* Pre-JS first frame: phone + copy only. GSAP keeps this exact state until
     the first wheel/trackpad movement advances the pinned timeline. */
  .v153-explosion .wrap-phone{left:64%;top:53%;opacity:1;transform:translate(-50%,-50%) rotate(7deg) scale(.90)}
  .v153-explosion .wrap-qr,
  .v153-explosion .wrap-burger,
  .v153-explosion .wrap-cola,
  .v153-explosion .wrap-pizza,
  .v153-explosion .wrap-pasta,
  .v153-explosion .wrap-dessert,
  .v153-explosion .wrap-particles{
    opacity:0;
    filter:blur(10px);
    transform:translate(-50%,-50%) scale(.24);
  }

  .v153-piece-wrap,.v14-visual-card,.v14-game-card,
  .v14-panel-preview,.v14-process-grid article{
    will-change:transform,opacity,filter;
    backface-visibility:hidden;
  }
}

/* V14 becomes single-column at 980px. The cinematic pin engine therefore
   stops at the same breakpoint; 901–980px no longer receives desktop scroll
   transforms or a hidden-food state. */
@media (min-width:901px) and (max-width:980px){
  .v153-explosion{height:auto!important;min-height:auto!important;overflow:hidden!important}
  .v153-explosion-stage{
    position:relative!important;top:auto!important;height:auto!important;min-height:880px!important;
    padding:96px 28px 110px;display:flex;flex-direction:column;justify-content:flex-start;
  }
  .v153-explosion-copy{position:relative;left:auto;top:auto;transform:none;width:min(620px,100%);z-index:20}
  .v153-explosion-copy h2{font-size:clamp(58px,10vw,82px)}
  .v153-explosion-assets{position:relative;height:520px;margin-top:24px;inset:auto}
  .v153-piece-wrap{opacity:1!important;filter:none!important}
  .wrap-phone{left:50%;top:50%;width:195px;transform:translate(-50%,-50%) rotate(5deg)!important;z-index:12}
  .wrap-burger{left:2%;top:13%;width:230px;transform:rotate(-8deg)!important}
  .wrap-cola{left:auto;right:0;top:5%;width:160px;transform:rotate(10deg)!important}
  .wrap-pizza{left:auto;right:-4%;top:46%;width:205px;transform:rotate(6deg)!important}
  .wrap-pasta{left:-5%;top:59%;width:210px;transform:rotate(-5deg)!important}
  .wrap-dessert{left:auto;right:5%;top:70%;width:170px;transform:none!important}
  .wrap-qr{left:4%;top:37%;width:145px;transform:none!important;z-index:10}
  .wrap-particles{left:56%;top:44%;width:150px;transform:none!important}
  .v153-step-copy,.v153-explosion-meter,.v153-explosion-orbit{display:none}
  .v153-explosion-glow{width:95vw;opacity:.08;top:64%}

  .v154-scroll-scene{height:auto!important;min-height:auto!important;padding:0!important;overflow:hidden!important}
  .v154-stage{position:relative!important;top:auto!important;height:auto!important;min-height:auto!important;overflow:hidden!important;display:block!important;padding:96px 0!important}
}

@media (max-width:900px){
  .v153-explosion{height:auto!important;min-height:auto!important;overflow:hidden!important}
  .v153-explosion-stage{position:relative!important;top:auto!important;height:auto!important;min-height:880px!important}
  .v154-scroll-scene{height:auto!important;min-height:auto!important;padding:0!important;overflow:hidden!important}
  .v154-stage{position:relative!important;top:auto!important;height:auto!important;min-height:auto!important;overflow:hidden!important;display:block!important;padding:90px 0!important}
}


@media (max-width:620px){
  .v153-explosion-stage{min-height:830px!important}
}

@media (min-width:981px) and (max-height:800px){
  .v154-stage{padding:66px 0 26px}
  .v154-stage>.v14-section-shell{width:min(1120px,calc(100% - 48px))}
  .v14-copy h2,.v14-section-head h2,.v14-process h2{font-size:clamp(40px,4.8vw,66px)}
  .v14-visual-card{min-height:420px}
  .v14-section-head{margin-bottom:24px}
  .v14-process-grid article{min-height:190px}
}

