/* 1TK V18 — one connected, scroll-driven narrative. All artwork is CSS/SVG; original emblem unchanged. */
.story-section{position:relative;isolation:isolate;background:radial-gradient(ellipse 80% 26% at 50% 2%,rgba(103,171,186,.095),transparent 72%),linear-gradient(180deg,#060c15 0%,#0a111b 18%,#080e16 82%,#071017 100%);padding:95px 0 86px;overflow:clip;color:#f2f1ee}
.story-section::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;background-image:linear-gradient(rgba(255,255,255,.015) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.015) 1px,transparent 1px);background-size:74px 74px;mask-image:linear-gradient(180deg,transparent,#000 25%,#000 70%,transparent)}
.story-intro{display:grid;justify-items:center;text-align:center;gap:17px;max-width:1130px;margin-bottom:54px}
.story-eyebrow{display:flex;align-items:center;gap:12px;font:700 11px 'DM Sans',sans-serif;letter-spacing:.26em;color:#d9c18a}
.story-eyebrow i{width:7px;height:7px;border-radius:50%;background:#78d8ce;box-shadow:0 0 0 5px #78d8ce20,0 0 25px #78d8ceaa}
.story-slash{color:#6e8395}
.story-intro h2{max-width:1000px;margin:0;font-family:'IBM Plex Sans Arabic','DM Sans',sans-serif;font-size:clamp(40px,5.8vw,84px);font-weight:700;line-height:1.25;letter-spacing:-.045em;color:#f4efe6}
.story-intro h2 em{display:block;font-style:normal;background:linear-gradient(90deg,#c19d63,#ffe8a6 48%,#b6c4c8);-webkit-background-clip:text;background-clip:text;color:transparent}
.story-intro p{font-size:clamp(15px,1.5vw,19px);line-height:1.8;max-width:690px;color:#afbbc7;margin:0}
.story-scroll-cue{display:flex;align-items:center;gap:10px;font-size:12px;color:#94abb6;margin-top:4px;letter-spacing:.02em}
.story-mouse{display:grid;place-items:center;width:27px;height:41px;border:1px solid #8cb6b87a;border-radius:18px;font-size:16px;animation:story-arrow 1.8s ease-in-out infinite}
@keyframes story-arrow{50%{transform:translateY(5px);color:#ecd490}}
.story-layout{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(24px,5.8vw,98px);align-items:start;position:relative}
.story-stage{position:sticky;top:102px;min-width:0;z-index:4;border-radius:30px;overflow:hidden;border:1px solid rgba(209,211,202,.15);background:radial-gradient(circle at 50% 25%,rgba(13,54,74,.38),transparent 70%),#07111d;box-shadow:0 36px 110px #0009, inset 0 1px 0 #ffffff23}
.story-art{height:clamp(370px,57vh,540px);position:relative;overflow:hidden;background:radial-gradient(ellipse 76% 90% at 50% 45%,#123348 0%,#0b2133 30%,#07101c 75%)}
.story-bg-image{position:absolute;inset:-5%;background:url('assets/nation-concept.webp') center 61%/cover no-repeat;opacity:.27;filter:brightness(.6) saturate(.78);mask-image:linear-gradient(180deg,transparent,#000 16%,#000 65%,transparent)}
.story-art-grain{position:absolute;inset:0;background-image:radial-gradient(#dfecef 0.7px, transparent 1px);background-size:27px 29px;opacity:.16;mask-image:linear-gradient(180deg,#000,transparent 84%)}
.story-celestial-ring{position:absolute;border:1px solid rgba(121,224,221,.22);border-radius:50%;left:50%;top:47%;transform:translate(-50%,-50%) rotate(-22deg);pointer-events:none}
.story-ring-a{width:390px;height:390px;box-shadow:0 0 100px #3f91a21a,inset 0 0 100px #3f91a206}
.story-ring-b{width:540px;height:210px;transform:translate(-50%,-50%) rotate(-26deg);border-color:#e7d19522}
.story-horizon{position:absolute;left:8%;right:8%;bottom:13%;height:1px;background:linear-gradient(90deg,transparent,#c6b38366,#70e2d588,transparent);box-shadow:0 0 34px #70e2d590}
.story-skyline{position:absolute;bottom:10%;left:0;right:0;display:flex;align-items:end;gap:7px;height:85px;justify-content:center;opacity:.28;pointer-events:none}
.story-skyline i{display:block;flex:1;max-width:40px;background:linear-gradient(0deg,#0b1b28,#38728755);height:45%;clip-path:polygon(0% 12%,65% 12%,65% 0,100% 0,100% 100%,0 100%)}
.story-skyline i:nth-child(3n){height:86%}.story-skyline i:nth-child(4n){height:64%}.story-skyline i:nth-child(5n){height:100%}
.story-scene-layer{transition:opacity .75s ease,transform .9s cubic-bezier(.2,.65,.1,1),filter .75s ease;pointer-events:none}
.story-people{position:absolute;inset:0;opacity:1}
.story-person{position:absolute;bottom:22%;width:94px;height:180px;display:flex;align-items:center;flex-direction:column;transform:translateX(-50%);transition:opacity .7s,transform .8s,left .8s,filter .8s;filter:drop-shadow(0 0 15px #79d6c332)}
.story-person-left{left:23%}.story-person-center{left:50%}.story-person-right{left:77%}
.story-person .person-halo{position:absolute;top:-25px;left:50%;transform:translateX(-50%);width:92px;height:92px;border:1px solid #f4d9962a;border-radius:50%;box-shadow:0 0 20px #d9cc9250,0 0 70px #52c6c52b,inset 0 0 20px #c4a96b22}
.story-person .person-head{width:39px;height:42px;border-radius:52% 52% 46% 46%;background:linear-gradient(140deg,#d4b981,#365568 75%);border:1px solid #ead4a365;z-index:1;box-shadow:0 0 25px #c2dfd733}
.story-person .person-body{width:81px;height:102px;margin-top:8px;border-radius:50% 50% 14% 14%;border:1px solid #9dcdcd77;background:linear-gradient(135deg,#637a7d98,#0c1c2f 76%);box-shadow:inset 0 7px 18px #d5c89720}
.story-person b{position:absolute;top:-43px;font:700 15px 'DM Sans',sans-serif;color:#ddca96;letter-spacing:.2em;text-shadow:0 0 28px #dcc680}
.story-pledge-wire{position:absolute;left:32%;right:32%;bottom:47%;height:4px;background:linear-gradient(90deg,#57d7cd,#e4d092,#6bdbd0);box-shadow:0 0 35px #67d2c9;opacity:0;transform:scaleX(.4);transition:.75s;display:flex;justify-content:space-around;align-items:center}
.story-pledge-wire span:not(.wire-diamond){width:7px;height:7px;border-radius:50%;background:#f0d995;box-shadow:0 0 20px #eee}
.story-pledge-wire .wire-diamond{position:absolute;display:grid;place-items:center;left:50%;top:50%;transform:translate(-50%,-50%);width:55px;height:55px;border-radius:50%;background:#0b2735;border:1px solid #a6ded5;color:#fae3a5;font-size:34px;box-shadow:0 0 25px #50b8b771}
.story-token{position:absolute;top:15%;left:50%;width:min(39%,245px);aspect-ratio:1;transform:translate(-50%,30%) scale(.56) rotate(-16deg);opacity:0;filter:blur(9px)}
.story-token img{position:relative;width:100%;height:100%;border-radius:50%;object-fit:cover;box-shadow:0 15px 60px #000a;border:2px solid #f4d69c70}
.story-token-halo{position:absolute;inset:-28%;border-radius:50%;background:radial-gradient(circle,#e0c98727,transparent 66%);box-shadow:0 0 60px #cfc08025;animation:story-breathe 4s ease-in-out infinite}
@keyframes story-breathe{50%{transform:scale(1.09);opacity:.6}}
.story-wallet{position:absolute;left:50%;top:25%;width:min(70%,290px);height:210px;transform:translate(-50%,35%) scale(.7) rotate(-10deg);opacity:0;filter:blur(8px);border:1px solid #dbcc9b6e;border-radius:20px;padding:20px;background:linear-gradient(135deg,#172a37,#091420 80%);box-shadow:0 40px 80px #02070dbb,0 0 70px #d6bf7633}
.story-wallet-top,.story-wallet-bot{display:flex;align-items:center;justify-content:space-between;gap:8px;font:700 10px 'DM Sans',sans-serif;letter-spacing:.12em;color:#abc0ca}
.story-wallet-balance{display:flex;align-items:center;gap:15px;margin:21px 0 18px}.story-wallet-balance img{height:55px;width:55px;border-radius:50%}.story-wallet-balance strong{font:700 48px 'DM Sans',sans-serif;color:#f5dfae}
.story-wallet-bot{font-family:'IBM Plex Sans Arabic','DM Sans',sans-serif;font-size:12px;letter-spacing:0;color:#f1d391}.story-wallet-bot svg{width:35px;height:35px;color:#f1d391}.story-locked-dot{width:9px;height:9px;border-radius:50%;background:#e5c879;box-shadow:0 0 14px #e5c879}
.story-review{position:absolute;left:27%;top:17%;width:210px;height:225px;transform:translate(-50%,35%) scale(.7);opacity:0;filter:blur(7px);border:1px solid #80e2d28c;background:linear-gradient(170deg,#122b3da8,#07131fc9);border-radius:19px;padding:13px;box-shadow:0 0 54px #46b2b047}
.story-review-head{display:flex;justify-content:space-between;font:700 8px 'DM Sans',sans-serif;color:#9adfd5;letter-spacing:.08em}.story-review-head i{font-style:normal;font:500 8px 'IBM Plex Sans Arabic',sans-serif}.story-scan{display:block;width:100%;height:172px}.story-scan-beam{animation:story-scan 3s ease-in-out infinite}@keyframes story-scan{50%{transform:translateY(30px)}}
.story-market-orbit{position:absolute;left:72%;top:37%;transform:translate(-50%,20%) scale(.7);width:265px;opacity:0;filter:blur(8px)}.story-market-orbit svg{width:100%;overflow:visible;filter:drop-shadow(0 0 25px #1fd2bc42)}.story-market-orbit span{display:block;text-align:center;color:#d9c58d;font:700 12px 'DM Sans',sans-serif;letter-spacing:.2em;margin-top:-13px}.story-chart-path{stroke-dasharray:350;stroke-dashoffset:350;transition:stroke-dashoffset 1.5s ease}
.story-transition-arrow{position:absolute;top:42%;left:50%;transform:translate(-50%,-50%);font-size:44px;color:#d7bd76;opacity:0;filter:drop-shadow(0 0 15px #d7bd76)}
.story-art-caption{position:absolute;bottom:15px;inset-inline:23px;display:flex;justify-content:space-between;font:700 10px 'DM Sans',sans-serif;color:#bfd0d5;letter-spacing:.2em}
.story-art-caption b{color:#dec489}
.story-stage-info{position:relative;background:linear-gradient(130deg,#10202d,#0a1521);padding:21px 25px 24px;border-top:1px solid #c8c29d20}
.story-stage-top{display:flex;justify-content:space-between;color:#9cadb9;font-size:12px;align-items:center}.story-stage-top b{font:700 19px 'DM Sans',sans-serif;color:#ebd595}.story-stage-top small{color:#80929e;font-size:11px}
.story-stage-info h3{margin:9px 0 6px;font-size:clamp(19px,1.9vw,27px);font-weight:700;line-height:1.5;color:#f8f1e5;min-height:40px}
.story-stage-info p{font-size:14px;color:#a9c0c7;line-height:1.8;min-height:50px;margin:0 0 14px}
.story-controls{display:flex;gap:8px;justify-content:space-between;direction:ltr}
.story-dot{border:1px solid #4560717a;background:#152c39;color:#b4ccd2;border-radius:11px;height:35px;flex:1;cursor:pointer;font:700 12px 'DM Sans',sans-serif;transition:background .3s,border-color .3s,transform .3s}
.story-dot:hover{border-color:#f1cd83;transform:translateY(-2px)}.story-dot.is-active{background:linear-gradient(110deg,#d3ac62,#e9d7a2);color:#10212c;border-color:transparent;box-shadow:0 0 22px #bfa0633b}
.story-chapters{display:flex;flex-direction:column;min-width:0}
.story-chapter{min-height:77vh;display:flex;flex-direction:column;justify-content:center;padding:42px 0 42px 20px;border-bottom:1px solid #a8b7a522;opacity:.45;transform:translateY(12px);transition:opacity .5s,transform .6s}
.story-chapter:first-child{min-height:68vh}.story-chapter:last-child{min-height:85vh}
.story-chapter.is-active{opacity:1;transform:none}
.story-chapter-index{font:700 20px 'DM Sans',sans-serif;letter-spacing:.1em;color:#f3d58c;display:flex;gap:13px;align-items:center;direction:ltr;justify-content:flex-end}
.story-chapter-index i{font-size:10px;font-style:normal;color:#a3b8c1;letter-spacing:.19em}
.story-chapter h3{font-size:clamp(28px,3.3vw,49px);line-height:1.3;letter-spacing:-.035em;margin:18px 0 12px;color:#f4f2ed;font-weight:700}
.story-chapter p{font-size:clamp(15px,1.25vw,18px);line-height:2;color:#a7b9c3;max-width:430px;margin:0}
.story-chapter-tag{align-self:start;display:inline-flex;gap:9px;color:#f0d592;font-weight:600;font-size:12px;letter-spacing:0;border:1px solid #d6bd7740;background:#d6bd7710;border-radius:99px;padding:10px 15px;margin-top:23px}
.story-footnote{margin-top:35px;border:1px solid #aac1bf29;border-radius:18px;background:#0c1822;display:flex;align-items:center;gap:15px;padding:22px 25px;color:#b8c8ce;font-size:13px;line-height:1.8}
.story-footnote>span{font-size:27px;color:#dec684}.story-footnote p{margin:0;flex:1}.story-footnote a{white-space:nowrap;color:#ebcd89;font-weight:700;font-size:14px}.story-footnote a span{margin-inline-start:8px}
/* Choreographed visual state changes */
.story-stage[data-phase="origin"] .story-person{opacity:1}
.story-stage[data-phase="pledge"] .story-person-left{left:26%;opacity:1;transform:translateX(-50%) scale(1.1)}
.story-stage[data-phase="pledge"] .story-person-center{opacity:0;transform:translateX(-50%) translateY(30px) scale(.7)}
.story-stage[data-phase="pledge"] .story-person-right{left:74%;opacity:1;transform:translateX(-50%) scale(1.1)}
.story-stage[data-phase="pledge"] .story-pledge-wire{opacity:1;transform:scaleX(1)}
.story-stage[data-phase="mint"] .story-person,.story-stage[data-phase="lock"] .story-person,.story-stage[data-phase="verify"] .story-person{opacity:.13;filter:blur(5px);transform:translateX(-50%) scale(.82)}
.story-stage[data-phase="mint"] .story-token{opacity:1;filter:none;transform:translate(-50%,12%) scale(1) rotate(0)}
.story-stage[data-phase="lock"] .story-wallet{opacity:1;filter:none;transform:translate(-50%,0) scale(1) rotate(0)}
.story-stage[data-phase="verify"] .story-review{opacity:1;filter:none;transform:translate(-50%,0) scale(1)}
.story-stage[data-phase="verify"] .story-market-orbit{opacity:1;filter:none;transform:translate(-50%,-3%) scale(1)}
.story-stage[data-phase="verify"] .story-chart-path{stroke-dashoffset:0}
.story-stage[data-phase="verify"] .story-transition-arrow{opacity:1}
@media(max-width:1050px){.story-layout{grid-template-columns:1.05fr .95fr;gap:28px}.story-chapter{padding-inline:4px}.story-art{height:420px}.story-stage{top:90px}.story-person{height:160px;bottom:21%}.story-review{left:29%;width:180px}.story-market-orbit{left:69%;width:190px}.story-chapter h3{font-size:34px}}
@media(max-width:740px){.story-section{padding:58px 0 58px}.story-intro{margin-bottom:30px;gap:9px}.story-intro h2{font-size:clamp(34px,8vw,48px)}.story-intro p{font-size:14px}.story-scroll-cue{margin:6px 0 0}.story-layout{grid-template-columns:1fr;gap:0}.story-stage{top:73px;border-radius:21px;position:sticky;box-shadow:0 12px 45px #020b14ef;margin:0 -2px;z-index:15}.story-art{height:clamp(220px,37vh,330px)}.story-stage-info{padding:11px 15px 13px}.story-stage-info h3{font-size:18px;min-height:27px;margin:4px 0 1px}.story-stage-info p{font-size:12px;line-height:1.5;min-height:37px;margin:0 0 7px}.story-stage-top b{font-size:14px}.story-dot{height:30px}.story-stage-top{font-size:10px}.story-person{width:66px;height:117px;bottom:20%}.story-person .person-head{width:28px;height:29px}.story-person .person-body{width:55px;height:73px;margin-top:5px}.story-person .person-halo{width:58px;height:58px;top:-16px}.story-person b{font-size:10px;top:-24px}.story-ring-a{width:250px;height:250px}.story-ring-b{width:330px;height:130px}.story-token{width:150px;top:12%}.story-wallet{width:210px;height:150px;top:18%;padding:12px}.story-wallet-top{font-size:8px}.story-wallet-balance{margin:12px 0 8px}.story-wallet-balance img{width:40px;height:40px}.story-wallet-balance strong{font-size:36px}.story-review{left:31%;top:12%;width:140px;height:160px;padding:9px}.story-review-head{font-size:6px}.story-scan{height:118px}.story-market-orbit{left:70%;top:32%;width:120px}.story-market-orbit span{font-size:9px}.story-transition-arrow{font-size:22px}.story-art-caption{bottom:8px;inset-inline:12px;font-size:8px}.story-chapters{padding:0 4px}.story-chapter,.story-chapter:first-child,.story-chapter:last-child{min-height:62vh;padding:32px 6px;justify-content:center;opacity:.58}.story-chapter h3{font-size:clamp(25px,7vw,34px);margin:6px 0 6px}.story-chapter-index{font-size:16px}.story-chapter p{font-size:14px;line-height:1.8}.story-chapter-tag{font-size:11px;margin-top:14px}.story-footnote{padding:16px;flex-wrap:wrap;margin-top:8px;font-size:12px}.story-footnote a{width:100%;white-space:normal}.story-bg-image{opacity:.22}}
@media(max-width:380px){.story-stage{top:66px}.story-art{height:210px}.story-stage-info p{font-size:11px;min-height:33px}.story-stage-info h3{font-size:17px}.story-chapter{min-height:65vh}}
@media(prefers-reduced-motion:reduce){.story-mouse,.story-scan-beam,.story-token-halo{animation:none!important}.story-scene-layer,.story-person,.story-chapter,.story-dot,.story-pledge-wire,.story-chart-path{transition:none!important}}
html[dir="ltr"] .story-chapter{padding:42px 20px 42px 0}html[dir="ltr"] .story-chapter-index{justify-content:flex-start}html[dir="ltr"] .story-chapter-tag{align-self:start}
