:root{--yellow:#f8b900;--ink:#111110;--paper:#f6f5f0;--muted:#66655f;--line:#dcdad1}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:95px}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.5 'DM Sans',sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:3px solid #a87600;outline-offset:5px}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:Manrope,sans-serif;letter-spacing:-.055em;line-height:1.06}header{position:sticky;top:0;height:88px;z-index:20;display:flex;align-items:center;justify-content:space-between;padding:0 5%;background:#f6f5f0ed;backdrop-filter:blur(15px);border-bottom:1px solid #1111}.brand{display:flex;align-items:center;gap:3px}.brand-logo{display:block;width:auto;height:50px}nav{display:flex;gap:32px;font-size:14px;font-weight:700}.button{display:inline-flex;align-items:center;justify-content:center;gap:26px;padding:17px 25px;border:1px solid var(--ink);background:var(--ink);color:white;border-radius:40px;font-weight:700;transition:transform .2s,box-shadow .2s}.button:hover{transform:translateY(-3px);box-shadow:0 8px 0 #f8b900}.button.small{padding:11px 20px;font-size:14px}.progress{position:fixed;top:0;left:0;height:4px;background:var(--yellow);width:0;z-index:40}.eyebrow{display:block;font-size:12px;letter-spacing:.14em;font-weight:800}.hero{max-width:1440px;margin:auto;display:grid;grid-template-columns:1fr 1fr;align-items:center;padding:55px 5% 70px;min-height:690px;gap:20px}.hero h1{font-size:clamp(55px,6.8vw,100px);margin:25px 0}em{font-style:normal;position:relative;z-index:0}em:after{content:'';position:absolute;bottom:2px;left:-4%;width:110%;height:23%;background:var(--yellow);z-index:-1;transform:rotate(-4deg)}.hero p{color:var(--muted);font-size:20px;margin-bottom:30px}.text-link{display:inline-block;border:0;background:none;padding:12px 0;font-weight:700;border-bottom:1px solid var(--ink)}.hero .text-link{display:block;width:max-content;margin-top:12px}.hero-world{position:relative;height:590px}.art{background-image:var(--art);background-size:cover;background-repeat:no-repeat;background-position:50% 50%}.art0{--art:url('scene-0.webp?v=orange20261024');background-position:50% 40%}.art1{--art:url('scene-1.webp?v=orange20261024')}.art2{--art:url('scene-2.webp?v=orange20261024');background-position:50% 30%}.art3{--art:url('scene-3.webp?v=orange20261024')}.art4{--art:url('scene-4.webp?v=orange20261024')}.art5{--art:url('scene-5.webp?v=orange20261024')}.hero-art{height:100%;width:90%;margin:auto;border-radius:160px 160px 30px 30px;animation:levitate 7s ease-in-out infinite}.orbit-label{position:absolute;z-index:2;border:1px solid var(--ink);background:#fff;border-radius:18px;padding:13px 20px;font-weight:700;box-shadow:5px 5px 0 var(--ink);animation:levitate 5s ease-in-out infinite}.label1{top:10%;left:-5%;transform:rotate(-6deg)}.label1 span{color:#b28200}.label2{right:-1%;top:45%;color:#b28200;animation-delay:-2s}.label2 span{display:block;color:var(--ink);font-size:13px}.label3{bottom:10%;left:4%;background:var(--yellow);animation-delay:-3s}.world-caption{position:absolute;bottom:-25px;width:100%;text-align:center;font-size:11px;letter-spacing:.2em}.ticker{background:var(--yellow);border-block:1px solid var(--ink);overflow:hidden;padding:17px 0;font-size:19px;font-weight:800;letter-spacing:.06em}.ticker div{width:max-content;animation:marquee 28s linear infinite;word-spacing:24px}.journey{background:var(--ink);color:white;padding:100px 6% 90px}.section-heading{text-align:center}.section-heading h2{font-size:clamp(40px,5vw,65px);margin:16px 0}.section-heading p{color:#aaa;font-size:17px}.journey .eyebrow{color:var(--yellow)}.path{max-width:1100px;margin:65px auto 0;position:relative}.path-track{position:absolute;top:30px;bottom:190px;left:50%;width:3px;background:#45443f}.path-fill{width:100%;height:0;background:var(--yellow)}.step{display:grid;grid-template-columns:1fr 1fr;gap:130px;align-items:center;position:relative;margin-bottom:70px}.step-number{position:absolute;top:47%;left:50%;transform:translate(-50%,-50%);background:var(--yellow);border:9px solid var(--ink);width:65px;height:65px;border-radius:50%;display:grid;place-content:center;color:var(--ink);font-weight:800;font-size:14px;z-index:3}.step-copy{padding-left:40px}.step-copy h3{font-size:clamp(37px,4.4vw,59px);margin:20px 0}.step-copy p{color:#b9b8b2;font-size:18px}.step-copy .text-link{color:white;border-color:#555;margin-top:15px}.scene{position:relative;border:0;padding:0;display:block;width:100%;height:480px;border-radius:30px;background:#eeede7;overflow:hidden;transition:transform .4s}.scene:hover{transform:rotate(2deg) scale(1.025)}.scene .art{height:100%;transition:transform .5s}.scene:hover .art{transform:scale(1.07)}.scene-pill{position:absolute;top:22px;left:20px;background:white;color:var(--ink);padding:10px 16px;border-radius:30px;font-size:14px}.scene-action{position:absolute;bottom:20px;right:20px;background:var(--yellow);color:var(--ink);padding:12px 18px;border-radius:50px;font-weight:800;font-size:14px}.reverse .step-copy{grid-column:2;grid-row:1;padding:0}.reverse .scene{grid-column:1;grid-row:1}.fork{position:relative;text-align:center}.fork-label{display:inline-block;background:var(--ink);padding:20px;letter-spacing:.15em;font-size:12px;color:var(--yellow)}.fork-cards{display:grid;grid-template-columns:1fr 1fr;gap:40px;max-width:850px;margin:20px auto}.mini-scene{border:1px solid #4a4943;background:#21211e;border-radius:25px;overflow:hidden;padding:0;text-align:left;color:white;transition:.3s}.mini-scene:hover{transform:translateY(-10px);border-color:var(--yellow)}.mini-scene .art{height:330px;background-color:#e5e4dc}.mini-scene>span{display:block;padding:22px;font-size:15px;color:#ccc}.mini-scene b{display:block;font-size:22px;color:white;margin-top:4px}.journey-end{font-family:Manrope;font-size:28px;font-weight:700;padding-top:30px}.journey-end span{color:var(--yellow);display:inline-block;animation:spin 18s linear infinite}.playground{padding:100px 6%}.playground .section-heading p{color:var(--muted)}.play-layout{max-width:1050px;margin:50px auto 0;display:grid;grid-template-columns:.9fr 1.1fr;gap:50px;align-items:center}.play-intro{position:relative}.play-intro .art{height:370px;border-radius:25px}.sample-tag{display:block;margin-top:20px;font-size:11px;font-weight:800;letter-spacing:.12em;color:var(--muted)}.play-intro h3{font-size:38px;margin:9px 0 20px}.play-controls{display:flex;gap:8px}.choice,.category{border:1px solid var(--line);border-radius:30px;background:white;padding:10px 16px;font-size:14px;font-weight:700}.choice.active,.category.active{background:var(--yellow);border-color:var(--ink)}.demo-surface{background:white;border:1px solid var(--line);border-radius:28px;overflow:hidden;box-shadow:0 24px 65px #0001;min-height:510px}.demo-head{background:var(--ink);color:white;padding:24px}.demo-head b{display:block;font-size:21px}.demo-head small{color:#c8c6be}.demo-body{padding:24px}.categories{display:flex;gap:7px;overflow:auto;padding-bottom:15px}.category{font-size:13px;padding:8px 12px}.dish{display:flex;justify-content:space-between;align-items:center;gap:12px;border-bottom:1px solid #eee;padding:15px 0;animation:enter .25s}.dish b{font-size:15px}.dish small{display:block;font-size:12px;color:var(--muted)}.dish-price{display:flex;align-items:center;gap:9px;font-weight:700;font-size:14px}.add,.qty{border:0;background:var(--yellow);border-radius:50%;width:30px;height:30px;font-size:20px}.order-button{width:100%;border:0;border-radius:14px;background:var(--ink);color:white;padding:15px;margin-top:20px;font-weight:700}.demo-note{font-size:12px;color:var(--muted);margin-top:12px}.review{background:var(--paper);border-radius:16px;padding:17px;margin-top:14px}.review p{margin-top:8px}.stars{color:#ad7d00}.rating{font-size:48px;font-weight:800;line-height:1}.profile-art{height:210px;background-color:var(--paper)}.social{display:block;width:100%;padding:13px 16px;margin-top:10px;border:1px solid var(--line);background:white;border-radius:13px;text-align:left;font-weight:700}.social:hover{background:var(--yellow)}.avatar{background:var(--yellow);border-radius:50%;width:60px;height:60px;display:grid;place-content:center;font-weight:800;margin-bottom:12px}.final-cta{background:var(--yellow);padding:95px 7%;position:relative;overflow:hidden}.final-cta h2{font-size:clamp(45px,7vw,92px);margin:20px 0 35px}.final-cta em:after{background:white}.giant-star{position:absolute;right:9%;top:20%;font-size:250px;line-height:1;animation:spin 35s linear infinite}footer{background:var(--ink);color:white;padding:30px 6%;display:flex;justify-content:space-between;gap:20px;font-size:14px}footer span{color:#aaa}dialog{padding:0;border:0;border-radius:28px;width:min(510px,calc(100% - 24px));max-height:88vh;overflow:auto;background:white;box-shadow:0 30px 130px #0007}dialog::backdrop{background:#000a;backdrop-filter:blur(7px)}.close{position:sticky;float:right;right:10px;top:10px;z-index:3;width:35px;height:35px;margin:10px 10px -45px 0;border:0;border-radius:50%;background:white;font-size:26px;box-shadow:0 3px 15px #0002}.modal-art{height:310px;background-color:var(--paper)}.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,20px);z-index:60;background:var(--ink);color:white;border:1px solid var(--yellow);border-radius:40px;padding:13px 23px;opacity:0;pointer-events:none;transition:.3s;max-width:90vw}.toast.show{opacity:1;transform:translate(-50%,0)}.reveal{transition:opacity .7s,translate .7s}.motion-ready .reveal:not(.visible){opacity:0;translate:0 30px}@keyframes levitate{50%{translate:0 -12px}}@keyframes spin{to{rotate:360deg}}@keyframes marquee{to{transform:translateX(-50%)}}@keyframes enter{from{opacity:0;transform:translateY(8px)}}
@media(min-width:1450px){.hero-art{width:78%}}@media(max-width:950px){.hero{grid-template-columns:1fr 1fr;padding-inline:4%;min-height:600px}.hero h1{font-size:60px}.hero-world{height:480px}.hero p{font-size:17px}.orbit-label{font-size:12px;padding:10px}.step{gap:75px}.scene{height:380px}.step-copy{padding:0}.step-copy h3{font-size:41px}.play-layout{gap:25px}.giant-star{right:5%;font-size:170px}.hero-art{width:100%}}@media(max-width:650px){header{height:73px;padding-inline:5%}.brand-logo{height:42px}nav{display:none}.hero{display:flex;flex-direction:column;padding:38px 6% 50px;align-items:stretch;gap:20px}.hero h1{font-size:62px;margin:18px 0}.hero-copy .eyebrow{font-size:10px}.hero p{font-size:17px}.hero .text-link{display:inline-block;margin-left:12px;font-size:13px}.hero .button{padding:13px 19px}.hero-world{height:470px;max-width:410px;width:100%;margin:auto}.hero-art{width:85%;border-radius:130px 130px 25px 25px}.label1{left:0}.label2{right:0}.ticker{font-size:15px}.journey{padding:70px 5%}.section-heading h2{font-size:38px}.section-heading p{font-size:15px}.path{margin-top:40px}.path-track{left:20px;bottom:120px}.step,.step.reverse{display:flex;flex-direction:column;gap:22px;align-items:stretch;padding-left:55px;margin-bottom:55px}.step-number{left:20px;top:25px;width:47px;height:47px;border-width:6px;font-size:11px}.step-copy h3{font-size:39px;margin:10px 0}.step-copy p{font-size:16px}.step-copy .text-link{display:none}.scene{height:370px;border-radius:22px}.scene-pill{left:12px;top:12px;font-size:12px}.scene-action{bottom:13px;right:13px;padding:10px 15px;font-size:12px}.fork{margin-left:55px}.fork-cards{grid-template-columns:1fr;gap:22px}.mini-scene .art{height:340px}.journey-end{font-size:23px;background:var(--ink)}.playground{padding:65px 5%}.play-layout{grid-template-columns:1fr;margin-top:30px}.play-intro .art{height:270px;background-position:50% 60%}.play-intro h3{font-size:32px}.play-controls{margin-bottom:10px}.demo-surface{min-height:0}.final-cta{padding:65px 6%}.final-cta h2{font-size:52px}.final-cta .eyebrow{max-width:230px;font-size:10px}.giant-star{font-size:110px;right:4%;top:13%}footer{flex-direction:column;font-size:12px}.modal-art{height:290px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.motion-ready .reveal:not(.visible){opacity:1;translate:none}}
/* Keep the original 2:3 scene proportions inside wide example windows. */
.art.modal-art,.art.profile-art{background-image:none;position:relative;display:flex;justify-content:center;overflow:hidden;background-color:#f6f5f0;height:310px;}
.art.modal-art::before,.art.profile-art::before{content:'';display:block;height:100%;aspect-ratio:2/3;flex:none;background-image:var(--art);background-size:cover;background-position:center;background-repeat:no-repeat;}
[data-view="profile"]>.demo-body{text-align:center;}
[data-view="profile"]>.demo-body .avatar{margin-inline:auto;}
[data-view="profile"]>.demo-body .social{text-align:center;}
@media(max-width:550px){.art.modal-art,.art.profile-art{height:280px;}}
/* APE Points: naranja del logo (--yellow conserva el nombre original de la variable) */
:root{--yellow:#ff681a;--brand-grad:linear-gradient(135deg,#ff9b22 0%,#ff681a 52%,#ef4814 100%);--ink:#111111;--paper:#f7f5f2;--muted:#64605c;--line:#e4ddd5}
button:focus-visible,a:focus-visible{outline-color:#d2470b}.stars{color:#e8590c}.step-copy .text-link{border-color:#6f6a66}.label1 span,.label2{color:#d2470b}
.button:hover{box-shadow:0 8px 0 #ff681a}.ticker,.final-cta,.progress{background:var(--brand-grad)}
@media(max-width:360px){.brand-logo{height:32px}}
