/* Cinematic motion layer */
:root{--cyan:#70f8ec;--ink:#080b10}
body{background:var(--ink)}
#energy-field{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:2;opacity:.52}
.cursor-glow{position:fixed;left:0;top:0;width:540px;height:540px;pointer-events:none;z-index:1;background:radial-gradient(circle,#70f8ec12,transparent 65%);transform:translate(calc(var(--pointer-x,50vw) - 50%),calc(var(--pointer-y,40vh) - 50%));transition:opacity .4s;mix-blend-mode:screen}
header,footer{position:relative;z-index:4}header{border-bottom-color:#70f8ec33;background:#080b10ef;backdrop-filter:blur(20px)}
nav a{position:relative}nav a:after{content:'';position:absolute;bottom:-8px;left:0;width:100%;height:1px;background:var(--cyan);transform:scaleX(0);transform-origin:left;transition:transform .35s}nav a:hover:after{transform:scaleX(1)}
.hero{isolation:isolate;background:radial-gradient(ellipse at 65% 20%,#173a4244,transparent 60%)}
.hero:before{content:'';position:absolute;inset:0;background-image:linear-gradient(#70f8ec09 1px,transparent 1px),linear-gradient(90deg,#70f8ec09 1px,transparent 1px);background-size:76px 76px;mask-image:linear-gradient(0deg,#000,transparent 85%);animation:grid-drift 20s linear infinite;z-index:-1}
.hero-art{transform:translate(var(--art-x,0px),var(--art-y,0px));transition:transform 1.2s ease-out}
.hero-art img{filter:contrast(1.2);opacity:.64}.hero-art:after{background:linear-gradient(90deg,#080b10 0%,#080b1099 23%,transparent 65%),linear-gradient(0deg,#080b10,transparent 35%)}
h1{animation:title-arrive 1.2s cubic-bezier(.16,1,.3,1) both}h1 em,h2 em{background:linear-gradient(110deg,var(--red) 15%,#ff806d 38%,#fff2d9 48%,var(--red) 58%,#fa4d69 80%);background-size:250% 100%;background-clip:text;-webkit-background-clip:text;color:transparent;animation:text-energy 9s ease-in-out infinite;text-shadow:0 0 35px #ef3e3118}
.hero .eyebrow{color:var(--cyan);animation:title-arrive 1s both}.hero .intro{animation:title-arrive 1.3s .1s both}.hero .button{animation:title-arrive 1.4s .2s both}
.orbit{position:absolute;z-index:2;border:1px solid #70f8ec44;border-radius:50%;width:460px;height:460px;left:20%;top:16%;pointer-events:none;animation:orbit-spin 26s linear infinite}.orbit:before,.orbit:after{content:'';position:absolute;width:7px;height:7px;background:var(--cyan);box-shadow:0 0 17px var(--cyan);border-radius:50%;left:50%;top:-4px}.orbit:after{top:auto;bottom:-4px;background:var(--red);box-shadow:0 0 17px var(--red)}.orbit-two{width:570px;height:570px;left:12%;top:8%;border-style:dashed;border-color:#ffffff22;animation-direction:reverse;animation-duration:40s}.red-disc{border-color:#ef3e3177;box-shadow:0 0 0 30px #ef3e310a,0 0 70px #ef3e3122}
.scan-beam{position:absolute;z-index:2;inset:0;background:linear-gradient(180deg,transparent 48%,#70f8ec25 50%,transparent 52%);transform:translateY(-100%);animation:scan-pass 12s ease-in-out infinite;pointer-events:none}.cross{color:var(--cyan);animation:cross-spin 18s linear infinite}
.hero-foot{color:#b6cecf}.hero-foot a{animation:float-small 3s ease-in-out infinite}
.button{position:relative;overflow:hidden;isolation:isolate;box-shadow:0 0 0 1px #ffffff14,0 8px 32px #0002}.button:before{content:'';position:absolute;inset:-100% -30%;background:linear-gradient(110deg,transparent 42%,#ffffff38 50%,transparent 58%);transform:translateX(-100%);animation:button-sheen 6s ease-in-out infinite;pointer-events:none}.button:hover{box-shadow:0 0 28px #ef3e3155}.button span{transition:transform .35s}.button:hover span{transform:translate(3px,-3px)}
.section{position:relative;isolation:isolate}.section-top{position:relative}.section-top:after{content:'';position:absolute;bottom:-22px;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,#70f8ec88,transparent);background-size:200% 100%;animation:line-flow 7s linear infinite}
.manga{background:linear-gradient(135deg,#edece5,#e1e7e4)}.manga:before,.contact:before{content:'';position:absolute;inset:0;z-index:-1;background:repeating-linear-gradient(90deg,transparent 0 100px,#153d4510 101px 102px);mask-image:linear-gradient(120deg,transparent,#0003);pointer-events:none}
.pages:before{content:'';position:absolute;inset:10% -5%;border:1px solid #1e817544;transform:rotate(-12deg);animation:frame-breathe 8s ease-in-out infinite}.page-front{animation:page-float-front 7s ease-in-out infinite}.page-back{animation:page-float-back 9s ease-in-out infinite}.page:hover{animation-play-state:paused;box-shadow:0 25px 65px #12383c44}.meta{flex-wrap:wrap;gap:20px}.meta b{line-height:1.6;max-width:240px}
.motion{background:radial-gradient(ellipse at 85% 30%,#12414c33,transparent 55%)}.film{transform-style:preserve-3d;perspective:900px}.film-image{border:1px solid #70f8ec30;transform:perspective(900px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .5s,border-color .4s,box-shadow .4s;will-change:transform}.film:hover .film-image{border-color:#70f8ec99;box-shadow:0 0 35px #70f8ec16}.film-image:after{content:'';position:absolute;inset:0;background:linear-gradient(115deg,transparent 30%,#70f8ec18 50%,transparent 70%);transform:translateX(-100%);animation:button-sheen 9s ease-in-out infinite;pointer-events:none}.film:nth-child(2) .film-image:after{animation-delay:3s}.play{border-color:var(--cyan);color:var(--cyan);box-shadow:0 0 25px #70f8ec25;animation:play-breathe 4s ease-in-out infinite}.film:hover .play{color:white}.film-title>span{color:var(--cyan)}
.creator:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent,#70f8ec0e,transparent);animation:scan-horizontal 12s ease-in-out infinite;z-index:-1}.creator-banner{animation:banner-breathe 16s ease-in-out infinite alternate}.avatar{box-shadow:0 0 0 6px #70f8ec0d,0 0 35px #70f8ec2a;animation:float-small 6s ease-in-out infinite}
.contact{background:linear-gradient(145deg,#edece5,#dce5e2)}input,textarea,select{transition:border-color .3s,box-shadow .3s}input:focus,textarea:focus,select:focus{border-color:#207b75;box-shadow:0 3px 0 #70f8ec55}.contact-mark{animation:float-small 4s ease-in-out infinite}footer{border-top:1px solid #70f8ec33}footer .brand{text-shadow:0 0 20px #70f8ec33}
body.paused .hero-art{transform:none}body.paused .film-image{transform:none}
@keyframes grid-drift{to{background-position:76px 76px}}@keyframes title-arrive{from{opacity:0;transform:translateY(35px);filter:blur(8px)}to{opacity:1;transform:none;filter:blur(0)}}@keyframes text-energy{0%,100%{background-position:100% 50%}50%{background-position:0% 50%}}@keyframes orbit-spin{to{transform:rotate(360deg)}}@keyframes cross-spin{to{transform:rotate(180deg)}}@keyframes scan-pass{0%,20%{transform:translateY(-100%)}75%,100%{transform:translateY(100%)}}@keyframes float-small{50%{transform:translateY(-8px)}}@keyframes button-sheen{0%,55%{transform:translateX(-100%)}85%,100%{transform:translateX(100%)}}@keyframes line-flow{to{background-position:200% 0}}@keyframes frame-breathe{50%{transform:rotate(-5deg) scale(1.04)}}@keyframes page-float-front{50%{transform:rotate(-5deg) translateY(-14px)}}@keyframes page-float-back{50%{transform:rotate(6deg) translateY(10px)}}@keyframes play-breathe{50%{box-shadow:0 0 0 12px #70f8ec08,0 0 35px #70f8ec33}}@keyframes scan-horizontal{50%{transform:translateX(25%)}}@keyframes banner-breathe{to{transform:scale(1.06)}}
@media(max-width:580px){.orbit{width:310px;height:310px;left:22%;top:27%}.orbit-two{width:370px;height:370px;left:12%;top:22%}.meta{display:grid;grid-template-columns:1fr 1fr}.meta>span:last-child{grid-column:1/-1}.cursor-glow{display:none}#energy-field{opacity:.32}.hero-art:after{background:linear-gradient(90deg,#080b10bb,transparent),linear-gradient(0deg,#080b10,transparent)}.creator{overflow:hidden}}
@media(prefers-reduced-motion:reduce){#energy-field,.cursor-glow,.scan-beam{display:none}.hero-art,.film-image{transform:none!important}h1{opacity:1;filter:none}}
.header-controls{display:flex;gap:12px;align-items:center}#language-picker{width:auto;max-width:120px;color:var(--paper);background:#10191e;border:1px solid #70f8ec66;border-radius:20px;padding:9px 12px;font-size:11px;color-scheme:dark;cursor:pointer}html:not([lang="es"]) h1{font-size:clamp(65px,8vw,125px)}html[lang="fr"] .title-row h2{font-size:clamp(44px,5.8vw,85px)}@media(max-width:850px){header{gap:12px;flex-wrap:wrap;height:auto;min-height:94px;padding-top:15px;padding-bottom:12px}header nav{order:3;width:100%;justify-content:space-between;padding:4px 0}.header-controls{margin-left:auto}}@media(max-width:580px){.header-controls{gap:6px}#language-picker{max-width:100px;padding:7px 8px;font-size:10px}html:not([lang="es"]) .hero h1{font-size:clamp(54px,16vw,92px)}html[lang="fr"] .title-row h2{font-size:clamp(40px,11vw,58px)}}
