/* Refinamiento sobre la misma base. Paleta provisional del mockup-02 local. */
:root{--accent:#7357ff;--brand-gradient:linear-gradient(100deg,#3d2ddd,#7357ff 48%,#a776ff)}
em{background-image:var(--brand-gradient)}
.hero{min-height:690px;height:calc(100svh - 78px);max-height:900px;isolation:isolate;background:radial-gradient(ellipse at 50% 110%,#7357ff1a,transparent 46%)}
.hero-copy{padding-top:65px}.hero h1{margin-top:0}.hero-bottom{position:absolute;bottom:0;left:0;right:0;z-index:3}.hero-bottom a{background:#f5f5f7d9;backdrop-filter:blur(12px);padding:7px 16px;border-radius:30px}.hero-bottom .edition{letter-spacing:.2em}
.hero-object{position:absolute;left:50%;bottom:-150px;width:650px;height:360px;transform:translateX(-50%);perspective:1200px;z-index:1;pointer-events:none}
.orbit{position:absolute;left:50%;top:46%;width:390px;height:390px;transform:translate(-50%,-50%);transform-style:preserve-3d}
.orb{position:absolute;inset:86px;border-radius:48% 52% 61% 39%/45% 37% 63% 55%;background:radial-gradient(circle at 30% 22%,#fff 0 3%,#d6ccff 10%,#8e76ff 31%,#4630c8 56%,#190d54 78%,#07050d 100%);box-shadow:inset -26px -34px 60px #050214aa,inset 24px 18px 38px #ffffff60,0 45px 100px #5737ee40;animation:orb-morph 8s ease-in-out infinite;animation-play-state:paused}
.ring{position:absolute;inset:37px;border:1px solid #7357ff60;border-radius:50%;transform-style:preserve-3d}.ring-a{transform:rotateX(68deg) rotateZ(18deg);animation:orbit-a 13s linear infinite;animation-play-state:paused}.ring-b{inset:63px;transform:rotateY(70deg) rotateX(18deg);border-color:#3e2bb448;animation:orbit-b 17s linear infinite reverse;animation-play-state:paused}.satellite{position:absolute;left:48%;top:-4px;width:9px;height:9px;border-radius:50%;background:#fff;box-shadow:0 0 20px 5px #b69cff}
.hero.scene-visible .orb,.hero.scene-visible .ring{animation-play-state:running}
@keyframes orb-morph{50%{border-radius:64% 36% 42% 58%/58% 62% 38% 42%;transform:rotate(6deg) scale(1.04)}}@keyframes orbit-a{to{transform:rotateX(68deg) rotateZ(378deg)}}@keyframes orbit-b{to{transform:rotateY(430deg) rotateX(18deg)}}
.hero-actions .button,.work-caption .button,.comparison-foot .button{background-size:220% 100%;background-image:linear-gradient(100deg,#161617 0 45%,#3d2ddd 65%,#7357ff 82%,#a776ff);color:white;transition:background-position .65s,transform .4s,box-shadow .4s}
.hero-actions .button:hover,.hero-actions .button:focus-visible,.work-caption .button:hover,.work-caption .button:focus-visible,.comparison-foot .button:hover,.comparison-foot .button:focus-visible{background-position:100% 50%;box-shadow:0 12px 30px #7357ff30;transform:translateY(-3px)}
.work{position:relative;background:radial-gradient(ellipse at 85% 12%,#7357ff22,transparent 48%),radial-gradient(ellipse at 10% 90%,#7357ff12,transparent 40%),#0b0b10;padding-bottom:45px}
.media-stage{border-radius:18px;box-shadow:0 30px 90px #0006,0 0 0 1px #ffffff20,0 0 70px #7357ff12}
.category-tabs{border:0;gap:10px;padding:7px;background:#ffffff06;border-radius:40px;margin-bottom:28px;width:fit-content;max-width:96%}
.category-tabs button{padding:13px 20px;border-radius:30px;transition:background .4s,color .4s,box-shadow .4s}.category-tabs button:after{display:none}.category-tabs button[aria-selected=true]{background:#ffffff12;box-shadow:inset 0 0 0 1px #b69cff44;color:white}.category-tabs button[aria-selected=true] span{color:#b69cff}
.media-controls button{height:40px;min-width:40px}.media-controls svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;display:block}.video-progress span{background:linear-gradient(90deg,#7357ff,#c3acff)}.work-caption{padding-top:35px}.work-caption h3{font-size:30px}.work-caption .button,.comparison-foot .button{box-shadow:inset 0 0 0 1px #ffffff30}
.needs-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:start;gap:18px;margin-top:60px;padding:8px 0 20px}
.need-card{border:1px solid #e0ddea;border-radius:24px;background:linear-gradient(145deg,#fff,#f0eef6);box-shadow:0 12px 28px #30224c06;transition:transform .6s var(--ease),box-shadow .6s,border-color .6s;overflow:hidden;min-width:0}
.need-card.selected{transform:translateY(-8px);border-color:#7357ff60;box-shadow:0 24px 50px #5434c514;background:linear-gradient(135deg,#fff,#eeebff)}
.need-card-toggle{display:flex;flex-direction:column;align-items:flex-start;position:relative;text-align:left;width:100%;padding:28px 22px;gap:35px;min-height:210px}
.need-icon{display:grid;place-items:center;width:58px;height:58px;border-radius:16px;background:linear-gradient(135deg,#f6f3ff,#b69cff);box-shadow:4px 5px 0 #8065c840,0 12px 25px #7357ff20,inset 1px 1px 0 #fff;transform:perspective(300px) rotateY(-17deg) rotateX(12deg);transition:transform .6s,box-shadow .6s;color:#4930a2}
.need-icon svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}.need-card.selected .need-icon,.need-card:hover .need-icon{transform:perspective(300px) rotateY(10deg) rotateX(-5deg) translateY(-4px);box-shadow:-3px 5px 0 #8065c830,0 16px 30px #7357ff25,inset 1px 1px 0 #fff}
.need-card-title{font-size:23px;letter-spacing:-.04em;line-height:1.15;max-width:160px}.need-plus{position:absolute;right:18px;top:26px;font-size:23px;color:#8c7dac;transition:transform .45s}.selected .need-plus{transform:rotate(45deg)}
.need-detail{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .55s var(--ease),opacity .4s}.need-detail>div{min-height:0;overflow:hidden;padding:0 22px}.selected .need-detail{grid-template-rows:1fr;opacity:1}.need-detail p{font-size:13px;line-height:1.7;color:#706a7b}.need-detail .text-button{margin:16px 0 25px;color:#5034ad}
.method{background:radial-gradient(ellipse at 90% 60%,#7357ff0d,transparent 60%),#ececee}.method-copy{position:relative;z-index:3}.method-visual{height:500px;isolation:isolate;--spread:0;--shine:20%}.layer-stack{width:85%;height:270px;top:185px;left:6%}.layer{transform:translate3d(0,calc(var(--i)*var(--spread)*-12px),calc(var(--i)*12px + var(--i)*var(--spread)*53px));border-color:#dcd3ff;background:linear-gradient(120deg,#f9f7ff,#c4b5f4 30%,#f8f5ff 50%,#b7a5eb 75%,#e8e2f6);background-size:220% 100%;background-position:var(--shine) 50%;box-shadow:0 4px 0 #a79abb,0 15px 25px #33313c18;color:#2c2147}
.layer:nth-child(2){background-image:linear-gradient(120deg,#f7f4ff,#ac94f0 30%,#e6deff 50%,#9478d8 75%,#dcd3f5)}.layer:nth-child(3){background-image:linear-gradient(120deg,#dcd3ff,#8563dd 30%,#eee5ff 50%,#a68bdf 75%,#c4b1f0)}.layer:nth-child(4){background-image:linear-gradient(120deg,#f4efff,#b69cff 30%,#fff 50%,#af9ad9 75%,#e8dafa)}.layer:last-child{background-image:linear-gradient(120deg,#fff,#e2d7ff 30%,#fff 50%,#c5b2ea 75%,#f2ecff)}
.layer strong{font-weight:500}.layer:after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 #fff6;pointer-events:none}.method-current{min-height:115px}
.comparison{background:radial-gradient(ellipse at 90% 45%,#7357ff14,transparent 55%),#101011}.comparison-head{gap:0;padding-bottom:0;border:0;margin-top:40px;padding-top:0}.comparison-head span{padding:22px 28px;background:#ffffff04;border:1px solid #ffffff10;border-radius:18px 18px 0 0}.comparison-head span:last-child{background:#7357ff16;color:#d7c8ff;border-color:#b69cff25;font-weight:600}
.compare-row{gap:0;padding:0;border:0}.compare-row p{padding:27px 28px;border:1px solid #ffffff0b;background:#ffffff03;margin-top:-1px}.compare-row p:last-child{position:relative;padding-left:65px;background:#7357ff0b;border-color:#b69cff18}.compare-row p:last-child:before{content:"✓";position:absolute;left:27px;top:29px;display:grid;place-items:center;width:21px;height:21px;border-radius:50%;font-size:12px;color:#9ed5b1;background:#82c49b15;border:1px solid #82c49b30}.compare-row:last-of-type p{border-radius:0 0 18px 18px}
.paths{gap:35px}.paths article{padding:35px;border-radius:24px;background:linear-gradient(135deg,#fff,#eeebf6);border:1px solid #e4dff0}.path-art{height:75px}.path-art span{height:2px}.path-art.one i{background:#7357ff;border-color:#7357ff;box-shadow:0 0 0 7px #7357ff10}.path-art.continuous i{background:#f5f1ff}.path-visible .path-art.one i{animation:single-path 5s var(--ease) infinite}.path-visible .path-art.continuous i{animation:path-beat 3s ease-in-out infinite}.path-art.continuous i:nth-of-type(2){animation-delay:.5s}.path-art.continuous i:nth-of-type(3){animation-delay:1s}@keyframes single-path{0%,15%{left:0;opacity:0}25%{opacity:1}75%,100%{left:82%;opacity:1}}@keyframes path-beat{50%{box-shadow:0 0 0 9px #7357ff16;transform:scale(1.25);border-color:#7357ff}}
.future{background:radial-gradient(ellipse at 0 60%,#7357ff12,transparent 55%),#eeedf2}.future-list{display:grid;gap:16px}.future-list details,.future-list details:last-child{border:1px solid #dcd7e8;border-radius:20px;background:#ffffffb0;padding:0 28px;transition:background .45s,box-shadow .45s}.future-list details[open]{background:#fff;box-shadow:0 15px 40px #39266207}.future-list summary{padding:27px 0}.future-list summary>span{width:38px;height:38px;display:grid;place-items:center;border:1px solid #dcd2f0;border-radius:12px;background:linear-gradient(145deg,#fff,#e3d9fa);color:#76599f}.future-list h3{font-size:32px}.future-list small{max-width:none}.coming-soon{display:inline-block;font-weight:650;color:#65439f;background:#eee6fc;border:1px solid #d8c5f7;padding:6px 9px;border-radius:20px;margin-left:5px}.future-content{padding-left:68px;animation:none}.future-list details[data-expanded=false] i{transform:none}
.faq{background:#faf9fc;gap:6%}.faq-list{display:grid;gap:12px;align-content:start}.faq details{border:1px solid #e6e0ef;border-radius:16px;padding:0 22px;background:#fff;transition:box-shadow .35s,border-color .35s}.faq details[open]{border-color:#cdbbea;box-shadow:0 10px 24px #54347508}.faq summary{font-size:14px;padding:22px 0}.faq summary span{color:#7357ff}.faq details p{animation:none;padding-right:15px}.faq details[data-expanded=false] summary span{transform:none}
@media(max-width:1100px){.needs-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.need-card-toggle{min-height:190px}.need-card-title{max-width:none}.future-list h3{font-size:27px}.layer-stack{height:230px}}
@media(max-width:900px){.hero{min-height:660px}.hero-copy{padding-top:60px}.method{height:240svh;min-height:1450px}.method-sticky{height:100svh;min-height:650px;max-height:none;display:flex;flex-direction:column;align-items:stretch;gap:0;padding:95px 6% 24px;overflow:hidden}.method h2{font-size:40px;margin:15px 0}.method-description{font-size:13px;max-width:500px}.method-current{margin-top:18px;min-height:92px}.method-current h3{font-size:22px}.method-current p{font-size:12px}.method-visual{height:280px;min-height:220px;width:100%;max-width:480px;margin:0 auto;flex:1;overflow:hidden}.layer-stack{width:62%;height:150px;left:19%;top:150px}.layer{padding:13px;transform:translate3d(0,calc(var(--i)*var(--spread)*-8px),calc(var(--i)*7px + var(--i)*var(--spread)*28px))}.layer small{font-size:7px}.layer strong{font-size:17px}.method-steps{position:static;margin:14px 0 0;flex-shrink:0;gap:10px}.method-steps li{font-size:8px;padding-top:8px}.method-steps li:before{font-size:7px;margin-bottom:5px}.future-list summary{gap:18px}.future-list small{font-size:9px}.future-content{padding-left:56px}.paths article{padding:26px}}
@media(max-width:600px){.hero{height:calc(100svh - 65px);min-height:625px;max-height:780px}.hero-copy{padding-top:60px}.hero h1{margin-top:0}.hero-object{width:100%;height:310px;bottom:-125px}.orbit{width:340px;height:340px}.orb{inset:78px}.ring{inset:35px}.ring-b{inset:56px}.hero-bottom{font-size:7px}.work{padding-bottom:32px}.category-tabs{gap:4px;margin-left:0;max-width:100%;padding:5px;border-radius:24px}.category-tabs button{font-size:10px;padding:11px 12px}.media-stage{border-radius:10px}.media-controls button{height:30px;min-width:30px}.media-controls svg{width:13px;height:13px}.work-caption h3{font-size:19px}.work-caption{padding-top:24px}.needs-grid{gap:15px;margin-top:35px;grid-template-columns:1fr}.need-card-toggle{flex-direction:row;align-items:center;min-height:120px;padding:24px;gap:25px}.need-card-title{font-size:24px;max-width:200px;padding-right:22px}.need-icon{width:50px;height:50px;flex-shrink:0}.need-plus{right:20px;top:47px}.need-card.selected{transform:translateY(-3px)}.need-detail>div{padding:0 24px}.need-detail p{font-size:13px}.method-sticky{padding-top:82px}.method h2{font-size:36px}.method-current{min-height:100px;margin-top:16px;max-width:none}.method-current p{max-width:310px}.method-visual{min-height:205px}.layer-stack{top:130px;height:140px;width:66%;left:17%}.layer strong{font-size:16px}.method-steps li{font-size:7px}.comparison-head{margin-top:30px;font-size:10px}.comparison-head span{padding:17px 12px}.compare-row{font-size:12px;line-height:1.55}.compare-row p{padding:21px 12px}.compare-row p:last-child{padding:21px 12px 21px 35px}.compare-row p:last-child:before{left:11px;top:24px;width:15px;height:15px;font-size:9px}.comparison-foot{margin-top:32px}.paths{gap:23px}.paths article{padding:25px}.paths h3{font-size:27px}.future-list details,.future-list details:last-child{padding:0 18px;border-radius:16px}.future-list summary{grid-template-columns:26px 1fr 16px;gap:8px 12px}.future-list summary>span{width:25px;height:25px;font-size:8px;padding:0}.future-list h3{font-size:23px}.future-list small{font-size:9px}.coming-soon{margin:5px 0 0 3px;padding:4px 7px}.future-content{padding-left:38px;padding-right:0}.future-content strong{font-size:20px}.faq details{padding:0 18px}.faq summary{font-size:14px}.faq details p{font-size:13px}.closing h2{font-size:47px}}
@media(max-width:900px) and (max-height:720px){.method-sticky{position:relative;height:auto;min-height:0;overflow:visible}.method{height:auto;min-height:0}.method-current{display:none}.method-visual{height:280px;flex:none;overflow:hidden}.method-steps{display:grid;grid-template-columns:1fr;gap:20px}.method-steps li{font-size:16px;color:var(--ink)}.phase-description{display:block;font-size:12px;line-height:1.6;margin-top:9px;color:#72727b}}
@media(prefers-reduced-motion:reduce){.hero-object .orb,.hero-object .ring{animation:none}.method{height:auto;min-height:0}.method-sticky{position:relative;height:auto;min-height:0;max-height:none;overflow:visible}.method-visual{height:300px;min-height:300px;flex:none}.method-current{display:none}.method-steps{display:grid;position:static;grid-template-columns:1fr;gap:20px}.method-steps li{font-size:16px;color:var(--ink)}.phase-description{display:block;font-size:13px;line-height:1.6;color:#72727b;margin-top:10px}.need-card.selected{transform:none}.future-content,.faq details p{animation:none}}
