:root{
  --purple:#631c80; --purple-deep:#341345; --ink:#261a31; --muted:#777180;
  --lavender:#f1e8f6; --surface:#faf8fc; --violet-light:#a456c3;
}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;min-width:280px}
body{font-family:'Poppins','Lucida Sans',Arial,sans-serif;color:var(--ink);overflow:hidden;background:var(--surface)}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit}
a:focus-visible,button:focus-visible{outline:3px solid #a25cbf;outline-offset:4px}
.site{width:100%;height:100vh;height:100dvh;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto;isolation:isolate;overflow:hidden;position:relative;background:radial-gradient(ellipse at 82% 29%,rgba(226,196,243,.37),transparent 36%),radial-gradient(ellipse at 16% 89%,rgba(241,223,250,.31),transparent 45%),#fbfafd}
.layout-width{width:min(100% - 11vw,1590px);margin-inline:auto}
.canvas-layer{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.8}
#atmosphere{display:block;width:100%;height:100%}
.fine-grid{position:absolute;inset:0;z-index:-2;pointer-events:none;opacity:.32;background-image:radial-gradient(circle,rgba(99,28,128,.19) .7px,transparent .85px);background-size:31px 31px;mask-image:linear-gradient(90deg,transparent 22%,black 100%)}
.background-glow{position:absolute;border-radius:50%;pointer-events:none;z-index:-2;filter:blur(3px)}
.glow-one{width:50vw;height:50vw;right:-13vw;top:10vh;background:radial-gradient(circle,rgba(216,177,239,.36),rgba(237,223,249,.13) 50%,transparent 69%)}
.glow-two{width:35vw;height:35vw;left:-20vw;bottom:-23vw;background:radial-gradient(circle,rgba(224,194,245,.19),transparent 69%)}
/* Navigation */
.header{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:17px;position:relative;z-index:10}
.brand{display:block;width:132px;flex:none;transition:transform .3s ease}
.brand:hover{transform:translateY(-2px)}
.brand img{display:block;width:100%;height:auto;object-fit:contain}
.header-right{display:flex;align-items:center;gap:clamp(22px,3vw,52px)}
.header-signature{display:flex;align-items:center;gap:10px;color:#797080;font-size:11px;font-weight:500;letter-spacing:.02em;white-space:nowrap}
.signature-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--purple);box-shadow:0 0 0 4px rgba(99,28,128,.08)}
.group-link{color:var(--purple-deep);text-decoration:none;border:1px solid rgba(99,28,128,.16);border-radius:100px;padding:11px 17px;font-size:12px;font-weight:600;display:inline-flex;align-items:center;gap:11px;background:rgba(255,255,255,.68);transition:background .25s,transform .25s,border-color .25s;white-space:nowrap}
.group-link:hover{background:#fff;border-color:rgba(99,28,128,.4);transform:translateY(-2px)}
/* Main */
.hero{display:grid;grid-template-columns:minmax(0,.99fr) minmax(0,1.01fr);align-items:center;gap:min(3vw,48px);position:relative;min-height:0}
.hero-copy{z-index:4;position:relative;max-width:780px;padding-bottom:2vh}
.eyebrow{display:flex;align-items:center;flex-wrap:wrap;gap:12px;color:#81588d;font-weight:700;font-size:10px;letter-spacing:.19em;margin-bottom:clamp(17px,3vh,32px)}
.eyebrow-line{width:27px;height:2px;background:#a442c7;border-radius:3px}
.eyebrow-separator{opacity:.48}
h1{margin:0;color:#281633;font-size:clamp(44px,4.45vw,82px);line-height:1.12;letter-spacing:-.058em;font-weight:700;white-space:nowrap}
h1 span{color:var(--purple)}
.hero-description{font-size:clamp(12px,1.02vw,16px);line-height:1.9;max-width:570px;color:#777080;font-weight:400;margin:clamp(20px,3vh,32px) 0 clamp(22px,3.3vh,39px)}
.hero-description strong{font-weight:600;color:#48404e}
.actions{display:flex;align-items:center;gap:clamp(16px,2vw,32px);flex-wrap:wrap}
.primary-button{min-height:53px;border-radius:11px;background:linear-gradient(110deg,#631c80,#862d9f);color:#fff;text-decoration:none;font-size:12px;font-weight:600;letter-spacing:.02em;display:inline-flex;align-items:center;justify-content:space-between;gap:23px;padding:0 19px 0 21px;border:1px solid rgba(255,255,255,.16);box-shadow:0 13px 29px rgba(99,28,128,.20),inset 0 1px 0 rgba(255,255,255,.18);transition:transform .28s,box-shadow .28s}
.primary-button:hover{transform:translateY(-3px);box-shadow:0 18px 32px rgba(99,28,128,.28),inset 0 1px 0 rgba(255,255,255,.2)}
.primary-button svg{transition:transform .25s}
.primary-button:hover svg{transform:translateX(4px)}
.text-button{border:0;background:none;padding:14px 0;color:#4a3458;font-size:12px;font-weight:600;cursor:pointer;display:inline-flex;gap:9px;align-items:center;transition:color .25s}
.text-button:hover{color:var(--purple)}
.text-button svg{transform:rotate(-90deg);transition:transform .25s}
.text-button:hover svg{transform:rotate(-90deg) translateY(3px)}
.launch-note{margin-top:clamp(24px,5vh,52px);display:flex;align-items:center;gap:11px;color:#928999;font-size:10px;font-weight:500;letter-spacing:.02em}
.live-dot{width:7px;height:7px;flex:none;display:inline-block;border-radius:50%;background:#9d5cb1;box-shadow:0 0 0 5px rgba(164,91,191,.10);animation:heartbeat 3s ease-in-out infinite}
@keyframes heartbeat{50%{box-shadow:0 0 0 9px rgba(164,91,191,.035)}}
/* Immersive visual */
.hero-visual{height:min(100%,710px);min-height:0;position:relative;display:flex;align-items:center;justify-content:center;perspective:1200px;transform-style:preserve-3d}
.orb{position:absolute;border-radius:50%;pointer-events:none}
.orb-primary{width:min(43vw,650px);aspect-ratio:1;max-height:83%;background:radial-gradient(circle at 43% 42%,rgba(243,232,251,.7),rgba(211,169,235,.3) 42%,rgba(213,165,236,.22) 56%,transparent 72%);filter:blur(1px);animation:orbFloat 9s ease-in-out infinite alternate}
.orb-secondary{width:min(33vw,500px);aspect-ratio:1;transform:translate(10%,2%);background:radial-gradient(circle,rgba(217,170,236,.35),transparent 70%)}
.orbit{position:absolute;left:50%;top:50%;border:1px solid rgba(128,55,161,.14);border-radius:50%;pointer-events:none}
.orbit-a{width:95%;height:67%;transform:translate(-50%,-50%) rotate(-27deg);animation:orbit-a 20s ease-in-out infinite alternate}
.orbit-b{width:79%;height:86%;transform:translate(-50%,-50%) rotate(32deg);border-color:rgba(128,55,161,.11);animation:orbit-b 22s ease-in-out infinite alternate}
.orbit-c{width:75%;height:75%;transform:translate(-50%,-50%);border-style:dashed;border-color:rgba(128,55,161,.10);animation:spin 80s linear infinite}
.orbit-point{position:absolute;border-radius:50%;z-index:1;background:#8f45a9;box-shadow:0 0 0 6px rgba(143,69,169,.11),0 0 17px rgba(143,69,169,.5)}
.point-one{width:8px;height:8px;top:14%;right:16%}
.point-two{width:5px;height:5px;bottom:16%;left:8%;opacity:.55}
.point-three{width:4px;height:4px;top:23%;left:17%;opacity:.45}
@keyframes orbit-a{to{transform:translate(-50%,-50%) rotate(-16deg)}}
@keyframes orbit-b{to{transform:translate(-50%,-50%) rotate(18deg)}}
@keyframes spin{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes orbFloat{to{transform:translateY(-18px) scale(1.03)}}
.identity-panel{position:relative;z-index:2;width:min(79%,520px);max-height:78%;aspect-ratio:1.06/1;min-height:0;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(20px,2.3vw,31px);border-radius:27px;background:linear-gradient(135deg,rgba(255,255,255,.89),rgba(255,255,255,.58) 65%,rgba(248,237,252,.76));border:1px solid rgba(255,255,255,.96);box-shadow:0 33px 96px rgba(62,13,82,.10),0 0 0 1px rgba(99,28,128,.065),inset 0 1px 0 #fff;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);transform:rotate(-2.4deg);transition:transform .28s ease-out,box-shadow .3s ease-out;will-change:transform}
.identity-panel:before{position:absolute;inset:9px;content:"";pointer-events:none;border-radius:20px;border:1px solid rgba(99,28,128,.055)}
.panel-header,.panel-footer{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:8px;color:#8c8092;font-weight:600;font-size:9px;letter-spacing:.105em}
.panel-kicker{display:flex;align-items:center;gap:7px}
.panel-dot{width:6px;height:6px;border-radius:50%;background:var(--purple)}
.panel-index{color:#baacc2;font-variant-numeric:tabular-nums}
.panel-main{position:relative;display:flex;align-items:center;justify-content:center;flex:1;min-height:0;padding:8px 2px 5px}
.panel-main img{width:100%;max-width:425px;max-height:94%;height:auto;object-fit:contain;display:block;filter:none}
.panel-footer{font-size:8px;color:#97849f}
.tiny-star{font-size:15px;vertical-align:-1px;margin-right:4px;color:var(--purple)}
.panel-footer-plus{font-size:18px;vertical-align:-3px;font-weight:400;margin-left:4px}
.floating-chip{display:flex;align-items:center;position:absolute;z-index:4;border-radius:13px;border:1px solid rgba(255,255,255,.95);background:rgba(255,255,255,.88);box-shadow:0 20px 42px rgba(58,20,83,.1),0 0 0 1px rgba(99,28,128,.055);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);padding:12px 15px;gap:11px;color:#3e234d;pointer-events:none;animation:chipFloat 6.5s ease-in-out infinite alternate}
.floating-chip strong{display:block;font-size:10px;font-weight:700;white-space:nowrap}
.floating-chip small{display:block;font-size:9px;color:#a091a7;margin-top:3px;white-space:nowrap}
.chip-top{left:0;top:22%;animation-delay:-2s}
.chip-bottom{right:-1%;bottom:16%;animation-delay:-4s}
.chip-icon{width:37px;height:37px;display:grid;place-items:center;border-radius:10px;background:#f2e7f7;color:var(--purple)}
.chip-spark{font-size:21px;color:var(--purple);width:25px;text-align:center}
.mini-progress{display:block;width:28px;height:4px;border-radius:4px;background:#f0e3f7;margin-left:2px;overflow:hidden}
.mini-progress i{display:block;width:62%;height:100%;background:#aa6ec0;border-radius:4px;animation:progress 3s ease-in-out infinite alternate}
@keyframes progress{to{width:86%}}
@keyframes chipFloat{to{transform:translateY(-12px)}}
/* Footer */
.footer{z-index:5;position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:20px 23px;border-top:1px solid rgba(99,28,128,.095);font-size:9px;color:#9e95a4;letter-spacing:.09em;font-weight:600}
.footer-left,.footer-right{display:flex;align-items:center;gap:12px;white-space:nowrap}
.footer-left>span:nth-child(2){color:var(--purple)}
.footer-rule{width:15px;height:2px;background:var(--purple)}
.footer-divider{color:#d2cad6}
/* Modal: stays within the same screen, no page navigation or scroll */
.modal-backdrop{position:fixed;z-index:100;inset:0;display:grid;place-items:center;padding:20px;background:rgba(30,12,43,.43);backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}
.modal-backdrop[hidden]{display:none!important}
.modal{width:min(100%,490px);background:#fff;border-radius:22px;padding:clamp(25px,4vw,42px);position:relative;box-shadow:0 30px 110px rgba(20,5,27,.25);outline:none;animation:appear .24s ease-out}
@keyframes appear{from{opacity:0;transform:translateY(14px) scale(.98)}}
.modal-close{position:absolute;top:19px;right:20px;background:#f7f1f9;border:0;width:36px;height:36px;border-radius:50%;color:var(--purple);display:grid;place-items:center;cursor:pointer}
.modal-badge{display:flex;align-items:center;gap:11px;font-size:10px;color:var(--purple);font-weight:700;letter-spacing:.12em;margin-bottom:25px}
.modal h2{font-size:clamp(26px,4vw,42px);line-height:1.2;letter-spacing:-.04em;margin:0 0 18px;color:#291433}
.modal h2 em{font-style:normal;color:var(--purple)}
.modal p{font-size:13px;line-height:1.85;color:#776b7e;margin:0 0 25px}
.modal-cta{min-height:48px}
/* Tablet */
@media(max-width:1120px){
  .layout-width{width:calc(100% - 8vw)}
  .header{padding-top:10px}.brand{width:118px}
  .hero{grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);gap:1vw}
  h1{font-size:clamp(39px,4.4vw,60px)}
  .identity-panel{width:88%}
  .chip-top{left:-3%}.chip-bottom{right:-3%}
  .footer{font-size:8px}
}
@media(max-height:750px) and (min-width:760px){
  .brand{width:106px}.header{padding-top:9px}
  .eyebrow{margin-bottom:14px}h1{font-size:clamp(37px,4vw,62px)}
  .hero-description{margin:15px 0 20px;line-height:1.7}.launch-note{margin-top:20px}
  .primary-button{min-height:48px}.identity-panel{max-height:83%;width:min(75%,450px)}
  .footer{padding-block:13px}
}
/* Mobile layout: one full viewport; intentionally no scroll */
@media(max-width:760px){
  .layout-width{width:calc(100% - 42px)}
  .site{background:radial-gradient(ellipse at 72% 76%,rgba(232,207,246,.43),transparent 51%),#fcfafd}
  .header{padding-top:10px;align-items:center;min-height:69px}
  .brand{width:91px}
  .header-right{gap:0}
  .header-signature{display:none}
  .group-link{padding:9px 12px;font-size:10px;gap:6px}
  .group-link svg{width:14px;height:14px}
  .hero{display:flex;flex-direction:column;justify-content:space-between;align-items:stretch;gap:0;min-height:0;padding-top:2vh}
  .hero-copy{padding:0;max-width:100%;flex:none}
  .eyebrow{font-size:8px;gap:8px;letter-spacing:.125em;margin-bottom:clamp(9px,1.6vh,16px)}
  .eyebrow-line{width:17px}
  h1{font-size:clamp(34px,9vw,57px);line-height:1.105;letter-spacing:-.052em}
  .hero-description{font-size:clamp(10px,2.7vw,13px);line-height:1.68;margin:clamp(11px,2.1vh,18px) 0 clamp(13px,2.4vh,23px);max-width:520px}
  .actions{gap:12px}
  .primary-button{min-height:43px;font-size:10px;gap:12px;padding:0 12px 0 14px;border-radius:9px}
  .primary-button svg{width:16px;height:16px}
  .text-button{font-size:10px;gap:2px}
  .launch-note{margin-top:clamp(12px,2.7vh,24px);font-size:9px;gap:8px}
  .hero-visual{height:auto;min-height:0;flex:1;width:100%;max-width:440px;margin:0 auto;align-self:center}
  .identity-panel{width:clamp(180px,60vw,300px);max-height:83%;aspect-ratio:1.6/1;padding:10px 13px;border-radius:16px;transform:rotate(-2deg)}
  .identity-panel:before{inset:5px;border-radius:12px}
  .panel-header{font-size:6px}.panel-footer{font-size:5.5px}
  .panel-dot{width:4px;height:4px}.panel-main{padding:0}
  .panel-main img{max-width:220px;max-height:94%}.tiny-star{font-size:10px}.panel-footer-plus{font-size:11px}
  .orb-primary{width:90%;max-height:none}.orb-secondary{width:72%}
  .orbit-a{width:100%;height:70%}.orbit-b{width:83%;height:85%}.orbit-c{width:70%;height:75%}
  .floating-chip{padding:7px 9px;gap:6px;border-radius:9px}
  .floating-chip strong{font-size:7px}.floating-chip small{font-size:6px;margin-top:1px}
  .chip-icon{width:21px;height:21px;border-radius:6px}.chip-icon svg{width:13px}
  .chip-top{left:-1%;top:19%}.chip-bottom{right:-1%;bottom:15%}.chip-spark{width:12px;font-size:13px}.mini-progress{width:14px;height:3px}
  .footer{padding-block:10px 12px;font-size:7px;letter-spacing:.055em}
  .footer-left{gap:6px}.footer-right{gap:6px}
  .footer-left>span:last-child,.footer-left>.footer-divider{display:none}
  .footer-rule{width:9px}
  .canvas-layer{opacity:.38}
}
/* Small phones and very low screens */
@media(max-width:390px){
  .layout-width{width:calc(100% - 32px)}
  h1{font-size:clamp(31px,8.95vw,38px)}
  .hero-description{font-size:10.5px}
  .actions{gap:9px}
  .primary-button{font-size:9px;padding:0 11px;min-height:41px}
  .text-button{font-size:9px}
}
@media(max-width:760px) and (max-height:740px){
  .header{min-height:60px;padding-top:4px}.brand{width:78px}
  .hero{padding-top:0}
  .eyebrow{margin-bottom:8px;font-size:7.5px}
  h1{font-size:clamp(30px,8.4vw,42px)}
  .hero-description{line-height:1.55;margin:10px 0 12px;font-size:10px}
  .primary-button{min-height:39px}
  .launch-note{margin-top:11px;font-size:8px}
  .identity-panel{width:clamp(155px,55vw,260px);aspect-ratio:1.7/1}
  .footer{padding-block:7px 8px}
}
@media(max-width:760px) and (max-height:610px){
  .launch-note{display:none}
  .hero-description{font-size:9.5px;line-height:1.45}
  .identity-panel{width:clamp(120px,45vw,215px)}
  .floating-chip{display:none}
}
/* Landscape mobile: page remains single-screen */
@media(orientation:landscape) and (max-height:500px) and (max-width:950px){
  .layout-width{width:calc(100% - 9vw)}
  .header{min-height:42px;padding-top:2px}.brand{width:65px}
  .header-signature{display:none}
  .hero{display:flex;flex-direction:row;align-items:center;gap:2.5%;padding:0}
  .hero-copy{width:54%;flex:0 0 54%}
  .eyebrow{font-size:7px;margin-bottom:7px}
  h1{font-size:clamp(26px,4.15vw,39px)}
  .hero-description{margin:9px 0 10px;font-size:9px;line-height:1.5}
  .primary-button{min-height:35px;font-size:9px}
  .actions{flex-wrap:nowrap;gap:12px}
  .text-button{font-size:9px}
  .hero-visual{height:100%;width:42%;flex:0 0 42%;max-width:none;align-self:stretch}
  .identity-panel{width:min(84%,270px);aspect-ratio:1.1/1;max-height:83%;padding:9px}
  .floating-chip{display:none}
  .launch-note{display:none}
  .footer{padding:5px 0}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.001ms!important}
}