:root{--bg:#040b12;--blue:#34c9ff;--orange:#ff991f;--text:#f3f4ed;--muted:#95a4b0;--line:#ffffff20}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:35px}body{margin:0;background:var(--bg);color:var(--text);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}a,button,summary{-webkit-tap-highlight-color:transparent}[hidden]{display:none!important}header{max-width:1440px;margin:auto;height:88px;padding:0 6%;display:flex;align-items:center;gap:40px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:12px}.brand img{width:36px;height:36px;border-radius:50%}.word{font-size:24px;font-weight:900;letter-spacing:-1.4px}.word b:first-child,.cyan{color:var(--blue)}.word b:last-child,.gold{color:var(--orange)}nav{margin:auto;display:flex;gap:32px;font-size:12px;color:#b8c3cb}nav a:hover{color:var(--text)}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:45px;border:1px solid #ffffff45;padding:17px 22px;font-size:12px;font-weight:700;transition:background .2s,transform .2s}.button:hover{background:#ffffff15;transform:translateY(-2px)}.primary{background:var(--text);border-color:var(--text);color:#07101a}.primary:hover{background:var(--blue);border-color:var(--blue)}.header-cta{font-size:11px;padding:13px 18px}.menu{display:none}.hero{max-width:1440px;margin:auto;padding:27px 5% 0}.hero-label{display:flex;justify-content:space-between;align-items:center;padding:0 1% 18px;font-size:9px;letter-spacing:2.3px;color:#99aebb}.hero-tag{font-size:11px;color:var(--text);letter-spacing:1px}.hero-tag i{color:var(--orange);margin-left:12px;font-style:normal}.art-frame{position:relative;margin:0 -5.56%;background:#030b12;overflow:hidden}.banner{width:100%;height:auto;display:block;aspect-ratio:2056/765;object-fit:contain}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.hero-intro{position:relative;display:grid;grid-template-columns:1.3fr 1fr;align-items:center;gap:10%;padding:38px 1% 55px;border-bottom:1px solid var(--line)}.hero-intro h2{font-size:clamp(42px,4.8vw,68px);line-height:1.02;letter-spacing:-3.4px;margin:0}.hero-intro h2 span{color:var(--orange)}.hero-intro>div{display:flex;justify-content:space-between;align-items:center;gap:25px}.hero-intro p{font-size:12px;line-height:1.8;margin:0;color:#a7b8c4}.hero-intro .button{gap:26px;white-space:nowrap}.ticker{max-width:1440px;padding:24px 6%;margin:auto;display:flex;align-items:center;gap:24px;font-size:10px;letter-spacing:1.3px;color:#b7c5ce}.ticker i{color:#4d6373;font-style:normal;font-size:16px}.ticker strong{font-weight:400}.ticker-end{margin-left:auto;color:#667e8e;font-size:9px}.section{max-width:1280px;margin:auto;padding:100px 5.5%}.eyebrow{font-size:9px;font-weight:700;letter-spacing:2.1px;color:#8da4b3}.split{display:grid;grid-template-columns:1fr 1fr;gap:12%}h2{font-size:clamp(36px,4vw,54px);line-height:1.06;letter-spacing:-2.6px;margin:25px 0}h2 em{font-style:normal;color:#708797}p{font-size:14px;line-height:1.9;color:var(--muted)}.lead{font-size:24px;font-weight:500;line-height:1.3;letter-spacing:-.7px;color:var(--text);margin-top:0}.note{border-top:1px solid var(--line);padding-top:24px;font-size:11px;line-height:1.9;margin-top:25px;color:#b1c2cc}.story{max-width:none;padding:85px max(6%,calc((100vw - 1140px)/2));border-block:1px solid var(--line);background:#08131e}.section-title{display:flex;justify-content:space-between;align-items:end;margin-bottom:35px}.section-title p{font-size:12px;margin-bottom:29px}.cards{display:grid;grid-template-columns:1fr 1fr;gap:0}.cards article{padding:35px 48px 32px 0;border-top:2px solid var(--blue)}.cards article.orange{border-top-color:var(--orange);border-left:1px solid var(--line);padding-left:48px;padding-right:0}.cards .blue .eyebrow{color:var(--blue)}.cards .orange .eyebrow{color:var(--orange)}.origin-number{display:flex;align-items:center;justify-content:space-between;font-size:110px;line-height:1;font-weight:800;letter-spacing:-8px;padding:30px 0;color:#34c9ff}.origin-number span{font-size:60px;font-weight:400;letter-spacing:0}.orange .origin-number{color:var(--orange)}h3{font-size:35px;letter-spacing:-1.6px;margin:15px 0}h3 span{font-weight:400;color:#8da2b1}.cards p{max-width:350px;font-size:13px}.cards a{display:flex;justify-content:space-between;font-size:11px;border-top:1px solid var(--line);margin-top:30px;padding-top:22px}.cards a:hover{color:var(--blue)}.orange a:hover{color:var(--orange)}.connection{display:flex;justify-content:center;align-items:center;gap:25px;padding-top:35px}.connection>span{width:80px;height:1px;background:#365264}.connection .word{font-size:28px}.caption{font-size:10px;text-align:center}.identity{align-items:center}.identity-panel{padding:0 0 0 25px;border-left:1px solid var(--line)}dl{margin:0}dl>div{display:flex;justify-content:space-between;align-items:center;padding:22px 0;border-bottom:1px solid var(--line)}dt{font-size:9px;letter-spacing:1.7px;color:#93a9b9}dd{font-size:18px;font-weight:600}.rune-status{display:flex;justify-content:space-between;gap:15px;padding-top:24px;font-size:9px;color:#8da3b3}.rune-status>span:first-child{color:var(--orange);letter-spacing:1px}.community{position:relative;border:1px solid var(--line);padding:60px 5.5%;overflow:hidden;background:radial-gradient(ellipse at 90% 80%,#ff8c1612,transparent 65%)}.community h2{font-size:60px;position:relative;z-index:1}.community h2 span{color:var(--orange)}.community p{position:relative;z-index:1}.community-emblem{position:absolute;width:340px;height:340px;object-fit:contain;right:45px;top:30px;border-radius:50%;opacity:.85;mask-image:radial-gradient(circle,#000 30%,transparent 70%)}.actions{display:flex;gap:15px;position:relative;z-index:1;margin-top:28px}.pending{font-size:10px;color:#a0b4c2;padding-block:10px;border-bottom:1px solid #ffffff30}.faq{padding-top:100px}details{border-bottom:1px solid var(--line)}summary{display:flex;justify-content:space-between;gap:20px;list-style:none;cursor:pointer;font-size:13px;line-height:1.5;padding:23px 0}summary::-webkit-details-marker{display:none}summary span{font-size:19px;color:var(--orange)}details[open] summary span{transform:rotate(45deg)}details p{font-size:12px;margin:0 15px 24px 0}footer{max-width:1440px;margin:auto;padding:35px 6% 25px;border-top:1px solid var(--line)}.footer-top,.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px}.footer-top{padding-bottom:30px}.footer-top p{font-size:12px}.footer-top>a:last-child{font-size:10px}.footer-bottom{border-top:1px solid var(--line);padding-top:22px;font-size:8px;color:#728b9e}.footer-bottom p{font-size:8px;margin:0}a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--blue);outline-offset:6px}
@media(min-width:1600px){.story{padding-inline:calc((100vw - 1140px)/2)}}@media(max-width:1000px){.header-cta{display:none}.hero-intro>div{display:block}.hero-intro .button{margin-top:18px}.section{padding:75px 6%}.community{margin:0 4%;padding:50px 5%}.community-emblem{right:-20px;width:300px;height:300px;opacity:.5}.community h2{font-size:50px}.split{gap:8%}.ticker-end{display:none}.cards article{padding-right:30px}.cards article.orange{padding-left:30px}.faq{grid-template-columns:1fr;gap:25px}}@media(max-width:600px){header{height:72px;justify-content:space-between;padding:0 6%}.brand .word{font-size:22px}.brand img{width:32px;height:32px}.menu{display:block;font-size:20px;background:none;border:1px solid var(--line);color:var(--text);padding:5px 10px}nav{display:none;position:absolute;left:0;right:0;top:72px;background:#08131e;z-index:5;padding:25px 6%;border-bottom:1px solid var(--line);gap:24px}nav.open{display:flex;flex-wrap:wrap}.hero{padding-top:22px}.hero-label{font-size:7px;letter-spacing:1.2px;padding-bottom:18px}.hero-tag{font-size:9px}.art-frame{margin:0 -5.56%;}.banner{min-height:180px;object-fit:cover;object-position:36% center}.hero-intro{grid-template-columns:1fr;gap:25px;padding:30px 1% 36px}.hero-intro h2{font-size:48px;letter-spacing:-2.6px}.hero-intro>div{display:flex;gap:18px;align-items:end}.hero-intro p{font-size:10px}.hero-intro .button{font-size:10px;padding:13px 15px;gap:15px;margin:0}.ticker{padding-block:21px;gap:13px;font-size:8px;letter-spacing:.6px}.ticker strong{font-size:7px}.section{padding:60px 6%}.split{grid-template-columns:1fr;gap:20px}h2{font-size:40px;letter-spacing:-2px}.lead{font-size:22px}.section-title{display:block}.section-title p{margin-bottom:25px}.cards{grid-template-columns:1fr;gap:22px}.cards article,.cards article.orange{padding:26px 0;border-left:0}.origin-number{font-size:90px;padding:22px 0}.origin-number span{font-size:48px}h3{font-size:32px}.identity-panel{padding-left:0;border-left:0}.community{margin:0 4%;padding:40px 6%}.community h2{font-size:42px}.community-emblem{width:230px;height:230px;top:100px;right:-90px;opacity:.3}.community p{font-size:12px}.pending{font-size:9px}.actions{flex-wrap:wrap}.footer-top{flex-wrap:wrap}.footer-top p{order:3;width:100%;margin:0}.footer-bottom{flex-direction:column;align-items:start;gap:9px}.footer-bottom p{line-height:1.8}.caption{font-size:9px;line-height:1.8}}@media(max-width:360px){.hero-intro>div{display:block}.hero-intro .button{margin-top:18px}.hero-intro h2{font-size:42px}}

/* Crystal identity: luminous surfaces, etched geometry, and precise rhythm. */
:root{--bg:#040a13;--blue:#52ceff;--orange:#ff9d32;--muted:#a6b5c5}
body{background:radial-gradient(ellipse at 8% 38%,#0d2d4830,transparent 35%),var(--bg)}
html{scroll-padding-top:110px}header{position:sticky;top:0;z-index:20;background:#040b12ed;backdrop-filter:blur(20px);max-width:none;padding-inline:max(6%,calc((100vw - 1260px)/2));height:82px}
nav a{position:relative;padding-block:14px}nav a:after{content:'';position:absolute;left:0;right:100%;bottom:6px;height:1px;background:var(--orange);transition:right .2s}nav a:hover:after,nav a[aria-current]:after{right:0}
.brand img{border-radius:0;object-fit:contain}.button{border-radius:4px;min-height:44px}.primary{background:var(--orange);border-color:var(--orange);box-shadow:0 4px 30px #ff8b1417}.primary:hover{background:#ffb35b;border-color:#ffb35b;box-shadow:0 5px 35px #ff8b1430}.header-cta{border-color:#ff9d3260;color:#ffb25b}
.hero-label{padding-top:8px}.hero-label>span:first-child:before{content:'';display:inline-block;width:5px;height:5px;background:var(--blue);box-shadow:0 0 10px var(--blue);margin-right:10px;border-radius:50%}
.art-frame:after{content:'';pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 -35px 35px -25px #040a13}.banner{animation:awaken 1.2s ease-out both}.hero-intro{padding-top:32px;padding-bottom:48px}.hero-intro h2{font-size:clamp(42px,4.7vw,68px)}.hero-intro h2 span{background:linear-gradient(110deg,#ffc76d,#ff8a22);background-clip:text;color:transparent}.ticker{border-bottom:1px solid var(--line);font-family:monospace;min-height:70px}.ticker>span:first-child{color:var(--blue)}.ticker>span:nth-of-type(2){color:var(--orange)}
.story{position:relative;background:linear-gradient(115deg,#091c2c,#080f19 52%,#20150f)}.cards{gap:24px}.cards article,.cards article.orange{position:relative;overflow:hidden;border:1px solid #52ceff35;border-top:2px solid var(--blue);padding:32px;background:linear-gradient(140deg,#12354b55,#070e1870);border-radius:4px}.cards article.orange{border-color:#ff9d3235;border-top-color:var(--orange);background:linear-gradient(140deg,#53311d45,#070e1870)}.cards article:after{content:'ᛟ';position:absolute;right:20px;top:28px;font-size:220px;line-height:1;color:#52ceff0b;pointer-events:none;transform:rotate(-14deg)}.cards article.orange:after{content:'ᚷ';color:#ff9d320c;transform:rotate(14deg)}.origin-number{font-size:76px;letter-spacing:-5px;padding:30px 0 15px}.origin-number span{font-size:38px}.cards a{min-height:44px;position:relative;z-index:1}.identity-panel{padding:12px 28px 28px;border:1px solid #52ceff30;border-radius:4px;background:linear-gradient(140deg,#10253965,#07101a)}
.community{background:radial-gradient(ellipse at 85% 60%,#ff8c1620,transparent 65%),linear-gradient(120deg,#092136,#090f19);border-color:#52ceff30;border-radius:5px}.community-emblem{animation:levitate 7s ease-in-out infinite;mask-image:none;opacity:.8;width:300px;height:300px;top:50px;filter:drop-shadow(0 0 35px #ff951f25)}.community .eyebrow{color:var(--blue)}.eyebrow{font-family:monospace;font-size:10px}.skip-link{position:fixed;top:-100px;left:20px;z-index:100;background:var(--orange);color:#040b12;padding:14px}.skip-link:focus{top:12px}summary{min-height:64px}summary:hover{color:var(--blue)}::selection{background:#ff9d32;color:#040b12}.footer-bottom{line-height:1.7}
@keyframes awaken{from{opacity:.3;transform:scale(1.025)}to{opacity:1;transform:scale(1)}}@keyframes levitate{50%{transform:translateY(-12px) rotate(3deg)}}
@media(max-width:1000px){.community-emblem{right:5px;opacity:.4;width:260px;height:260px}.cards article,.cards article.orange{padding:26px}.rune-status{flex-wrap:wrap}}
@media(max-width:600px){header{height:72px}nav{top:72px}.banner{min-height:0;aspect-ratio:2056/765;object-fit:contain}.art-frame{padding-block:10px}.hero-intro h2{font-size:46px}.hero-intro>div{align-items:start}.hero-intro p{font-size:12px}.hero-intro .button{padding:14px;font-size:11px}.ticker{gap:10px;flex-wrap:wrap;min-height:60px}.section{padding-block:62px}.cards{gap:18px}.identity-panel{padding:6px 20px 24px}.community-emblem{right:-75px;top:100px;width:220px;height:220px;opacity:.25}.community h2{font-size:40px}.community{padding-block:42px}.rune-status{font-size:10px}.footer-bottom{font-size:10px}.footer-bottom p{font-size:10px}.caption{font-size:11px}.pending{font-size:11px}.hero-label{letter-spacing:1px}}


/* Cinematic motion — transform and opacity carry the visual effects. */
:root{--ease-out:cubic-bezier(.22,1,.36,1);--ease-soft:cubic-bezier(.16,1,.3,1)}
body{overflow-x:clip}
header{transition:background .45s ease,box-shadow .45s ease,border-color .45s ease}
header.scrolled{background:#040b12f5;border-bottom-color:#52ceff24;box-shadow:0 12px 40px #0004}
.reading-progress{position:fixed;left:0;top:0;z-index:40;width:100%;height:2px;background:linear-gradient(90deg,var(--blue),#87ddff 45%,var(--orange));transform:scaleX(0);transform-origin:left;pointer-events:none;box-shadow:0 0 12px #52ceff70}
.reveal{transition:opacity 1s var(--ease-out) var(--reveal-delay,0ms),translate 1.15s var(--ease-out) var(--reveal-delay,0ms),filter 1s var(--ease-out) var(--reveal-delay,0ms)}
.reveal:not(.is-visible){opacity:0;translate:0 36px;filter:blur(5px)}
.reveal.is-visible{opacity:1;translate:0 0;filter:blur(0)}
.art-frame{isolation:isolate}.banner{animation:crystal-arrival 2.2s cubic-bezier(.22,.61,.36,1) backwards;transform-origin:50% 65%}
.art-frame{background:var(--bg)}
.art-frame:after{display:none}
.crystal-field{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden;mask-image:linear-gradient(transparent,#000 15%,#000 75%,transparent)}
.crystal-field span{position:absolute;left:var(--x);top:var(--y);width:var(--size);height:calc(var(--size) * 1.8);border:1px solid #7cdfff80;background:linear-gradient(130deg,#a2eaff70,#3ebaff08);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);animation:crystal-drift var(--duration) ease-in-out var(--delay) infinite;opacity:.4}
.crystal-field span:nth-child(3n){border-color:#ffb45480;background:linear-gradient(130deg,#ffd28b80,#ff8e1408)}
.hero-label{animation:gentle-in 1s var(--ease-out) both}.hero-intro>h2{animation:hero-text 1.15s var(--ease-out) .15s both}.hero-intro>div{animation:hero-text 1.2s var(--ease-out) .3s both}
.button{position:relative;isolation:isolate;overflow:hidden;transition:transform .5s var(--ease-out),background .35s,border-color .35s,box-shadow .5s}
.button:after{content:'';position:absolute;inset:-100% -60%;z-index:-1;background:linear-gradient(110deg,transparent 35%,#fff5 48%,transparent 60%);transform:translateX(-70%) rotate(8deg);transition:transform .8s var(--ease-out);pointer-events:none}
.button:hover:after{transform:translateX(70%) rotate(8deg)}.button:hover{transform:translateY(-3px)}.button:active{transform:translateY(0) scale(.98)}.button span{transition:transform .45s var(--ease-out)}.button:hover span{transform:translate(3px,-3px)}
.cards article,.identity-panel,.community{--pointer-x:50%;--pointer-y:50%;--tilt-x:0deg;--tilt-y:0deg;transition:opacity 1s var(--ease-out) var(--reveal-delay,0ms),translate 1.15s var(--ease-out) var(--reveal-delay,0ms),filter 1s var(--ease-out),transform .65s var(--ease-out),border-color .5s,box-shadow .65s;transform:perspective(1000px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y))}
.cards article:before,.identity-panel:before,.community:before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(450px circle at var(--pointer-x) var(--pointer-y),#62d7ff12,transparent 65%);opacity:0;transition:opacity .6s}
.identity-panel{position:relative}.cards article.orange:before{background:radial-gradient(450px circle at var(--pointer-x) var(--pointer-y),#ffb05516,transparent 65%)}
@media(hover:hover) and (pointer:fine){.cards article:hover,.identity-panel:hover{border-color:#52ceff70;box-shadow:0 20px 60px -25px #129dff24}.cards article.orange:hover{border-color:#ff9d3270;box-shadow:0 20px 60px -25px #ff8d1424}.cards article:hover:before,.identity-panel:hover:before,.community:hover:before{opacity:1}.cards article:hover .origin-number span{transform:translate(5px,-5px)}.cards article:hover:after{transform:rotate(-6deg) scale(1.05)}}
.origin-number span,.cards article:after{transition:transform .8s var(--ease-out)}.cards a span{transition:transform .4s var(--ease-out)}.cards a:hover span{transform:translate(4px,-4px)}
.connection>span{background:linear-gradient(90deg,transparent,#52ceff80);transform-origin:right;animation:connection-breathe 5s ease-in-out infinite}.connection>span:last-child{background:linear-gradient(90deg,#ff9d3280,transparent);transform-origin:left;animation-delay:-2.5s}
.community-emblem{filter:drop-shadow(0 0 40px #ff951f35)}summary{transition:color .3s}summary span{transition:transform .4s var(--ease-out)}
@keyframes crystal-arrival{from{opacity:.45;transform:scale(1.018)}to{opacity:1;transform:scale(1)}}
@keyframes gentle-in{from{opacity:0}to{opacity:1}}
@keyframes hero-text{from{opacity:0;translate:0 22px}to{opacity:1;translate:0 0}}
@keyframes crystal-drift{0%,100%{transform:translate3d(0,9px,0) rotate(-12deg);opacity:.15}50%{transform:translate3d(12px,-17px,0) rotate(18deg);opacity:.65}}
@keyframes connection-breathe{0%,100%{opacity:.45;scale:.85 1}50%{opacity:1;scale:1 1}}
@media(max-width:600px){nav{display:flex;visibility:hidden;opacity:0;translate:0 -8px;pointer-events:none;transition:opacity .25s,translate .35s var(--ease-out),visibility .25s}nav.open{visibility:visible;opacity:1;translate:0 0;pointer-events:auto}.reveal:not(.is-visible){translate:0 22px;filter:none}.crystal-field span:nth-child(n+7){display:none}.hero-intro>div{animation-delay:.2s}}

@media(max-width:1100px){.header-cta{display:none}}@media(max-width:600px){header{gap:12px}.brand{gap:7px}.brand .word{font-size:20px}.brand img{width:28px;height:28px}.menu{order:3}.hero-intro>div{flex-wrap:wrap}}
/* Keep all header controls on one line on narrow phones. */
@media(max-width:360px){header{padding-inline:4%;gap:8px}.brand{flex-shrink:0;gap:5px}.brand .word{font-size:17px;white-space:nowrap}.brand img{width:24px;height:24px}}


/* Restart the entrance when returning to the hero. */
.hero-replay .banner{animation-name:crystal-return}
.hero-replay .hero-label{animation-name:label-return}
.hero-replay .hero-intro>h2,.hero-replay .hero-intro>div{animation-name:text-return;animation-duration:1.8s;animation-timing-function:cubic-bezier(.22,.61,.36,1);animation-delay:.1s}
@keyframes crystal-return{from{opacity:.45;transform:scale(1.018)}to{opacity:1;transform:scale(1)}}
@keyframes label-return{from{opacity:0}to{opacity:1}}
@keyframes text-return{from{opacity:.65;translate:0 6px}to{opacity:1;translate:0 0}}



/* Fade the whole artwork layer to transparency so the page background continues through it. */
.art-frame{background:transparent;-webkit-mask-image:linear-gradient(to right,transparent 3%,rgba(0,0,0,.25) 10%,#000 30%,#000 70%,rgba(0,0,0,.25) 90%,transparent 97%),linear-gradient(to bottom,transparent 2%,#000 28%,#000 48%,rgba(0,0,0,.35) 72%,transparent 90%);mask-image:linear-gradient(to right,transparent 3%,rgba(0,0,0,.25) 10%,#000 30%,#000 70%,rgba(0,0,0,.25) 90%,transparent 97%),linear-gradient(to bottom,transparent 2%,#000 28%,#000 48%,rgba(0,0,0,.35) 72%,transparent 90%);-webkit-mask-composite:source-in;mask-composite:intersect}


/* Header brand: compact gemstone and a single, precisely spaced wordmark. */
header .header-brand{flex-shrink:0;gap:11px;min-height:44px}
header .brand-mark{display:grid;place-items:center;width:40px;height:44px;overflow:hidden;mix-blend-mode:screen}
header .brand-mark img{display:block;width:62px;height:62px;max-width:none;border-radius:0;flex-shrink:0}
header .brand-lockup{display:flex;flex-direction:column;gap:5px}
header .header-brand .word{display:flex;gap:0;font-size:20px;line-height:1;letter-spacing:1.2px;font-weight:800;white-space:nowrap}
header .header-brand .word b{font-weight:800}
header .header-brand .word b:first-child{color:#f2f5f7}
header .header-brand .word b:last-child{color:#ffad48}
header .brand-caption{font-size:8px;font-weight:600;line-height:1;letter-spacing:2px;color:#8095a5}
header .header-brand:focus-visible{outline:2px solid var(--blue);outline-offset:5px;border-radius:3px}
@media(max-width:600px){header .header-brand{gap:8px}header .brand-mark{width:30px;height:36px}header .brand-mark img{width:48px;height:48px}header .header-brand .word{font-size:17px;letter-spacing:.7px}header .brand-caption{font-size:6px;letter-spacing:1.7px}header .brand-lockup{gap:5px}}
@media(max-width:360px){header .header-brand{gap:6px}header .brand-mark{width:26px}header .brand-mark img{width:42px;height:42px}header .header-brand .word{font-size:15px;letter-spacing:.5px}header .brand-caption{letter-spacing:1.3px}}
header .brand-mark{position:relative;display:block;-webkit-mask-image:radial-gradient(ellipse,#000 48%,transparent 74%);mask-image:radial-gradient(ellipse,#000 48%,transparent 74%)}
header .brand-mark img{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}

/* Use the transparent emblem at its natural proportions. */
header .brand-mark{display:flex;align-items:center;justify-content:center;overflow:visible;mix-blend-mode:normal;-webkit-mask-image:none;mask-image:none}
header .brand-mark img{position:static;transform:none;width:44px;height:44px;object-fit:contain}
header .header-brand .word b:first-child{color:#69AAC1}
@media(max-width:600px){header .brand-mark img{width:36px;height:36px}}
@media(max-width:360px){header .brand-mark img{width:30px;height:30px}}









/* One motion rhythm: repeat smoothly from either direction, without blur or flashes. */
.reveal,.cards article.reveal,.identity-panel.reveal,.community.reveal{transition:opacity 1.2s cubic-bezier(.22,.61,.36,1),translate 1.4s cubic-bezier(.22,.61,.36,1),transform .65s var(--ease-out),border-color .5s,box-shadow .65s;filter:none}
.reveal:not(.is-visible){opacity:0;translate:0 var(--reveal-offset,12px);filter:none}
.reveal.is-visible{opacity:1;translate:0 0;filter:none}
.hero-intro>h2,.hero-intro>div,.banner{animation:none}
.art-frame.reveal{translate:none;opacity:1}
.art-frame .banner{transition:opacity 1.6s cubic-bezier(.22,.61,.36,1),transform 1.9s cubic-bezier(.22,.61,.36,1)}
.art-frame.reveal:not(.is-visible) .banner{opacity:.15;transform:scale(1.018)}
.art-frame.reveal.is-visible .banner{opacity:1;transform:scale(1)}

/* Editorial hero copy and a compact story invitation. */
.hero-intro{grid-template-columns:1.15fr 1fr;gap:8%;padding-block:38px 46px}
.hero-intro>.hero-story{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:0;padding-left:28px;border-left:1px solid #69aac139}
.hero-intro .hero-origin{font-size:clamp(14px,1.35vw,17px);line-height:1.85;letter-spacing:-.15px;color:#b2c1ca}
.hero-origin strong{font-weight:600;color:#e7eef2}
.hero-origin strong:first-child{color:#84bed0}
.hero-origin strong:last-child{color:#eeb570}
.hero-intro .hero-shared{margin-top:8px;font-size:12px;line-height:1.7;color:#7f96a5}
.hero-intro .story-link{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;margin-top:23px;padding:8px 8px 8px 17px;min-height:46px;border:1px solid #ffffff25;border-radius:5px;background:#ffffff04;color:#eef3f5;font-size:12px;font-weight:600;letter-spacing:.1px}
.hero-intro .story-link span{display:grid;place-items:center;width:30px;height:30px;border-radius:3px;background:#ffad4817;color:#ffb45a;font-size:17px}
.hero-intro .story-link:hover{border-color:#ffad4865;background:#ffad480a;transform:translateY(-2px)}
.hero-intro .story-link:hover span{transform:translate(1px,-1px)}
@media(max-width:600px){.hero-intro{grid-template-columns:1fr;gap:28px;padding-block:26px 36px}.hero-intro>.hero-story{padding-left:18px}.hero-intro .hero-origin{font-size:14px}.hero-intro .hero-shared{font-size:12px}.hero-intro .story-link{margin-top:19px;font-size:12px;padding:8px 8px 8px 16px}}

/* Stonk.fun's opposing arrow motif, kept behind the card content. */
.cards article:not(.orange):after{content:'';width:220px;height:220px;right:12px;top:28px;background:url('assets/stonkfun%20logo%20no%20bg.png') center/contain no-repeat;-webkit-mask:none;mask:none;opacity:.22;transform:rotate(-8deg)}
@media(hover:hover) and (pointer:fine){.cards article:not(.orange):hover:after{transform:rotate(0deg) scale(1.03)}}




/* Subtle story watermarks keep the artwork texture in the background. */
.cards article:not(.orange):after{opacity:.1}
.cards article.orange:after{color:#ff9d32;opacity:.035}

.cards article.orange:after{content:'';width:220px;height:220px;right:12px;top:28px;background:url('assets/etchy%20logo%20no%20bg.png') center/contain no-repeat;color:transparent;opacity:.12;transform:rotate(8deg)}
@media(hover:hover) and (pointer:fine){.cards article.orange:hover:after{transform:rotate(0deg) scale(1.03)}}

/* Shared STONCHY wordmark across the header, story, details and footer. */
.word{display:inline-flex;align-items:baseline;gap:0;line-height:1;letter-spacing:1.2px;font-weight:800;white-space:nowrap}
.word b{font-weight:800}
.word b:first-child{color:#69AAC1}
.word b:last-child{color:#ffad48}
.connection .word{font-size:28px;letter-spacing:1.2px}
.footer-top .word{font-size:20px;letter-spacing:1.2px}
.identity-panel .word{font-size:20px;letter-spacing:1.2px}

.token-symbol{color:#fff}


.hero-origin a{font-weight:600;text-decoration:underline;text-decoration-color:transparent;text-underline-offset:4px;transition:color .25s,text-decoration-color .25s}
.hero-origin .origin-stonk{color:#84bed0}
.hero-origin .origin-etchy{color:#eeb570}
.hero-origin a:hover,.hero-origin a:focus-visible{text-decoration-color:currentColor;color:#fff}

.hero-intro .hero-origin{max-width:360px;font-size:clamp(15px,1.5vw,18px);line-height:1.65;letter-spacing:-.2px;text-wrap:pretty}
.hero-intro .hero-shared{margin-top:10px;font-size:13px;line-height:1.7;color:#91a5b3}
.hero-origin a{white-space:nowrap;text-decoration-color:#ffffff25;text-decoration-thickness:1px;text-underline-offset:4px}
.hero-intro>.hero-story{padding-block:5px}
@media(max-width:600px){.hero-intro .hero-origin{font-size:16px}.hero-intro .hero-shared{font-size:12px}}

.hero-intro .story-link{padding:13px 18px;min-height:44px}


/* A focused introduction to the launchpad connection and holder fees. */
.about-section{align-items:start;gap:10%;padding-block:100px}
.about-section h2{margin-top:22px;max-width:430px}
.about-section .lead{font-size:clamp(23px,2.2vw,29px);line-height:1.35;letter-spacing:-.7px;margin-bottom:24px;color:#eaf0f3}
.about-section>div:last-child>p:not(.lead){max-width:470px;font-size:14px;line-height:1.9;color:#9dafbb}
.holder-fees{margin-top:30px;padding:23px 0 0;border-top:1px solid #69aac133}
.holder-fees .eyebrow{font-size:9px;letter-spacing:1.8px;color:#69aac1}
.holder-fees p{margin:11px 0 6px;font-size:23px;line-height:1.3;font-weight:600;letter-spacing:-.5px;color:#edf3f6}
.holder-fees>span:last-child{display:block;font-size:12px;line-height:1.8;color:#849aa9}
@media(max-width:600px){.about-section{gap:25px;padding-block:62px}.about-section .lead{font-size:24px;margin-bottom:20px}.holder-fees{margin-top:25px;padding-top:22px}.holder-fees p{font-size:21px}}
