/* =========================================================
   BUNDLE INU ($BUNINU) — "Knight of the Mist" theme
   Palette sampled from the source photo
   ========================================================= */
:root{
  --ink:#1c2124;
  --ink-2:#3b4346;
  --slate:#a3abb8;
  --slate-2:#7d7c73;
  --mist:#c9cccf;
  --fog:#eceae6;
  --cream:#f5f1e8;
  --gold:#dcb877;
  --gold-hi:#f7e2ae;
  --gold-mid:#b99257;
  --gold-deep:#8d6a36;
  --bronze:#533d29;
  --night:#141919;
  --night-2:#232a2a;
  --steel:#b9bcc4;
  --rose:#f1a7b8;
  --rose-deep:#c97a8e;
  --moss:#4e533d;
  --moss-dark:#2a2f17;
  --f-goth:"Grenze Gotisch","UnifrakturCook",Georgia,serif;
  --f-head:"Marcellus","Cinzel",Georgia,serif;
  --f-body:"Instrument Sans",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --f-mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --ease:cubic-bezier(.2,.8,.2,1);
  --glow:0 0 16px rgba(255,236,190,.6),0 0 50px rgba(255,248,230,.35);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:auto;-webkit-text-size-adjust:100%}
html.no-lenis{scroll-behavior:smooth}
body{margin:0;background:var(--mist);color:var(--ink);font-family:var(--f-body);font-size:17px;line-height:1.55;overflow-x:hidden;-webkit-font-smoothing:antialiased}
body.is-loading{overflow:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
svg{width:1em;height:1em;flex:none}
::selection{background:var(--gold);color:var(--ink)}
main{position:relative}

/* ---------- PRELOADER ---------- */
#preloader{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;overflow:hidden;background:#171c1c}
.pl-img{position:absolute;inset:0;background:url(../img/hero-wide.webp) center/cover no-repeat;transform:scale(1.12);animation:plZoom 3.2s var(--ease) forwards}
@media (max-aspect-ratio:3/4){.pl-img{background-image:url(../img/hero-tall.webp)}}
@keyframes plZoom{to{transform:scale(1)}}
.pl-shade{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 55%,rgba(20,25,25,.05),rgba(20,25,25,.55) 70%),linear-gradient(to top,rgba(20,25,25,.85),transparent 45%)}
.pl-beam{position:absolute;left:50%;top:0;bottom:0;width:2px;margin-left:-1px;background:linear-gradient(transparent,#fff5d6 30%,#ffd98a 70%,transparent);box-shadow:var(--glow);transform:scaleY(0);transform-origin:bottom;animation:beam 1.6s .2s var(--ease) forwards;mix-blend-mode:screen;opacity:.85}
@keyframes beam{to{transform:scaleY(1)}}
.pl-center{position:absolute;left:0;right:0;bottom:7vh;display:flex;flex-direction:column;align-items:center;gap:10px;z-index:2;text-align:center;padding:0 16px}
.pl-coin{width:74px;height:74px;animation:spin 2.4s linear infinite;filter:drop-shadow(0 6px 18px rgba(0,0,0,.4))}
@keyframes spin{from{transform:rotateY(0)}to{transform:rotateY(360deg)}}
.pl-title{font-family:var(--f-goth);font-weight:900;font-size:clamp(46px,8vw,104px);line-height:.9;color:var(--cream);text-shadow:0 0 30px rgba(255,210,130,.7),0 4px 30px rgba(0,0,0,.4)}
.pl-ticker{font-family:var(--f-mono);font-weight:700;letter-spacing:.35em;color:var(--gold-hi);font-size:14px}
.pl-bar{width:min(320px,70vw);height:3px;background:rgba(255,255,255,.18);border-radius:3px;overflow:hidden;margin-top:6px}
.pl-bar span{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--gold-deep),var(--gold-hi));box-shadow:var(--glow);transition:width .25s linear}
.pl-num{font-family:var(--f-mono);font-size:12px;color:rgba(255,255,255,.7);letter-spacing:.2em}
#preloader{clip-path:inset(0 0 0 0);transition:clip-path 1.1s cubic-bezier(.7,0,.2,1)}
#preloader.open{clip-path:inset(50% 0 50% 0)}
#preloader.open .pl-center{opacity:0;transition:opacity .3s}
#preloader.gone{display:none}

