body{margin:0;background:#0A0916;}
html{scroll-behavior:smooth;}
.feat-bg{position:absolute;inset:0;background-image:url(../assets/throne-battle.webp);background-size:cover;background-position:50% 50%;background-repeat:no-repeat;}
.store-btn{transition:transform 0.25s,border-color 0.25s;}
.store-btn:hover{transform:translateY(-3px);border-color:#F0D5A6;}
.btn-primary{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 30px;background:#D8B47A;color:#14102A;font:500 14px/1 'Jost',system-ui,sans-serif;letter-spacing:0.12em;text-transform:uppercase;text-decoration:none;border-radius:3px;transition:background 0.25s,transform 0.25s;}
.btn-primary:hover{background:#F0D5A6;transform:translateY(-2px);}
.nav-link{color:#F2EBDD;text-decoration:none;font:400 15px/1 'Jost',system-ui,sans-serif;letter-spacing:0.06em;padding:12px 0;transition:color 0.2s;}
.nav-link:hover{color:#F0D5A6;}
.text-link{color:#F2EBDD;font:500 14px/1 'Jost',system-ui,sans-serif;letter-spacing:0.12em;text-transform:uppercase;text-decoration:none;padding:16px 0;border-bottom:1px solid rgba(216,180,122,0.55);transition:color 0.2s,border-color 0.2s;}
.text-link:hover{color:#F0D5A6;border-color:#F0D5A6;}
.card{transition:transform 0.3s;}
.card:hover{transform:translateY(-4px);}
.card:hover .crop{border-color:rgba(240,213,166,0.7);}
a:focus-visible{outline:2px solid #F0D5A6;outline-offset:4px;}

.icon-panel{position:relative;overflow:visible;transition:border-color 0.3s;}
.card[data-g="sir-dash"]{--glow:80,220,120;}
.card[data-g="sir-bram"]{--glow:90,170,255;}
.card[data-g="rowan"]{--glow:255,90,80;}
.card[data-g="kai"]{--glow:110,255,90;}
.card[data-g="mira"]{--glow:190,110,255;}

.icon-panel::before{content:"";position:absolute;left:50%;bottom:0;width:240px;height:240px;transform:translate(-50%,10%) scale(.6);border-radius:50%;background:radial-gradient(circle, rgba(var(--glow,240,213,166),.55) 0%, rgba(var(--glow,240,213,166),.18) 45%, rgba(var(--glow,240,213,166),0) 70%);opacity:0;pointer-events:none;z-index:3;transition:opacity .35s, transform .45s;}
.card:hover .icon-panel::before,.card:focus-within .icon-panel::before{opacity:1;transform:translate(-50%,-6%) scale(1);animation:heroGlowBg 1.8s ease-in-out infinite .4s;}
.card:hover .hero-pop,.card:focus-within .hero-pop{animation:heroGlow 1.8s ease-in-out infinite .4s;}
.card:hover .icon-panel,.card:focus-within .icon-panel{border-color:rgba(var(--glow,240,213,166),.8);box-shadow:0 0 22px rgba(var(--glow,240,213,166),.35);}
@keyframes heroGlow{0%,100%{filter:drop-shadow(0 8px 14px rgba(0,0,0,.6)) drop-shadow(0 0 8px rgba(var(--glow),.55));}50%{filter:drop-shadow(0 8px 14px rgba(0,0,0,.6)) drop-shadow(0 0 22px rgba(var(--glow),.95)) drop-shadow(0 0 40px rgba(var(--glow),.5));}}
@keyframes heroGlowBg{0%,100%{opacity:.7;}50%{opacity:1;}}
@media (max-width:1100px),(hover:none){.icon-panel::before{opacity:.8;transform:translate(-50%,0) scale(1);animation:heroGlowBg 2.4s ease-in-out infinite;}.hero-pop{animation:heroGlow 2.4s ease-in-out infinite;}}
@media (prefers-reduced-motion:reduce){.card:hover .hero-pop,.card:focus-within .hero-pop,.card:hover .icon-panel::before,.icon-panel::before,.hero-pop{animation:none !important;}}
.icon-panel{aspect-ratio:1054 / 1082 !important;background:url(../assets/icon-frame.png) center/100% 100% no-repeat !important;border:0 !important;border-radius:0 !important;box-shadow:none !important;box-sizing:border-box;padding:23.4% 8.4% 10.1% !important;image-rendering:pixelated;transition:filter .3s;}
.card:hover .icon-panel,.card:focus-within .icon-panel{border:0 !important;box-shadow:none !important;filter:drop-shadow(0 0 10px rgba(var(--glow,240,213,166),.55));}
.icon-panel::before{bottom:6%;}
.icon-panel .icon-img{width:84px !important;height:84px !important;}
@media (max-width:1100px),(hover:none){.hero-pop{left:50%;bottom:10.1%;width:83%;height:67%;}}
.feat-card{transition:transform .3s, border-color .3s, box-shadow .3s;}
.feat-card:hover{transform:translateY(-4px);border-color:rgba(240,213,166,.7) !important;box-shadow:0 0 22px rgba(216,180,122,.2);}
@media (max-width:1100px){.feat-row{grid-template-columns:repeat(2, minmax(0,1fr)) !important;}}
@media (max-width:640px){.feat-row{grid-template-columns:1fr !important;}}
.j-frame{position:relative;overflow:hidden;width:min(100%, 1000px);height:calc(min(100vh, 820px) - 230px);margin:0 auto;border:1px solid rgba(216,180,122,0.45);border-radius:4px;box-shadow:0 0 40px rgba(0,0,0,0.55);background:linear-gradient(180deg,#1d1436 0%,#150f2b 55%,#0d0b1a 100%);}
.j-lay{position:absolute;left:0;top:0;will-change:transform;pointer-events:none;}
.j-lay > img{display:block;width:100%;height:100%;image-rendering:pixelated;user-select:none;}
.j-pin{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:4px;pointer-events:none;}
.j-pin b{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;background:#F0D5A6;color:#1a1530;font:700 17px/1 'Jost', system-ui, sans-serif;box-shadow:0 0 0 3px rgba(26,21,48,.85),0 0 16px rgba(240,213,166,.55);}
.j-pin span{padding:4px 10px;background:rgba(14,11,30,.88);border:1px solid rgba(216,180,122,.6);border-radius:3px;color:#F2EBDD;font:500 13px/1.2 'Jost', system-ui, sans-serif;white-space:nowrap;}
.j-cap{position:absolute;left:14px;bottom:14px;display:flex;align-items:center;gap:10px;padding:8px 14px 8px 8px;background:rgba(14,11,30,0.82);border:1px solid rgba(216,180,122,0.5);border-radius:30px;color:#F2EBDD;font:500 15px/1 'Jost', system-ui, sans-serif;opacity:0;transition:opacity .3s;pointer-events:none;z-index:5;}
.j-cap.on{opacity:1;}
.j-num{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:#F0D5A6;color:#1a1530;font:700 14px/1 'Jost', system-ui, sans-serif;}
.j-dots{display:flex;gap:8px;}
.j-dots i{display:block;width:10px;height:10px;border-radius:50%;background:rgba(216,180,122,0.25);border:1px solid rgba(216,180,122,0.5);transition:background .3s, transform .3s, box-shadow .3s;}
.j-dots i.on{background:#F0D5A6;transform:scale(1.3);box-shadow:0 0 10px rgba(240,213,166,.8);}
@media (max-width:640px){.j-frame{width:100% !important;height:auto !important;aspect-ratio:3 / 4 !important;}.j-pin span{font-size:11px;}.j-pin b{width:28px;height:28px;font-size:14px;}}
.j-frame-old{position:relative;overflow:hidden;width:min(100%, calc((min(100vh, 820px) - 230px) * 2.339));aspect-ratio:1918 / 820;margin:0 auto;border:1px solid rgba(216,180,122,0.45);border-radius:4px;box-shadow:0 0 40px rgba(0,0,0,0.55);background:#0A0916;}
.j-map{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform;}
.j-far{-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 40%,transparent 50%);mask-image:linear-gradient(180deg,#000 0%,#000 40%,transparent 50%);}
.j-near{-webkit-mask-image:linear-gradient(180deg,transparent 58%,#000 62%,#000 100%);mask-image:linear-gradient(180deg,transparent 58%,#000 62%,#000 100%);}
.j-mist{position:absolute;left:0;top:0;width:200%;height:100%;pointer-events:none;mix-blend-mode:screen;opacity:.32;background:radial-gradient(ellipse 14% 22% at 8% 30%,rgba(255,255,255,.55),transparent 70%),radial-gradient(ellipse 18% 20% at 30% 62%,rgba(210,200,255,.5),transparent 70%),radial-gradient(ellipse 12% 18% at 52% 24%,rgba(255,255,255,.5),transparent 70%),radial-gradient(ellipse 16% 24% at 74% 70%,rgba(255,190,190,.45),transparent 70%),radial-gradient(ellipse 12% 20% at 92% 40%,rgba(255,255,255,.5),transparent 70%);animation:jMist 70s linear infinite;}
.j-mist.m2{top:18%;opacity:.22;animation-duration:110s;animation-direction:reverse;filter:blur(6px);}
@keyframes jMist{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){.j-mist{animation:none;}}
.j-map img{display:block;width:100%;height:100%;user-select:none;}
.j-cap{position:absolute;left:14px;bottom:14px;display:flex;align-items:center;gap:10px;padding:8px 14px 8px 8px;background:rgba(14,11,30,0.82);border:1px solid rgba(216,180,122,0.5);border-radius:30px;color:#F2EBDD;font:500 15px/1 'Jost', system-ui, sans-serif;opacity:0;transition:opacity .3s;pointer-events:none;}
.j-cap.on{opacity:1;}
.j-num{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:#F0D5A6;color:#1a1530;font:700 14px/1 'Jost', system-ui, sans-serif;}
.j-dots{display:flex;gap:8px;}
.j-dots i{display:block;width:10px;height:10px;border-radius:50%;background:rgba(216,180,122,0.25);border:1px solid rgba(216,180,122,0.5);transition:background .3s, transform .3s, box-shadow .3s;}
.j-dots i.on{background:#F0D5A6;transform:scale(1.3);box-shadow:0 0 10px rgba(240,213,166,.8);}
@media (max-width:640px){.j-frame{width:100% !important;aspect-ratio:3 / 4 !important;}}
.icon-img{transition:opacity .25s, transform .25s;}
.hero-pop{position:absolute;left:50%;bottom:-6px;width:260px;height:260px;object-fit:contain;opacity:0;transform:translate(-50%,20px) scale(.85);pointer-events:none;transition:opacity .3s, transform .35s cubic-bezier(.2,.9,.3,1.2);z-index:5;image-rendering:pixelated;filter:drop-shadow(0 8px 14px rgba(0,0,0,.6)) drop-shadow(0 0 10px rgba(240,213,166,.25));}
.card:hover .hero-pop,.card:focus-within .hero-pop{opacity:1;transform:translate(-50%,-8px) scale(1);}
.card:hover .icon-img,.card:focus-within .icon-img{opacity:0;transform:scale(.8);}
.card:hover{z-index:6;position:relative;}
@media (max-width:1100px),(hover:none){.hero-pop{width:100%;height:100%;bottom:0;transform:translate(-50%,0) scale(1);opacity:1;}.icon-img{display:none;}}
.card:hover .icon-panel{border-color:rgba(240,213,166,0.7);}
@media (max-width:1100px){.row5{grid-template-columns:repeat(5, minmax(200px, 1fr)) !important;overflow-x:auto;padding-bottom:12px;}}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto;}.btn-primary,.nav-link,.text-link,.card,.crop{transition:none !important;}.card:hover{transform:none;}}

.shot{margin:0;display:flex;flex-direction:column;gap:14px;min-width:0;}
.shot-frame{position:relative;aspect-ratio:523/743;overflow:hidden;background:#110F26;border:1px solid rgba(216,180,122,0.28);border-radius:4px;transition:border-color .3s,transform .3s;}
.shot-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s cubic-bezier(.2,.7,.2,1);}
.shot:hover .shot-frame{border-color:rgba(240,213,166,0.7);transform:translateY(-4px);}
.shot:hover .shot-frame img{transform:scale(1.05);}
.shots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;}
@media (max-width:1000px){.shots{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:480px){.shots{grid-template-columns:1fr;}}
@media (prefers-reduced-motion: reduce){.shot-frame,.shot-frame img{transition:none !important;}.shot:hover .shot-frame img{transform:none;}}
.misu{position:absolute;left:0;bottom:24%;z-index:2;width:187px;height:143px;background:url(../assets/misu-run.png) 0 0/935px 143px no-repeat;image-rendering:pixelated;pointer-events:none;will-change:transform;filter:drop-shadow(0 4px 6px rgba(0,0,0,0.6));}

@media (max-width:640px){.row5{grid-template-columns:1fr !important;overflow:visible !important;row-gap:36px !important;}.row5 .card{display:block !important;grid-row:auto !important;}.row5 .card > *{margin-bottom:12px;}.row5 .icon-panel{max-width:280px;}}


@media (max-width:640px){.row5{grid-template-columns:1fr !important;overflow:visible !important;row-gap:36px !important;}.row5 .card{display:block !important;grid-row:auto !important;}.row5 .card > *{margin-bottom:12px;}.row5 .icon-panel{max-width:280px;}}
html{-webkit-text-size-adjust:100%;}
img{max-width:100%;}

/* ---- phone header: logo + menu button, links in a dropdown ---- */
.nav-check,.nav-burger{display:none;}
.nav-link{text-shadow:0 1px 10px rgba(0,0,0,0.85);}
@media (max-width:760px){
  nav[aria-label="Primary"]{display:flex !important;flex-wrap:wrap;align-items:center;gap:0 !important;padding:14px 20px !important;}
  nav[aria-label="Primary"] > a:first-child{order:1;}
  nav[aria-label="Primary"] .nav-burger{display:flex;order:2;margin-left:auto;flex-direction:column;justify-content:center;gap:5px;width:46px;height:46px;padding:0 11px;box-sizing:border-box;cursor:pointer;border:1px solid rgba(216,180,122,0.7);border-radius:6px;background:rgba(10,9,22,0.6);}
  nav[aria-label="Primary"] .nav-burger span{display:block;height:2px;background:#F0D5A6;border-radius:2px;transition:transform .25s,opacity .2s;}
  nav[aria-label="Primary"] .nav-check:checked + .nav-burger span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  nav[aria-label="Primary"] .nav-check:checked + .nav-burger span:nth-child(2){opacity:0;}
  nav[aria-label="Primary"] .nav-check:checked + .nav-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
  nav[aria-label="Primary"] > div{display:none !important;order:3;width:100%;flex-direction:column;align-items:stretch !important;gap:0 !important;margin-top:12px;padding:6px 0 14px;background:rgba(10,9,22,0.96);border:1px solid rgba(216,180,122,0.35);border-radius:8px;box-sizing:border-box;}
  nav[aria-label="Primary"] .nav-check:checked ~ div{display:flex !important;}
  nav[aria-label="Primary"] .nav-links{display:flex !important;flex-direction:column;align-items:stretch !important;gap:0 !important;width:100%;}
  nav[aria-label="Primary"] .nav-link{display:block;font-size:18px;padding:15px 20px;text-align:left;border-bottom:1px solid rgba(216,180,122,0.14);}
  nav[aria-label="Primary"] .btn-primary{margin:14px 20px 2px;min-height:48px;font-size:13px;}
}

.j-lay > img.j-glow{position:absolute;left:0;top:0;mix-blend-mode:screen;pointer-events:none;opacity:0;will-change:opacity;}
.j-glow.lA{animation:jLava 3.6s ease-in-out infinite;}
.j-glow.lB{animation:jLava 4.4s ease-in-out -1.9s infinite;}
.j-glow.w0{animation:jFlick0 2.7s linear infinite;}
.j-glow.w1{animation:jFlick1 3.3s linear -1.1s infinite;}
.j-glow.w2{animation:jFlick2 2.1s linear -0.6s infinite;}
@keyframes jLava{0%,100%{opacity:.25}50%{opacity:1}}
@keyframes jFlick0{0%{opacity:.85}6%{opacity:.45}11%{opacity:.95}20%{opacity:.7}28%{opacity:1}37%{opacity:.5}44%{opacity:.9}58%{opacity:.65}66%{opacity:1}79%{opacity:.55}88%{opacity:.9}100%{opacity:.85}}
@keyframes jFlick1{0%{opacity:.6}9%{opacity:1}15%{opacity:.5}27%{opacity:.85}35%{opacity:.4}46%{opacity:.95}57%{opacity:.7}71%{opacity:1}83%{opacity:.5}100%{opacity:.6}}
@keyframes jFlick2{0%{opacity:1}12%{opacity:.55}19%{opacity:.9}31%{opacity:.45}40%{opacity:.8}52%{opacity:1}63%{opacity:.6}77%{opacity:.95}90%{opacity:.5}100%{opacity:1}}
.j-mist{position:absolute;top:0;bottom:0;width:42%;overflow:hidden;pointer-events:none;z-index:3;}
.j-mist.l{left:0;-webkit-mask-image:linear-gradient(90deg,#000 30%,transparent);mask-image:linear-gradient(90deg,#000 30%,transparent)}.j-mist.r{right:0;-webkit-mask-image:linear-gradient(270deg,#000 30%,transparent);mask-image:linear-gradient(270deg,#000 30%,transparent)}
.j-mist i{position:absolute;display:block;width:120%;height:26%;border-radius:50%;mix-blend-mode:screen;will-change:transform,opacity;background:radial-gradient(ellipse at center,rgba(190,180,225,.34) 0%,rgba(150,140,200,.16) 45%,rgba(120,110,180,0) 72%);opacity:0;}
.j-mist.l i{left:-70%;animation:jMistL 14s ease-in-out infinite;}
.j-mist.r i{right:-70%;animation:jMistR 16s ease-in-out infinite;}
.j-mist i:nth-child(1){top:6%;animation-delay:-2s}.j-mist i:nth-child(2){top:30%;animation-delay:-7s;height:22%}.j-mist i:nth-child(3){top:54%;animation-delay:-11s}.j-mist i:nth-child(4){top:76%;animation-delay:-4.5s;height:20%}
@keyframes jMistL{0%{transform:translateX(0);opacity:0}25%{opacity:1}75%{opacity:.8}100%{transform:translateX(75%);opacity:0}}
@keyframes jMistR{0%{transform:translateX(0);opacity:0}25%{opacity:1}75%{opacity:.8}100%{transform:translateX(-75%);opacity:0}}
.j-fx{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:3;}
@media (prefers-reduced-motion:reduce){.j-glow,.j-mist i{animation:none !important}.j-glow{opacity:.7}.j-mist i{opacity:.4}.j-fx{display:none}}
