@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&family=Space+Mono:wght@400;700&display=swap');
:root{--bg:#08090d;--panel:#10131a;--line:#ffffff16;--txt:#f4f4f6;--muted:#969daa;--red:#ff2848;--cyan:#59e8ff;--mono:'Space Mono',monospace;--font:Inter,Arial,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:80px}body{margin:0;background:radial-gradient(ellipse at 80% 10%,#66102735,transparent 35%),radial-gradient(ellipse at 10% 60%,#104b5b18,transparent 35%),var(--bg);color:var(--txt);font-family:var(--font);overflow-x:hidden}body:after{content:"";position:fixed;inset:0;pointer-events:none;z-index:10;opacity:.08;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.2'/%3E%3C/svg%3E")}a{color:inherit;text-decoration:none}.wrap{width:min(1120px,calc(100% - 40px));margin:auto}.mono{font-family:var(--mono);letter-spacing:.14em}.top{height:70px;position:sticky;top:0;z-index:20;background:#08090dd9;backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}nav{height:100%;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:.12em}.mark{width:34px;height:38px;display:grid;place-items:center;clip-path:polygon(50% 0,100% 22%,88% 82%,50% 100%,12% 82%,0 22%);background:linear-gradient(145deg,var(--red),#800b27);font:700 14px var(--mono);box-shadow:0 0 25px #ff28484a}.brand small{color:#858b98}.links{display:flex;gap:28px;font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#adb2bd}.links a:hover{color:var(--red)}.cta,.btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 17px;border:1px solid #ff284877;background:#ff28481a;border-radius:4px;color:white;font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;transition:.25s}.cta:hover,.btn:hover{background:var(--red);transform:translateY(-2px);box-shadow:0 0 28px #ff284855}.menu{display:none;background:none;border:0;color:white;font-size:24px}.hero{min-height:650px;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:25px;position:relative;padding:65px 0 75px}.eyebrow,.kicker{font:700 10px var(--mono);letter-spacing:.22em;color:var(--red);text-transform:uppercase}.eyebrow:before{content:"";display:inline-block;width:25px;height:1px;background:var(--red);vertical-align:middle;margin-right:12px;box-shadow:0 0 9px var(--red)}h1{font-size:clamp(52px,7.2vw,88px);line-height:.94;letter-spacing:-.075em;margin:23px 0;font-weight:900}h1 span{color:transparent;-webkit-text-stroke:1px #e4e5e9}h1 b{color:var(--red);text-shadow:0 0 38px #ff284833}.desc{max-width:510px;color:#a4aab5;font-size:14px;line-height:1.85}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:27px}.btn.secondary{border-color:var(--line);background:#ffffff08;color:#c4c8d0}.statusline{font:9px var(--mono);letter-spacing:.12em;color:#78808d;margin-top:30px}.statusline i{color:var(--cyan);font-style:normal}.art{height:510px;display:grid;place-items:center;position:relative}.orbit{position:absolute;width:min(440px,100%);aspect-ratio:1;border:1px solid #ff28482b;border-radius:50%;box-shadow:inset 0 0 70px #ff28480b,0 0 70px #ff28480b;animation:spin 28s linear infinite}.orbit:before,.orbit:after{content:"";position:absolute;inset:30px;border:1px dashed #59e8ff30;border-radius:50%;transform:rotateX(67deg) rotateZ(25deg)}.orbit:after{inset:75px;border-color:#ff28482c;transform:rotateX(70deg) rotateZ(-30deg)}@keyframes spin{to{transform:rotate(360deg)}}.avatar{width:min(360px,83%);aspect-ratio:1;position:relative;animation:float 6s ease-in-out infinite;filter:drop-shadow(0 24px 45px #000)}.avatar:before{content:"";position:absolute;inset:-2px;border-radius:50%;background:conic-gradient(transparent,var(--red),transparent 38%,var(--cyan),transparent 78%);animation:spin 8s linear infinite}.avatar img{position:absolute;inset:5px;width:calc(100% - 10px);height:calc(100% - 10px);object-fit:cover;border-radius:50%;mask-image:radial-gradient(circle,#000 58%,transparent 100%)}@keyframes float{50%{transform:translateY(-12px)}}.hud{position:absolute;padding:11px 13px;border:1px solid #ffffff20;background:#0a0c12d9;backdrop-filter:blur(12px);font:8px var(--mono);letter-spacing:.12em;color:#9ca4b2;border-radius:4px}.hud strong{display:block;color:#fff;font-size:11px;margin-top:5px}.h1{top:45px;right:0}.h2{bottom:60px;left:0}.h3{right:0;bottom:115px;color:var(--cyan)}.scan{position:absolute;width:320px;height:1px;background:linear-gradient(90deg,transparent,var(--cyan),transparent);filter:drop-shadow(0 0 7px var(--cyan));animation:scan 5s ease-in-out infinite}@keyframes scan{0%,100%{transform:translateY(-140px);opacity:0}50%{transform:translateY(140px);opacity:.8}}
.stats{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);background:#ffffff05}.stat{padding:22px 25px;border-right:1px solid var(--line)}.stat:last-child{border:0}.stat strong{font-size:28px;letter-spacing:-.06em}.stat span{display:block;font:8px var(--mono);letter-spacing:.12em;color:#848b98;text-transform:uppercase;margin-top:7px}.section{padding:95px 0}.head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:32px}.head h2{font-size:clamp(32px,4vw,48px);letter-spacing:-.06em;margin:10px 0 0}.head p{max-width:410px;color:var(--muted);font-size:12px;line-height:1.8}.red{color:var(--red)}.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.card{border:1px solid var(--line);background:linear-gradient(145deg,#ffffff08,#ffffff02);border-radius:7px;overflow:hidden;transition:.3s}.card:hover{transform:translateY(-6px);border-color:#ff284866;box-shadow:0 22px 50px #0007}.visual{height:190px;position:relative;display:grid;place-items:center;overflow:hidden;background:radial-gradient(ellipse at 50% 45%,#541328,#121019 65%)}.visual:after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,#10131a,transparent 70%),repeating-linear-gradient(0deg,transparent 0 4px,#fff04 5px)}.visual.x{background:radial-gradient(ellipse,#42172f,#101019 68%)}.visual.z{background:radial-gradient(ellipse,#34404b,#101318 68%)}.visual.h{background:radial-gradient(ellipse,#601224,#101015 68%)}.visual.k{background:radial-gradient(ellipse,#12323c,#0c1016 68%)}.visual .num{position:absolute;z-index:1;top:15px;left:17px;font:8px var(--mono);letter-spacing:.15em;color:#e8b7c0}.visual b{font-size:88px;letter-spacing:-.1em;color:#ffffff0d}.visual small{position:absolute;z-index:1;bottom:13px;right:16px;font:9px var(--mono);color:#ffffff88}
.visual img.preview{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center}
.visual img.preview-icon{position:absolute;inset:0;margin:auto;max-width:62%;max-height:78%;object-fit:contain;border-radius:18px;box-shadow:0 14px 40px #000a}.body{padding:21px}.row{display:flex;align-items:center;justify-content:space-between;gap:10px}.body h3{font-size:17px;margin:0;letter-spacing:-.04em}.badge{font:8px var(--mono);letter-spacing:.1em;color:var(--cyan);border:1px solid #59e8ff44;padding:6px 8px;border-radius:3px}.badge.demo{color:#e6b86a;border-color:#e6b86a44}.body p{font-size:11px;color:#9aa1ad;line-height:1.8;margin:12px 0 17px;min-height:60px}.tags{display:flex;flex-wrap:wrap;gap:6px}.tag{font:8px var(--mono);padding:5px 7px;color:#abb2bf;border:1px solid #ffffff17;border-radius:3px}.projectlink{display:inline-flex;align-items:center;margin-top:18px;font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}.projectlink b{color:var(--red);margin-left:7px;font-size:14px;line-height:1;transform:translateY(-2px)}.about{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px}.about h2{font-size:40px;letter-spacing:-.06em;margin:12px 0}.quote{font-size:clamp(23px,3vw,35px);font-weight:800;letter-spacing:-.06em;line-height:1.3}.quote b{color:var(--red)}.about p{font-size:12px;line-height:1.9;color:var(--muted)}.skills{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin-top:22px}.skill{padding:13px;border:1px solid var(--line);background:#ffffff04;font-size:10px;color:#d1d4dc}.skill:before{content:"";display:inline-block;width:6px;height:6px;background:var(--red);border-radius:50%;box-shadow:0 0 8px var(--red);margin-right:10px}.contact{padding:42px;border:1px solid #ff284844;border-radius:8px;background:radial-gradient(ellipse at 90% 50%,#53132766,transparent 45%),#10131a;display:flex;align-items:center;justify-content:space-between;gap:20px}.contact h2{font-size:clamp(30px,4vw,45px);letter-spacing:-.06em;margin:10px 0}.contact p{font-size:12px;line-height:1.7;color:var(--muted);max-width:450px}.footer{border-top:1px solid var(--line);padding:22px 0 30px;color:#747b88;font:8px var(--mono);letter-spacing:.08em}.foot{display:flex;justify-content:space-between;gap:12px}.foot a{color:#b5bbc5}.reveal{opacity:0;transform:translateY(22px);transition:.7s}.reveal.on{opacity:1;transform:none}.topbtn{position:fixed;bottom:20px;right:20px;width:40px;height:40px;background:#11151ddd;border:1px solid #ffffff24;color:white;border-radius:4px;opacity:0;pointer-events:none;z-index:15}.topbtn.show{opacity:1;pointer-events:auto}
@media(max-width:800px){.hero{grid-template-columns:1fr;text-align:center;padding:40px 0 65px}.hero-copy{display:flex;align-items:center;flex-direction:column}.art{grid-row:1;height:390px}.avatar{width:280px}.orbit{width:350px}.h1{top:20px;right:4%}.h2{left:4%;bottom:35px}.h3{right:4%;bottom:75px}.head{display:block}.head p{margin-top:14px}.about{gap:30px}.section{padding:72px 0}}
@media(max-width:560px){.wrap{width:calc(100% - 34px)}.top{height:62px}.links{display:none;position:absolute;top:61px;left:0;right:0;background:#0b0d12;padding:20px 22px;border-bottom:1px solid var(--line);flex-direction:column;gap:19px}.links.open{display:flex}.cta{display:none}.menu{display:block}.hero{padding-top:25px;min-height:0}.art{height:320px}.avatar{width:235px}.orbit{width:300px}.hud{font-size:7px;padding:8px}.hud strong{font-size:9px}h1{font-size:clamp(49px,14vw,70px);margin:18px 0}.desc{font-size:12px}.actions{justify-content:center}.btn{font-size:9px;padding:12px}.statusline{font-size:7px}.stats{grid-template-columns:repeat(2,1fr)}.stat{padding:18px;border-bottom:1px solid var(--line)}.stat:nth-child(2){border-right:0}.stat:nth-child(n+3){border-bottom:0}.stat strong{font-size:24px}.section{padding:60px 0}.grid{grid-template-columns:1fr}.visual{height:165px}.body{padding:18px}.body p{min-height:0}.about{grid-template-columns:1fr;gap:18px}.about h2{font-size:34px}.skills{gap:7px}.skill{font-size:9px;padding:11px 8px}.contact{display:block;padding:25px 20px}.contact .btn{margin-top:10px}.foot{flex-direction:column;line-height:1.7}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}.reveal{opacity:1;transform:none}}

/* DISTINCTIVE HERO — electric editorial / sci-fi, separate from H3LL identity */
:root{--red:#ff3157;--cyan:#a6ff6a}
.hero{min-height:710px;grid-template-columns:1.02fr .98fr;padding-top:75px;padding-bottom:85px;isolation:isolate}
.hero:before{content:"";position:absolute;z-index:-2;inset:5% -12% 0 27%;background:radial-gradient(ellipse at 60% 46%,#d72a4b22,transparent 38%),radial-gradient(ellipse at 80% 65%,#a6ff6a12,transparent 40%);filter:blur(14px)}
.hero-copy{position:relative;z-index:3;align-items:flex-start!important;text-align:left!important}
.eyebrow{display:flex;align-items:center;gap:13px;font-size:9px;color:#a6ff6a;letter-spacing:.2em}
.eyebrow:before{background:#a6ff6a;box-shadow:0 0 12px #a6ff6a}
.hero-live{font:8px var(--mono);letter-spacing:.08em;color:#858d9a;border-left:1px solid #ffffff24;padding-left:12px}
.hero-live:first-letter{color:#a6ff6a}
.hero h1{font-size:clamp(72px,10vw,132px);line-height:.79;letter-spacing:-.105em;margin:36px 0 28px;font-weight:900}
.hero h1 span.hero-outline{-webkit-text-stroke:1.5px #e9eaf0;color:transparent}
.hero-period{font-style:normal;color:#a6ff6a;text-shadow:0 0 40px #a6ff6a55}
.hero .desc{font-size:13px;max-width:410px;line-height:1.9;color:#aab0bd}
.hero .actions{margin-top:30px}
.hero .btn{border-color:#a6ff6a66;background:#a6ff6a;color:#10120e;box-shadow:0 8px 35px #a6ff6a17}
.hero .btn:hover{background:#c3ff91;box-shadow:0 0 38px #a6ff6a55}
.hero .btn.secondary{background:#ffffff05;color:#e2e5eb;border-color:#ffffff2b;box-shadow:none}
.hero .btn b{margin-left:12px;font-size:14px}
.hero-signature{display:flex;align-items:center;gap:12px;margin-top:45px;font:8px var(--mono);letter-spacing:.15em;color:#77808e}
.hero-index{color:#a6ff6a}.hero-rule{height:1px;width:50px;background:#a6ff6a55}
.hero .art{height:560px;overflow:visible}
.hero .orbit{width:min(490px,108%);border:1px solid #a6ff6a28;box-shadow:0 0 80px #a6ff6a0b,inset 0 0 80px #ff31570b}
.hero .orbit:before{inset:18px;border:1px solid #ff315744;transform:rotateX(67deg) rotateZ(25deg)}
.hero .orbit:after{inset:55px;border:1px dashed #a6ff6a4d;transform:rotateX(70deg) rotateZ(-30deg)}
.hero .avatar{width:min(410px,94%);filter:drop-shadow(0 30px 60px #000) drop-shadow(0 0 35px #ff315722);z-index:2}
.hero .avatar:before{inset:-5px;background:conic-gradient(from 45deg,transparent 0 12%,#a6ff6a 19%,transparent 30% 53%,#ff3157 66%,transparent 78%);filter:blur(.5px)}
.hero .avatar img{inset:7px;width:calc(100% - 14px);height:calc(100% - 14px);border-radius:50%;mask-image:radial-gradient(circle,#000 54%,#000b 67%,transparent 78%);mix-blend-mode:screen}
.hero-giant{position:absolute;z-index:0;right:-12%;top:50%;transform:translateY(-50%) rotate(90deg);font:900 92px var(--font);letter-spacing:-.1em;color:#ffffff04;writing-mode:vertical-rl;line-height:.8;pointer-events:none}
.hero .hud{z-index:4;background:#0a0c10d9;border:1px solid #a6ff6a35;box-shadow:0 10px 30px #0005}
.hero .h1{top:52px;right:-3px}.hero .h2{bottom:45px;left:-5px}
.hero-cross{position:absolute;z-index:3;color:#a6ff6a;font-size:22px;text-shadow:0 0 20px #a6ff6a88;animation:crossfloat 5s ease-in-out infinite}
.cross-a{top:17%;left:12%}.cross-b{right:9%;bottom:20%;font-size:27px;color:#ff3157}
@keyframes crossfloat{50%{transform:translateY(-12px) rotate(45deg)}}
.hero-coord{position:absolute;right:1%;bottom:4%;font:8px/1.8 var(--mono);letter-spacing:.13em;color:#777f8c;text-align:right}
.hero .scan{background:linear-gradient(90deg,transparent,#a6ff6a,transparent);opacity:.5}
@media(max-width:800px){.hero{grid-template-columns:1fr;min-height:0;padding-top:28px;padding-bottom:65px;gap:0}.hero-copy{align-items:center!important;text-align:center!important;grid-row:2}.hero .art{grid-row:1;height:370px}.hero h1{font-size:clamp(70px,16vw,108px);margin:20px 0}.hero .desc{max-width:470px}.hero-signature{margin-top:28px}.hero .avatar{width:290px}.hero .orbit{width:350px}.hero-giant{font-size:70px;right:-3%;}.hero .h1{top:12px;right:4%}.hero .h2{left:3%;bottom:20px}.hero-coord{right:5%;bottom:0}}
@media(max-width:560px){.hero{padding-top:14px}.hero .art{height:310px}.hero .avatar{width:245px}.hero .orbit{width:295px}.hero-giant{font-size:56px;right:-5%}.hero .eyebrow{font-size:7px;gap:7px;letter-spacing:.14em}.hero-live{font-size:6px;padding-left:7px}.hero h1{font-size:clamp(64px,17vw,88px);margin:17px 0 22px}.hero .desc{font-size:12px}.hero .actions{margin-top:22px}.hero-signature{font-size:7px;margin-top:26px}.hero .h1{top:8px}.hero .h2{bottom:13px}.hero .hud{padding:7px 9px}.hero-cross{font-size:16px}.hero-coord{font-size:6px}}

/* LAYIIX identity and stable, restrained avatar treatment */
.brand{letter-spacing:.16em}
.mark{background:#ff3157;box-shadow:none}
.hero .avatar{width:min(390px,92%);aspect-ratio:1;animation:none;filter:drop-shadow(0 18px 30px #0009);isolation:isolate}
.hero .avatar:before{content:none;display:none}
.hero .avatar img{inset:0;width:100%;height:100%;object-fit:contain;border-radius:12px;mask-image:none;mix-blend-mode:normal;border:1px solid #ffffff20;box-shadow:0 18px 55px #0008}
.hero .orbit{width:min(440px,100%);border-color:#ffffff12;box-shadow:none;animation:spin 55s linear infinite}
.hero .orbit:before{border-color:#ffffff12}
.hero .orbit:after{border-color:#ff31571a}
.hero .scan{display:none}
.hero-giant{color:#ffffff06}
.hero-cross{opacity:.45;text-shadow:none}
.hero .hud{box-shadow:none;background:#0a0c10e8}
@media(max-width:800px){.hero .avatar{width:280px}}
@media(max-width:560px){.hero .avatar{width:235px}.hero .orbit{width:285px}}

/* Final responsive polish: Layiix visual identity follows the avatar */
:root{--red:#f12b3f;--cyan:#ffb24a}
body{background:radial-gradient(ellipse at 78% 19%,#a52b1826,transparent 34%),radial-gradient(ellipse at 15% 58%,#68101b1a,transparent 36%),#08090d}
.hero:before{inset:0 -12%;background:radial-gradient(ellipse at 68% 36%,#b8321d25,transparent 42%),radial-gradient(ellipse at 75% 65%,#f12b3f12,transparent 48%);filter:blur(20px)}
.hero .eyebrow{color:#ffb24a}
.hero .eyebrow:before{background:#ffb24a;box-shadow:0 0 10px #ffb24a88}
.hero-live{color:#92929b}
.hero-live:first-letter{color:#ffb24a}
.hero h1{font-size:clamp(62px,8.5vw,112px);line-height:.88;letter-spacing:-.085em;max-width:100%;overflow:visible}
.hero h1 span.hero-outline{-webkit-text-stroke:1.5px #f2e9e5}
.hero-period{color:#ffb24a;text-shadow:0 0 30px #ffb24a55}
.hero .btn{background:#f12b3f;color:#fff;border-color:#f12b3f;box-shadow:0 8px 30px #f12b3f20}
.hero .btn:hover{background:#ff4354;box-shadow:0 0 32px #f12b3f55}
.hero .btn.secondary{background:#ffffff05;color:#e2e5eb;border-color:#ffffff2b}
.hero-index{color:#ffb24a}.hero-rule{background:#ffb24a55}
.hero .orbit{border-color:#ffb24a25;box-shadow:0 0 60px #f12b3f0a,inset 0 0 70px #ffb24a08}
.hero .orbit:before{border-color:#f12b3f44}
.hero .orbit:after{border-color:#ffb24a42}
.hero .avatar{width:min(370px,88%);animation:none;filter:drop-shadow(0 18px 38px #000c) drop-shadow(0 0 25px #f12b3f26)}
.hero .avatar:before{content:"";display:block;position:absolute;inset:-5px;border-radius:50%;background:conic-gradient(from 20deg,transparent 0 12%,#ffb24a 19%,#f12b3f 29%,transparent 42% 63%,#f12b3f 74%,transparent 88%);filter:blur(1px);animation:spin 18s linear infinite;z-index:-1}
.hero .avatar img{inset:5px;width:calc(100% - 10px);height:calc(100% - 10px);object-fit:cover;object-position:center;border-radius:50%;mask-image:none;mix-blend-mode:normal;border:1px solid #ffb24a55;box-shadow:0 0 0 5px #08090d,0 0 36px #f12b3f24}
.hero .hud{border-color:#ffb24a38;background:#0a0c10ed}
.hero .h2 strong i{color:#ffb24a!important}
.hero-cross{color:#ffb24a;text-shadow:0 0 15px #ffb24a66;opacity:.65}
.cross-b{color:#f12b3f}
.hero .scan{display:block;background:linear-gradient(90deg,transparent,#ffb24a,transparent);opacity:.3}
.hero-giant{color:#ffffff05}
@media(max-width:800px){
 .hero{display:flex;flex-direction:column;min-height:0;padding:28px 0 60px;gap:0}
 .hero .art{order:0;width:100%;height:330px;min-height:0;flex:none}
 .hero-copy{order:1;width:100%;max-width:100%;align-items:center!important;text-align:center!important}
 .hero h1{width:100%;font-size:clamp(54px,12.7vw,82px);line-height:.84;letter-spacing:-.075em;margin:20px 0 22px;text-align:center;overflow:visible}
 .hero .desc{width:100%;max-width:470px;margin-left:auto;margin-right:auto}
 .hero .actions{justify-content:center}
 .hero .avatar{width:255px}
 .hero .orbit{width:310px}
 .hero .h1{top:8px;right:5%}.hero .h2{left:4%;bottom:10px}
 .hero-coord{right:5%;bottom:0}
 .hero-giant{font-size:56px;right:0}
}
@media(max-width:560px){
 .hero{padding-top:15px;padding-bottom:48px}
 .hero .art{height:285px}
 .hero .avatar{width:218px}
 .hero .orbit{width:265px}
 .hero h1{font-size:clamp(48px,12.2vw,66px);line-height:.88;letter-spacing:-.07em;margin:19px 0 19px;white-space:normal}
 .hero .eyebrow{font-size:7px;letter-spacing:.11em;gap:6px;justify-content:center;flex-wrap:wrap}
 .hero-live{font-size:6px;padding-left:7px}
 .hero .desc{font-size:12px;line-height:1.75;padding:0 2px}
 .hero .actions{gap:9px}
 .hero .btn{font-size:8px;padding:12px 13px}
 .hero-signature{margin-top:23px;font-size:6px;gap:9px}
 .hero .h1{top:3px;right:2%}.hero .h2{left:2%;bottom:7px}
 .hero .hud{padding:7px 8px;font-size:6px}.hero .hud strong{font-size:8px}
 .hero-coord{font-size:6px;right:2%;bottom:-3px}
 .hero-cross{font-size:14px}
}
@media(prefers-reduced-motion:reduce){.hero .avatar:before,.hero .orbit{animation:none!important}}

.contact{display:grid;grid-template-columns:.8fr 1.2fr;align-items:start;gap:34px}
.contact-intro{min-width:0}.contact-form{display:grid;grid-template-columns:1fr;gap:9px;min-width:0}
.contact-form label{font:8px var(--mono);letter-spacing:.16em;color:#ffb24a;margin-top:7px}
.contact-form input,.contact-form textarea{width:100%;min-width:0;background:#08090d;border:1px solid #ffffff22;border-radius:5px;padding:13px 14px;color:var(--txt);font:12px Inter,sans-serif;outline:none;resize:vertical}
.contact-form input:focus,.contact-form textarea:focus{border-color:#ffb24a;box-shadow:0 0 0 2px #ffb24a17}
.contact-form input::placeholder,.contact-form textarea::placeholder{color:#737986}
.contact-form .btn{justify-self:start;margin-top:8px;cursor:pointer;font:800 9px Inter,sans-serif;letter-spacing:.12em}
.form-note{display:inline-block;margin-top:14px;color:#ffb24a;font:8px var(--mono);letter-spacing:.1em}
.form-feedback{min-height:16px;margin:0;color:#ffb24a;font-size:11px}
@media(max-width:700px){.contact{display:grid;grid-template-columns:1fr;gap:20px;padding:24px 18px}.contact-form .btn{width:100%}}

/* Responsive stability at browser zoom levels; keep native pinch/browser zoom enabled */
*,*::before,*::after{box-sizing:border-box}
html{width:100%;max-width:100%;overflow-x:clip}
body{width:100%;max-width:100%;min-width:0;overflow-x:clip}
img,svg,video,canvas{max-width:100%}
.wrap{width:min(100% - 48px,1180px);max-width:1180px;margin-inline:auto}
.top,header,main,footer,section,.section,.hero,.contact{max-width:100%;min-width:0}
.top nav{width:min(100% - 40px,1180px);min-width:0}
.brand{gap:8px;min-width:0;white-space:nowrap}
.brand .mark{display:none!important}
.hero{min-width:0;grid-template-columns:minmax(0,1fr) minmax(0,.95fr)}
.hero-copy,.hero .art,.hero .avatar{min-width:0;max-width:100%}
.hero h1{max-width:100%;overflow-wrap:anywhere;word-break:normal}
.hero .desc{max-width:100%;overflow-wrap:break-word}
.hero .art{overflow:hidden}
.hero .avatar{width:min(370px,78vw);aspect-ratio:1}
.hero .avatar img{width:calc(100% - 10px);height:calc(100% - 10px);aspect-ratio:1;object-fit:cover;object-position:center;border-radius:50%}
.contact-form,.contact-form input,.contact-form textarea{max-width:100%;min-width:0}
@media(max-width:900px){
 .wrap{width:calc(100% - 36px)}
 .hero{display:flex;flex-direction:column;align-items:center;min-height:0;padding:28px 0 52px;gap:0}
 .hero .art{order:0;width:100%;height:clamp(220px,65vw,340px);flex:none;display:grid;place-items:center}
 .hero-copy{order:1;width:100%;max-width:100%;display:flex;flex-direction:column;align-items:center;text-align:center}
 .hero .avatar{width:clamp(175px,48vw,260px)}
 .hero .orbit{width:min(310px,82vw);max-width:100%}
 .hero h1{width:100%;font-size:clamp(40px,10vw,78px);line-height:.9;letter-spacing:-.065em;margin:16px 0 20px;text-align:center;overflow-wrap:normal}
 .hero .desc{width:100%;max-width:520px}
 .hero .actions{width:100%;justify-content:center;flex-wrap:wrap}
 .hero .hud{max-width:40%;white-space:normal}
}
@media(max-width:560px){
 .wrap{width:calc(100% - 28px)}
 .top nav{width:calc(100% - 28px)}
 .brand{font-size:13px;letter-spacing:.12em}
 .brand small{font-size:9px}
 .hero{padding-top:16px;padding-bottom:40px}
 .hero .art{height:clamp(205px,65vw,275px)}
 .hero .avatar{width:clamp(155px,53vw,215px)}
 .hero .orbit{width:min(255px,78vw)}
 .hero h1{font-size:clamp(37px,10.5vw,58px);line-height:.92;letter-spacing:-.06em}
 .hero .desc{font-size:12px;line-height:1.7}
 .hero .actions{gap:8px}
 .hero .btn{max-width:100%;white-space:normal}
 .hero .hud{font-size:6px;padding:6px;max-width:36%}
 .hero-giant{display:none}
 .contact{grid-template-columns:minmax(0,1fr);padding-inline:0}
}
@media(max-width:360px){
 .wrap,.top nav{width:calc(100% - 22px)}
 .brand{font-size:11px;letter-spacing:.09em}
 .brand small{font-size:8px}
 .hero h1{font-size:clamp(33px,10vw,42px)}
 .hero .btn{font-size:8px;padding:11px 10px}
}

/* Subtle avatar motion and matching ember glow */
@keyframes avatar-drift{0%,100%{transform:translate3d(0,0,0)}50%{transform:translate3d(0,-7px,0)}}
@keyframes ember-pulse{0%,100%{opacity:.22;filter:blur(16px) scale(.96)}50%{opacity:.52;filter:blur(22px) scale(1.06)}}
.hero .avatar{animation:avatar-drift 7s ease-in-out infinite;will-change:transform}
.hero .avatar:after{content:"";position:absolute;inset:8%;border-radius:50%;pointer-events:none;z-index:-1;background:radial-gradient(circle,#f0442a55 0%,#c52a251c 48%,transparent 72%);animation:ember-pulse 5s ease-in-out infinite}
.hero .avatar img{transform:none;transition:filter .35s ease}
.hero .avatar:hover img{filter:contrast(1.04) saturate(1.06)}
@media(prefers-reduced-motion:reduce){.hero .avatar,.hero .avatar:after{animation:none!important;will-change:auto}}

/* ===== LAYIIX SPLASH — cyber developer terminal ===== */
#splash{position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;background:#08090d;overflow:hidden;transition:opacity .5s ease,visibility .5s}
#splash.done{opacity:0;visibility:hidden;pointer-events:none}
#splash .splash-bg{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 0%,#f12b3f1c,transparent 45%),radial-gradient(ellipse at 50% 100%,#ffb24a10,transparent 40%),#08090d}
#splash .splash-grid{position:absolute;inset:0;background-image:linear-gradient(#ffffff09 1px,transparent 1px),linear-gradient(90deg,#ffffff09 1px,transparent 1px);background-size:34px 34px;mask-image:radial-gradient(ellipse at 50% 50%,#000 30%,transparent 75%)}
#splash .splash-grid:after{content:"";position:absolute;left:0;right:0;height:90px;top:-90px;background:linear-gradient(transparent,#f12b3f2e);animation:scanfall 2.6s linear infinite}
@keyframes scanfall{to{transform:translateY(120vh)}}
#splash .splash-term{position:relative;width:min(430px,88vw);border:1px solid #f12b3f44;border-radius:10px;background:#10131af2;box-shadow:0 0 45px #f12b3f22,0 30px 80px #000c;overflow:hidden}
#splash .splash-term-body{padding:24px 22px 18px;font-family:'Space Mono',monospace}
#splash .splash-logo{font:900 40px Inter,Arial,sans-serif;letter-spacing:.14em;color:#fff;text-shadow:0 0 24px #f12b3f44}
#splash .splash-cursor{animation:blink 1s steps(1) infinite;color:#ffb24a}
@keyframes blink{50%{opacity:0}}
#splash .splash-sub{margin-top:6px;font-size:10px;letter-spacing:.3em;color:#ffb24a}
#splash .splash-log{margin:14px 0 4px;min-height:66px;font-size:10.5px;line-height:1.7;color:#c4c9d4}
#splash .splash-log div{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#splash .splash-log .ok{color:#fff}
#splash .splash-bar{position:relative;height:10px;margin-top:10px;border:1px solid #ffb24a44;border-radius:3px;background:#ffffff08;overflow:hidden}
#splash .splash-fill{display:block;height:100%;width:0%;background:repeating-linear-gradient(90deg,#fff 0 8px,transparent 8px 11px);filter:drop-shadow(0 0 6px #ffb24acc);transition:width .15s}
#splash .splash-row{display:flex;align-items:center;justify-content:space-between;margin-top:9px}
#splash .splash-tip{font-size:10px;color:#7d8594;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:280px}
#splash .splash-pct{font-size:12px;font-weight:700;color:#fff;letter-spacing:.1em;text-shadow:0 0 12px #f12b3f88}
@media(prefers-reduced-motion:reduce){#splash,#splash .splash-grid:after,#splash .splash-cursor{animation:none!important;transition:none}}

/* REALITY outline: fallback + versione pulita su mobile */
@supports not (-webkit-text-stroke:1px #fff){.hero h1 span.hero-outline{color:#f2e9e5!important}}
@media(max-width:560px){.hero h1 span.hero-outline{color:#f2e9e5;-webkit-text-stroke:0}}

/* ===== contact form: states that actually read ===== */
.contact-form input.invalid,.contact-form textarea.invalid{border-color:#f12b3f!important;box-shadow:0 0 0 2px #f12b3f22!important;animation:shake .3s}
@keyframes shake{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}
.contact-form .btn[disabled]{opacity:.6;pointer-events:none}
.contact-form .btn .spin{display:inline-block;width:12px;height:12px;margin-right:8px;border:2px solid #ffffff55;border-top-color:#fff;border-radius:50%;vertical-align:-2px;animation:spin .7s linear infinite}
.form-feedback{min-height:18px;margin:6px 0 0;font-size:12px;color:#ffb24a}
.form-feedback.ok{color:#7dff9e}
.form-feedback.err{color:#ff7d8a}

/* ===== discord contact card (compact) ===== */
.discord-card{min-width:0;max-width:420px;border:1px solid #ffffff1c;border-radius:8px;background:#08090d;padding:16px;display:flex;flex-direction:column;gap:10px}
.discord-top{display:flex;align-items:center;gap:10px}
.discord-dot{width:10px;height:10px;border-radius:50%;background:#7dff9e;box-shadow:0 0 12px #7dff9e;flex:none}
.discord-top strong{display:block;font-size:17px;letter-spacing:.02em;color:#fff}
.discord-top span{display:block;font:700 8px 'Space Mono',monospace;letter-spacing:.2em;color:#8b93a1;margin-top:2px}
.discord-row{display:flex;gap:8px;align-items:stretch}
.discord-name{flex:1;min-width:0;height:54px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 12px;border:1px solid #ffffff22;border-radius:5px;background:#10131a;color:#fff;font:700 14px/1 'Space Mono',monospace;letter-spacing:.04em;cursor:pointer}
.discord-name span{font:700 8px/1 'Space Mono',monospace;letter-spacing:.14em;color:#ffb24a;white-space:nowrap}
.discord-row .btn{height:54px;margin:0;padding:0 14px;white-space:nowrap}
@media(max-width:700px){.contact{gap:16px;padding:20px 16px}.discord-card{max-width:none}}