/* ---------- LIGHT-BLADE SCROLL PROGRESS ---------- */
.blade-progress{position:fixed;left:22px;top:110px;bottom:40px;width:10px;z-index:60;pointer-events:none;display:flex;flex-direction:column;align-items:center}
.bp-track{flex:1;width:4px;border-radius:4px;background:rgba(28,33,36,.15);position:relative;overflow:visible}
.bp-fill{position:absolute;left:0;right:0;top:0;height:0;border-radius:4px;background:linear-gradient(#fff9e6,var(--gold-hi) 50%,var(--gold));box-shadow:var(--glow)}
.bp-fill i{position:absolute;left:50%;bottom:-6px;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:var(--rose);box-shadow:0 0 14px 6px rgba(255,214,140,.8)}
.bp-hilt{width:22px;height:4px;border-radius:3px;background:var(--gold-deep);margin-top:6px;box-shadow:0 1px 0 rgba(255,255,255,.3)}
.bp-hilt::after{content:"";display:block;width:6px;height:16px;margin:4px auto 0;border-radius:2px;background:var(--bronze)}

#embers{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:55;mix-blend-mode:screen}

/* ---------- HEADER ---------- */
.site-header{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px clamp(16px,4vw,48px);transition:background .4s,box-shadow .4s,padding .4s}
.site-header.scrolled{background:rgba(20,25,25,.92);box-shadow:0 10px 30px rgba(0,0,0,.25);padding-top:10px;padding-bottom:10px}
.brand{display:flex;align-items:center;gap:10px}
.brand img{width:40px;height:40px;border-radius:50%;filter:drop-shadow(0 2px 8px rgba(0,0,0,.25))}
.brand-name{font-family:var(--f-goth);font-weight:900;font-size:28px;line-height:1;color:var(--ink);transition:color .4s}
.brand-tick{font-family:var(--f-mono);font-weight:700;font-size:11px;letter-spacing:.14em;padding:4px 8px;border-radius:4px;background:var(--ink);color:var(--rose)}
.site-header.scrolled .brand-name{color:var(--cream)}
.site-header.scrolled .brand-tick{background:var(--gold);color:var(--ink)}
.nav-links{display:flex;gap:6px}
.nav-links a{font-family:var(--f-head);font-size:15px;letter-spacing:.06em;padding:8px 14px;border-radius:40px;color:var(--ink);transition:background .3s,color .3s}
.nav-links a:hover{background:rgba(255,255,255,.45)}
.site-header.scrolled .nav-links a{color:var(--fog)}
.site-header.scrolled .nav-links a:hover{background:rgba(228,186,117,.18);color:var(--gold-hi)}
.head-social{display:flex;align-items:center;gap:10px}

/* shield buttons (TG / X) */
.shield-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;min-width:52px;padding:0 16px;font-family:var(--f-mono);font-weight:700;font-size:13px;letter-spacing:.08em;color:var(--ink);
  background:linear-gradient(160deg,#fff4d0 0%,var(--gold) 45%,var(--gold-mid) 70%,#f6d596 100%);
  clip-path:polygon(0 0,100% 0,100% 62%,50% 100%,0 62%);
  padding-bottom:6px;
  transition:transform .3s var(--ease),filter .3s;filter:drop-shadow(0 4px 10px rgba(83,61,41,.35))}
.shield-btn svg{width:17px;height:17px}
.shield-btn::after{content:"";position:absolute;inset:3px;clip-path:polygon(0 0,100% 0,100% 61%,50% 97%,0 61%);border:0;background:linear-gradient(160deg,rgba(255,255,255,.55),transparent 40%);pointer-events:none}
.shield-btn:hover{transform:translateY(-3px) scale(1.05);filter:drop-shadow(0 8px 18px rgba(255,200,110,.6))}
.shield-btn.big{height:64px;min-width:120px;font-size:14px;padding:0 22px 10px}
.shield-btn.big svg{width:22px;height:22px}

.burger{display:none;width:44px;height:44px;border-radius:50%;background:var(--ink);position:relative;z-index:102}
.burger i{position:absolute;left:12px;right:12px;height:2px;background:var(--gold-hi);transition:transform .3s,opacity .3s}
.burger i:nth-child(1){top:15px}.burger i:nth-child(2){top:21px}.burger i:nth-child(3){top:27px}
.burger[aria-expanded="true"] i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] i:nth-child(2){opacity:0}
.burger[aria-expanded="true"] i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.drawer{position:fixed;inset:0;z-index:99;background:#141919;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}
.drawer a{font-family:var(--f-goth);font-weight:700;font-size:44px;color:var(--cream);padding:4px 20px}
.drawer a:hover{color:var(--gold-hi)}
body.menu-open .drawer{opacity:1;visibility:visible}
body.menu-open .site-header{background:transparent;box-shadow:none}
body.menu-open .brand-name{color:var(--cream)}

/* ---------- SECTION HEAD ---------- */
section{position:relative}
.sec-head{display:flex;flex-direction:column;align-items:center;text-align:center;margin:0 auto clamp(36px,6vw,70px);position:relative;z-index:2}
.sec-num{font-family:var(--f-head);font-size:14px;letter-spacing:.3em;color:var(--gold-deep);display:flex;align-items:center;gap:14px}
.sec-num::before,.sec-num::after{content:"";width:46px;height:1px;background:linear-gradient(90deg,transparent,var(--gold-deep))}
.sec-num::after{transform:scaleX(-1)}
.sec-head h2{margin:.1em 0 0;font-family:var(--f-goth);font-weight:900;font-size:clamp(54px,9vw,120px);line-height:.9;color:var(--ink);text-shadow:0 0 40px rgba(255,236,190,.8)}
.sec-head.light h2{color:var(--cream);text-shadow:0 0 30px rgba(255,210,130,.45)}
.sec-head.light .sec-num{color:var(--gold)}
.sec-head.light .sec-num::before,.sec-head.light .sec-num::after{background:linear-gradient(90deg,transparent,var(--gold))}

/* ---------- HERO ---------- */
.hero{height:100vh;height:100svh;min-height:640px;overflow:hidden;position:relative;background:#b4bbc5;isolation:isolate}
.hero-bg{position:absolute;inset:-6%;background:url(../img/moor-wide.webp) center 60%/cover;z-index:-3}
.hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(236,234,230,.35),rgba(236,234,230,0) 45%,rgba(20,25,25,.15))}
.hero-rays{position:absolute;left:50%;top:48%;width:170vmax;height:170vmax;margin:-85vmax 0 0 -85vmax;z-index:-2;opacity:.5;mix-blend-mode:soft-light;
  background:repeating-conic-gradient(from 0deg,rgba(255,240,200,.0) 0deg,rgba(255,240,200,.9) 4deg,rgba(255,240,200,0) 9deg,rgba(255,240,200,0) 18deg);
  -webkit-mask:radial-gradient(circle,#000 0,rgba(0,0,0,.6) 20%,transparent 55%);mask:radial-gradient(circle,#000 0,rgba(0,0,0,.6) 20%,transparent 55%);
  animation:rays 90s linear infinite}
@keyframes rays{to{rotate:360deg}}
.hero-title{position:absolute;left:0;right:0;top:clamp(90px,14vh,150px);margin:0;z-index:-1;display:flex;justify-content:center;gap:.28em;font-family:var(--f-goth);font-weight:900;font-size:clamp(88px,17vw,310px);line-height:.85;color:var(--ink);letter-spacing:-.01em;pointer-events:none;
  text-shadow:0 0 60px rgba(255,255,250,.9)}
.hero-title span{display:inline-block;background:linear-gradient(180deg,#1a1f21 0%,#23292b 55%,#3a4130 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 24px rgba(250,250,245,.45))}
.hero-stage{position:absolute;left:50%;bottom:0;width:min(92vh,100vw);width:min(92svh,100vw);aspect-ratio:1;translate:-50% 0;z-index:1;transform-style:preserve-3d;will-change:transform}
.hero-dog{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 20px 30px rgba(28,33,36,.3))}
.hero-halo{position:absolute;left:50%;top:45%;width:70%;aspect-ratio:1;translate:-50% -50%;border-radius:50%;background:radial-gradient(circle,rgba(255,253,246,.75),rgba(240,240,236,.3) 45%,transparent 70%);filter:blur(14px);animation:halo 4s ease-in-out infinite;z-index:-1}
@keyframes halo{50%{scale:1.12;opacity:.75}}
.hero-plaque{position:absolute;right:8%;top:30%;transform:translateZ(60px) rotate(6deg);padding:10px 18px;border-radius:8px;background:linear-gradient(150deg,#fff3cf,var(--gold) 50%,var(--gold-mid));color:var(--ink);font-family:var(--f-mono);font-weight:700;font-size:clamp(14px,1.6vw,22px);letter-spacing:.12em;box-shadow:0 12px 30px rgba(83,61,41,.35),inset 0 1px 0 rgba(255,255,255,.7);animation:bob 5s ease-in-out infinite}
.hero-plaque .bow{position:absolute;top:-14px;right:-12px;width:34px;height:22px;color:var(--rose);filter:drop-shadow(0 2px 3px rgba(0,0,0,.25))}
@keyframes bob{50%{translate:0 -10px}}
.fog{position:absolute;left:-20%;right:-20%;pointer-events:none;z-index:2}
.fog-1{bottom:-6%;height:42%;background:radial-gradient(ellipse 40% 60% at 20% 70%,rgba(236,234,230,.9),transparent 70%),radial-gradient(ellipse 45% 55% at 70% 80%,rgba(220,214,212,.85),transparent 70%),radial-gradient(ellipse 30% 50% at 50% 100%,rgba(240,236,230,.9),transparent 70%);filter:blur(8px);animation:drift 26s ease-in-out infinite alternate}
.fog-2{bottom:-2%;height:30%;background:radial-gradient(ellipse 35% 60% at 80% 60%,rgba(245,240,235,.8),transparent 70%),radial-gradient(ellipse 40% 60% at 30% 90%,rgba(230,225,222,.85),transparent 70%);filter:blur(14px);animation:drift 34s ease-in-out infinite alternate-reverse}
@keyframes drift{to{transform:translateX(8%)}}
.hero-actions{position:absolute;left:0;right:0;bottom:clamp(26px,6vh,56px);z-index:5;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:14px;padding:0 16px}
.scroll-cue{position:absolute;right:clamp(16px,4vw,48px);bottom:28px;z-index:5;width:26px;height:44px;border:2px solid rgba(28,33,36,.5);border-radius:14px}
.scroll-cue span{position:absolute;left:50%;top:8px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--ink);animation:cue 1.6s infinite}
@keyframes cue{60%{transform:translateY(14px);opacity:0}}

/* ---------- BUTTONS ---------- */
.blade-btn{position:relative;display:inline-flex;align-items:center;gap:12px;height:66px;padding:0 44px;font-family:var(--f-head);font-size:clamp(17px,1.5vw,21px);letter-spacing:.05em;color:var(--ink);overflow:hidden;
  background:linear-gradient(180deg,#fff7dc 0%,var(--gold-hi) 18%,var(--gold) 55%,var(--gold-mid) 80%,#f0cf8e 100%);
  clip-path:polygon(22px 0,calc(100% - 22px) 0,100% 50%,calc(100% - 22px) 100%,22px 100%,0 50%);
  filter:drop-shadow(0 10px 22px rgba(141,106,54,.45));transition:transform .35s var(--ease),filter .35s}
.blade-btn::before{content:"";position:absolute;inset:4px;clip-path:polygon(19px 0,calc(100% - 19px) 0,100% 50%,calc(100% - 19px) 100%,19px 100%,0 50%);border:1px solid rgba(83,61,41,.35);background:linear-gradient(180deg,rgba(255,255,255,.35),transparent 50%);pointer-events:none}
.blade-btn svg{width:22px;height:22px;position:relative}
.blade-btn .bb-text{position:relative;font-weight:400}
.bb-shine{position:absolute;top:0;bottom:0;left:-40%;width:30%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.9),transparent);transform:skewX(-20deg);animation:shine 3.2s ease-in-out infinite}
@keyframes shine{0%,55%{left:-40%}100%{left:130%}}
.blade-btn:hover{transform:translateY(-3px) scale(1.03);filter:drop-shadow(0 14px 30px rgba(255,200,110,.75))}
.blade-btn:active{transform:scale(.98)}

.ghost-btn{display:inline-flex;align-items:center;gap:10px;height:56px;padding:0 24px;border-radius:40px;font-family:var(--f-head);font-size:17px;letter-spacing:.04em;color:var(--ink);background:rgba(255,255,255,.55);border:1.5px solid rgba(28,33,36,.35);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:transform .3s var(--ease),background .3s,border-color .3s}
.ghost-btn svg{width:20px;height:20px}
.ghost-btn:hover{transform:translateY(-3px);background:#fff;border-color:var(--gold-deep)}
.ghost-btn.light{color:var(--cream);background:rgba(255,255,255,.06);border-color:rgba(228,186,117,.55)}
.ghost-btn.light:hover{background:rgba(228,186,117,.15);color:var(--gold-hi)}

/* CA plaque — engraved steel */
.ca-plaque{position:relative;display:flex;align-items:center;gap:12px;height:62px;padding:0 8px 0 22px;border-radius:12px;max-width:100%;
  background:linear-gradient(160deg,#3a4340 0%,#232a2a 50%,#171c1c 100%);border:1px solid rgba(228,186,117,.5);
  box-shadow:0 12px 30px rgba(20,25,25,.35),inset 0 1px 0 rgba(255,255,255,.15),inset 0 -2px 0 rgba(0,0,0,.3)}
.rivet{position:absolute;width:6px;height:6px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff3cf,var(--gold-deep));top:50%;margin-top:-3px}
.rivet.r1{left:7px}.rivet.r2{right:-12px;display:none}
.ca-label{font-family:var(--f-mono);font-weight:700;font-size:12px;letter-spacing:.14em;color:var(--ink);background:var(--gold);padding:4px 8px;border-radius:4px}
.ca-value{font-family:var(--f-mono);font-weight:500;font-size:14px;color:var(--fog);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;max-width:34ch}
.ca-copy{display:inline-flex;align-items:center;gap:7px;height:46px;padding:0 16px;border-radius:9px;font-family:var(--f-mono);font-weight:700;font-size:13px;letter-spacing:.06em;color:var(--ink);
  background:linear-gradient(180deg,#fff2c8,var(--gold) 60%,var(--gold-mid));box-shadow:inset 0 1px 0 rgba(255,255,255,.7);transition:transform .25s,filter .25s;flex:none}
.ca-copy svg{width:16px;height:16px}
.ca-copy .ic-ok{display:none}
.ca-copy.ok .ic-ok{display:block}.ca-copy.ok .ic-copy{display:none}
.ca-copy:hover{transform:translateY(-2px);filter:brightness(1.07)}

/* ---------- RIBBON ---------- */
.ribbon{position:relative;z-index:6;margin-top:-28px;transform:rotate(-2deg);background:linear-gradient(180deg,var(--gold-hi),var(--gold) 50%,var(--gold-mid));border-top:2px solid var(--bronze);border-bottom:2px solid var(--bronze);overflow:hidden;padding:12px 0;box-shadow:0 12px 30px rgba(20,25,25,.25)}
.ribbon-track{display:flex;width:max-content;gap:40px;animation:marq 32s linear infinite;font-family:var(--f-goth);font-weight:900;font-size:34px;line-height:1;color:var(--ink);white-space:nowrap}
.ribbon-track span{display:inline-flex;align-items:center;gap:40px}
.ribbon-track svg{width:18px;height:18px;color:var(--rose-deep)}
.ribbon-track .tk{font-family:var(--f-mono);font-size:20px;font-weight:700;letter-spacing:.1em}
@keyframes marq{to{transform:translateX(-50%)}}

/* ---------- LORE ---------- */
.lore{padding:clamp(110px,14vw,180px) clamp(16px,5vw,64px) clamp(90px,10vw,140px);background:linear-gradient(180deg,rgba(236,234,230,.2),rgba(201,204,207,.6)),url(../img/bg-dawn.webp) center/cover fixed;overflow:hidden}
.lore-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1.05fr 1fr .7fr;gap:clamp(24px,4vw,56px);align-items:center}
.arch{margin:0;position:relative;border-radius:999px 999px 18px 18px;overflow:hidden;aspect-ratio:3/4;border:3px solid var(--gold);box-shadow:0 0 0 8px rgba(255,255,255,.35),0 30px 60px rgba(28,33,36,.3);transform-style:preserve-3d}
.arch img{width:100%;height:100%;object-fit:cover;transform:scale(1.08)}
.arch::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(20,25,25,.55),transparent 40%);pointer-events:none}
.arch figcaption{position:absolute;left:0;right:0;bottom:18px;text-align:center;z-index:2;font-family:var(--f-mono);font-weight:700;letter-spacing:.2em;color:var(--gold-hi)}
.arch-sm{aspect-ratio:2/3;margin-top:22%}
.lore-lines p{margin:0 0 18px;font-family:var(--f-head);font-size:clamp(20px,2vw,26px);line-height:1.35;color:var(--ink-2)}
.lore-lines p.big{font-family:var(--f-goth);font-weight:900;font-size:clamp(40px,4.6vw,64px);line-height:.95;color:var(--ink);margin-top:28px}
.lore-lines em{font-style:normal;background:linear-gradient(180deg,var(--rose),var(--rose-deep));-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- RELIC (3D coin) ---------- */
.relic{height:220vh;background:linear-gradient(180deg,rgba(201,204,207,.6),rgba(163,171,184,.6)),url(../img/bg-mist.webp) center/cover;}
.relic-sticky{position:sticky;top:0;height:100vh;height:100svh;display:flex;align-items:center;justify-content:center;overflow:hidden;perspective:1400px}
.coin3d{position:relative;width:min(56vh,70vw);aspect-ratio:1;transform-style:preserve-3d;will-change:transform;z-index:2}
.coin-face{position:absolute;inset:0;width:100%;height:100%;backface-visibility:hidden;-webkit-backface-visibility:hidden;filter:drop-shadow(0 30px 40px rgba(28,33,36,.35))}
.coin-face.front{transform:translateZ(9px)}
.coin-face.back{transform:rotateY(180deg) translateZ(9px)}
.coin-edge{position:absolute;inset:1.2%;border-radius:50%;background:linear-gradient(90deg,#6b4a1c,#e4ba75,#6b4a1c);transform:translateZ(0)}
.relic-word{position:absolute;top:50%;font-family:var(--f-goth);font-weight:900;font-size:clamp(56px,7.5vw,150px);line-height:1;color:rgba(28,33,36,.92);translate:0 -50%;white-space:nowrap;z-index:1;text-shadow:0 0 50px rgba(255,236,190,.7)}
.rw-l{right:calc(50% + min(28vh,35vw) - 2vw)}.rw-r{left:calc(50% + min(28vh,35vw) - 2vw)}
.relic-tag{position:absolute;bottom:9vh;left:50%;translate:-50% 0;font-family:var(--f-mono);font-weight:700;letter-spacing:.3em;font-size:13px;color:var(--ink);background:rgba(255,255,255,.55);padding:10px 18px;border-radius:40px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);white-space:nowrap}

/* ---------- HOW TO BUY ---------- */
.buy{padding:clamp(90px,10vw,150px) clamp(16px,5vw,64px);background:linear-gradient(180deg,#a3abb8,#c9cccf 55%,#e6e5e1)}
.rite-grid{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:22px;perspective:1200px}
.rite{position:relative;padding:34px 24px 60px;text-align:center;color:var(--fog);
  background:linear-gradient(170deg,#3a4340,#232a2a 55%,#141919);
  clip-path:polygon(0 0,100% 0,100% 72%,50% 100%,0 72%);
  transform-style:preserve-3d;transition:transform .4s var(--ease)}
.rite::before{content:"";position:absolute;inset:6px;clip-path:polygon(0 0,100% 0,100% 71.5%,50% 99%,0 71.5%);border-top:1px solid rgba(228,186,117,.6);background:linear-gradient(170deg,rgba(228,186,117,.14),transparent 40%);pointer-events:none}
.rite-num{display:grid;place-items:center;width:64px;height:64px;margin:0 auto 16px;border-radius:50%;font-family:var(--f-head);font-size:24px;color:var(--ink);background:radial-gradient(circle at 35% 30%,#fff4d0,var(--gold) 55%,var(--gold-deep));box-shadow:0 0 30px rgba(255,210,130,.35)}
.rite h3{margin:0 0 6px;font-family:var(--f-head);font-weight:400;font-size:22px;color:var(--cream)}
.rite p{margin:0;font-size:15px;color:rgba(236,234,230,.72)}
.buy-actions{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:16px;margin-top:56px}

/* ---------- CHART ---------- */
.chart{padding:clamp(90px,10vw,150px) clamp(16px,5vw,64px);background:var(--night);overflow:hidden;isolation:isolate}
.chart-bg{position:absolute;inset:-10% 0;background:url(../img/bg-dusk.webp) center/cover;z-index:-1;opacity:.95}
.chart::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 0%,transparent,rgba(20,25,25,.6) 80%)}
.chart-frame{position:relative;max-width:1150px;margin:0 auto;padding:14px;border-radius:16px;background:linear-gradient(160deg,rgba(228,186,117,.35),rgba(228,186,117,.06));box-shadow:0 40px 80px rgba(0,0,0,.45)}
.corner{position:absolute;width:44px;height:44px;border:3px solid var(--gold);z-index:2}
.c1{top:-8px;left:-8px;border-right:0;border-bottom:0;border-radius:12px 0 0 0}
.c2{top:-8px;right:-8px;border-left:0;border-bottom:0;border-radius:0 12px 0 0}
.c3{bottom:-8px;left:-8px;border-right:0;border-top:0;border-radius:0 0 0 12px}
.c4{bottom:-8px;right:-8px;border-left:0;border-top:0;border-radius:0 0 12px 0}
.chart-inner{position:relative;height:clamp(420px,62vh,640px);border-radius:10px;overflow:hidden;background:#101413}
.chart-inner iframe{width:100%;height:100%;border:0;display:block}
.chart-wait{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;background:radial-gradient(circle at 50% 45%,rgba(228,186,117,.14),transparent 60%)}
.chart-wait img{width:140px;animation:spin 6s linear infinite;filter:drop-shadow(0 0 30px rgba(255,210,130,.4))}
.chart-wait p{margin:0;font-family:var(--f-head);font-size:20px;color:var(--fog);letter-spacing:.06em}
.chart-actions{display:flex;justify-content:center;margin-top:34px}

/* ---------- ROADMAP ---------- */
.roadmap{padding:clamp(90px,10vw,150px) clamp(16px,5vw,64px) clamp(110px,12vw,170px);background:linear-gradient(180deg,rgba(236,234,230,.55),rgba(236,234,230,.25) 60%,rgba(20,25,25,.2)),url(../img/moor-wide.webp) center/cover fixed;overflow:hidden}
.path{position:relative;max-width:1100px;margin:0 auto;display:flex;flex-direction:column;gap:clamp(30px,5vw,60px)}
.path-line{position:absolute;left:50%;top:0;bottom:0;width:6px;margin-left:-3px;border-radius:6px;background:rgba(28,33,36,.14);overflow:hidden}
.path-glow{position:absolute;left:0;right:0;top:0;height:0;background:linear-gradient(#fff9e6,var(--gold-hi),var(--gold));box-shadow:var(--glow)}
.phase{position:relative;display:flex;width:50%;perspective:1000px}
.phase[data-side="l"]{padding-right:60px;justify-content:flex-end}
.phase[data-side="r"]{margin-left:50%;padding-left:60px}
.phase-dot{position:absolute;top:34px;width:26px;height:26px;border-radius:50%;background:var(--fog);border:3px solid var(--gold-deep);z-index:2;transition:background .4s,box-shadow .4s}
.phase[data-side="l"] .phase-dot{right:-13px}
.phase[data-side="r"] .phase-dot{left:-13px}
.phase.lit .phase-dot{background:var(--rose);border-color:var(--rose-deep);box-shadow:0 0 0 6px rgba(241,167,184,.35),var(--glow)}
.phase-card{position:relative;width:100%;max-width:440px;padding:30px 30px 26px;border-radius:18px;background:rgba(247,238,215,.82);border:1px solid rgba(141,106,54,.35);box-shadow:0 24px 50px rgba(28,33,36,.18);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transform-style:preserve-3d}
.phase-rank{font-family:var(--f-mono);font-weight:700;font-size:12px;letter-spacing:.2em;color:var(--rose-deep)}
.phase-card h3{margin:4px 0 12px;font-family:var(--f-goth);font-weight:900;font-size:clamp(44px,5vw,62px);line-height:.9;color:var(--ink)}
.phase-card ul{margin:0;padding:0;list-style:none}
.phase-card li{position:relative;padding:5px 0 5px 24px;font-size:16px;color:var(--ink-2)}
.phase-card li::before{content:"";position:absolute;left:2px;top:13px;width:9px;height:9px;background:var(--gold-mid);transform:rotate(45deg)}

/* ---------- RALLY ---------- */
.rally{padding:clamp(90px,10vw,150px) clamp(16px,5vw,64px);background:var(--night);overflow:hidden;isolation:isolate}
.rally-bg{position:absolute;inset:-10% 0;z-index:-1;background:linear-gradient(180deg,rgba(20,25,25,.35),rgba(20,25,25,.85)),url(../img/crop-dusk.webp) center 30%/cover}
.rally .sec-head h2{color:var(--cream);text-shadow:0 0 30px rgba(255,210,130,.45)}
.rally .sec-num{color:var(--gold)}
.rally-grid{max-width:1150px;margin:0 auto;display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.rally-btn{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:150px;padding:22px 12px;border-radius:18px;text-align:center;overflow:hidden;
  background:linear-gradient(170deg,rgba(56,64,61,.85),rgba(20,25,25,.9));border:1.5px solid rgba(228,186,117,.45);color:var(--cream);
  transition:transform .35s var(--ease),border-color .35s,box-shadow .35s}
.rally-btn::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 0%,rgba(255,214,140,.35),transparent 60%);opacity:0;transition:opacity .35s}
.rally-btn svg{width:34px;height:34px;color:var(--gold)}
.rally-btn b{font-family:var(--f-goth);font-weight:900;font-size:34px;line-height:.9}
.rally-btn small{font-family:var(--f-mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:rgba(236,234,230,.6)}
.rally-btn:hover{transform:translateY(-6px);border-color:var(--gold-hi);box-shadow:0 18px 40px rgba(0,0,0,.4),0 0 30px rgba(255,210,130,.25)}
.rally-btn:hover::before{opacity:1}
.rally-btn.gold{background:linear-gradient(170deg,#fff4d0,var(--gold) 45%,var(--gold-mid));color:var(--ink);border-color:var(--bronze)}
.rally-btn.gold svg{color:var(--bronze)}
.rally-btn.gold small{color:rgba(28,33,36,.65)}

/* ---------- FOOTER ---------- */
.site-footer{background:#0f1311;color:var(--fog);padding:60px clamp(16px,5vw,64px) 40px;display:flex;flex-direction:column;align-items:center;gap:28px;text-align:center;border-top:2px solid var(--gold-deep)}
.foot-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:28px}
.site-footer .brand-name{color:var(--cream)}
.site-footer .brand-tick{background:var(--gold);color:var(--ink)}
.foot-social{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.disclaimer{max-width:560px;margin:0;font-size:13px;color:rgba(236,234,230,.5)}
.copy{margin:0;font-family:var(--f-mono);font-size:12px;color:rgba(236,234,230,.4)}

/* ---------- TOAST ---------- */
.toast{position:fixed;left:50%;bottom:28px;z-index:200;translate:-50% 30px;opacity:0;pointer-events:none;padding:12px 20px;border-radius:40px;background:var(--ink);color:var(--gold-hi);font-family:var(--f-mono);font-size:13px;font-weight:700;letter-spacing:.06em;border:1px solid var(--gold-deep);box-shadow:0 12px 30px rgba(0,0,0,.35);transition:opacity .3s,translate .3s var(--ease);white-space:nowrap}
.toast.show{opacity:1;translate:-50% 0}

/* ---------- REVEAL ---------- */
.reveal{opacity:0;transform:translateY(50px) rotateX(18deg);transform-origin:50% 100%;transition:opacity 1s var(--ease),transform 1.1s var(--ease)}
.reveal.in{opacity:1;transform:none}
.rite.reveal.in,.phase-card.in{transform:none}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1100px){
  .rally-grid{grid-template-columns:repeat(4,1fr)}
  .lore-grid{grid-template-columns:1fr 1fr}
  .arch-sm{display:none}
}
@media (max-width:900px){
  .nav-links{display:none}
  .burger{display:inline-block}
  .rite-grid{grid-template-columns:repeat(2,1fr)}
  .rally-grid{grid-template-columns:repeat(3,1fr)}
  .blade-progress{display:none}
  .lore,.roadmap{background-attachment:scroll}
}
@media (max-width:700px){
  body{font-size:16px}
  .brand-name{font-size:24px}
  .brand-tick{display:none}
  .head-social .shield-btn span{display:none}
  .shield-btn{min-width:46px;padding:0 12px 6px}
  .hero{height:auto;min-height:100svh;display:flex;flex-direction:column;align-items:center;padding:84px 0 64px}
  .hero-title{position:relative;top:auto;flex-direction:column;align-items:center;gap:0;font-size:clamp(84px,27vw,140px)}
  .hero-title .ht-b{margin-top:-.08em}
  .hero-stage{position:relative;left:auto;bottom:auto;translate:none;width:118vw;flex:none;margin-top:-16vw}
  .hero-plaque{right:14%;top:44%}
  .hero-actions{position:relative;bottom:auto;gap:10px;margin-top:-20vw}
  .fog-1{bottom:18%}
  .hero-actions .ca-plaque{order:3}
  .blade-btn{height:60px;padding:0 36px}
  .ghost-btn{height:52px;padding:0 18px;font-size:15px}
  .ca-plaque{width:100%;height:58px;padding-left:18px}
  .ca-value{flex:1;font-size:13px}
  .ca-copy span{display:none}
  .ca-copy{padding:0 14px}
  .scroll-cue{display:none}
  .ribbon-track{font-size:26px}
  .lore-grid{grid-template-columns:1fr}
  .arch{max-width:360px;margin:0 auto;width:100%}
  .lore-lines{text-align:center}
  .relic{height:180vh}
  .coin3d{width:72vw}
  .relic-word{font-size:21vw;top:20%;left:0!important;right:0!important;text-align:center}
  .rw-r{top:80%}
  .rite-grid{grid-template-columns:1fr 1fr;gap:12px}
  .rite{padding:26px 14px 52px}
  .rite h3{font-size:18px}
  .rite p{font-size:13px}
  .rite-num{width:52px;height:52px;font-size:20px}
  .path-line{left:18px}
  .phase,.phase[data-side="r"]{width:100%;margin-left:0;padding:0 0 0 52px;justify-content:flex-start}
  .phase[data-side="l"] .phase-dot,.phase[data-side="r"] .phase-dot{left:5px;right:auto}
  .phase-card{padding:24px 22px}
  .rally-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .rally-btn{min-height:124px}
  .rally-btn b{font-size:28px}
  .shield-btn.big{min-width:96px;padding:0 16px 10px}
  .chart-inner{height:480px}
}
@media (max-width:380px){
  .hero-actions .ghost-btn span{display:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .reveal{opacity:1;transform:none}
}
