/* Home art layer: 3D objects in the brand material (same glossy blue/violet as the hero mark)
   replace bare ordinals, anchor the kokiri and closing plates, and the closing plate becomes
   the page's one key-colour surface. Icons are mapped by position (nth-child), so admin-edited
   copy keeps working. Loaded last on the home page, all widths. */

/* ── Ordinals become 3D icons ── */
body.nk-refined[data-page=home] #main-content :is(.svx-num,.prx-num,.crx-num,.cvx-num) {
  display:block!important; width:64px; height:64px; margin:0 0 14px!important; padding:0!important; overflow:hidden; text-indent:-999px; white-space:nowrap;
  font-size:0!important; line-height:0!important; color:transparent!important; float:none!important;
  background:center/contain no-repeat; align-self:start; transition:transform .35s cubic-bezier(.22,.7,.3,1);
}
body.nk-refined[data-page=home] .nk-live-card:hover :is(.svx-num,.prx-num,.crx-num,.cvx-num) { transform:translateY(-5px) rotate(-6deg); }
body.nk-refined[data-page=home] #main-content .svx-cols > li:nth-child(1) .svx-num { background-image:url(/images/3d/coins.webp); }
body.nk-refined[data-page=home] #main-content .svx-cols > li:nth-child(2) .svx-num { background-image:url(/images/3d/links.webp); }
body.nk-refined[data-page=home] #main-content .svx-cols > li:nth-child(3) .svx-num { background-image:url(/images/3d/rocket.webp); }
body.nk-refined[data-page=home] #main-content .prx-step:nth-child(1) .prx-num { background-image:url(/images/3d/plane.webp); }
body.nk-refined[data-page=home] #main-content .prx-step:nth-child(2) .prx-num { background-image:url(/images/3d/rings.webp); }
body.nk-refined[data-page=home] #main-content .prx-step:nth-child(3) .prx-num { background-image:url(/images/3d/prism.webp); }
body.nk-refined[data-page=home] #main-content .prx-step:nth-child(4) .prx-num { background-image:url(/images/3d/hourglass.webp); }
body.nk-refined[data-page=home] #main-content .crx-row:nth-child(1) .crx-num { background-image:url(/images/3d/prism.webp); }
body.nk-refined[data-page=home] #main-content .crx-row:nth-child(2) .crx-num { background-image:url(/images/3d/rocket.webp); }
body.nk-refined[data-page=home] #main-content .crx-row:nth-child(3) .crx-num { background-image:url(/images/3d/rings.webp); }
body.nk-refined[data-page=home] #main-content .cvx-col:nth-child(1) .cvx-num { background-image:url(/images/3d/prism.webp); }
body.nk-refined[data-page=home] #main-content .cvx-col:nth-child(2) .cvx-num { background-image:url(/images/3d/ribbon.webp); }
body.nk-refined[data-page=home] #main-content .cvx-col:nth-child(3) .cvx-num { background-image:url(/images/3d/rings.webp); }
/* Any item beyond the mapped ones falls back to a neutral blue dot instead of an empty box */
body.nk-refined[data-page=home] #main-content :is(.svx-cols > li:nth-child(n+4) .svx-num,.prx-step:nth-child(n+5) .prx-num,.crx-row:nth-child(n+4) .crx-num,.cvx-col:nth-child(n+4) .cvx-num) { background-image:radial-gradient(circle at 35% 35%,#8c43ff,#4031ff 60%); border-radius:50%; width:28px; height:28px; }

/* ── Kokiri plate: the elephant has its own slot at the right of the header row, so it
   never sits on the cards. The header reserves the width; the lead column shrinks. ── */
body.nk-refined[data-page=home] .kkx-plate { position:relative; overflow:visible; }
body.nk-refined[data-page=home] .kkx-head { position:relative; padding-right:230px; min-height:190px; align-items:start!important; }
body.nk-refined[data-page=home] .kkx-head::after { content:''; position:absolute; right:8px; top:-12px; width:200px; height:200px; pointer-events:none; background:url(/images/3d/elephant.webp) center/contain no-repeat; filter:drop-shadow(0 18px 24px #4031ff2a); animation:nk-float 5s ease-in-out infinite alternate; }

/* ── Program board: a megaphone leads the shelf title; each board cell wears its own object ── */
body.nk-refined[data-page=home] .fbx-head-copy { display:flex; align-items:center; gap:14px; }
body.nk-refined[data-page=home] .fbx-head-copy::before { content:''; flex:0 0 auto; width:64px; height:64px; background:url(/images/3d/megaphone.webp) center/contain no-repeat; filter:drop-shadow(0 8px 14px #4031ff26); }
body.nk-refined[data-page=home] .fbx-cell { position:relative; }
body.nk-refined[data-page=home] .fbx-cell::after { content:''; position:absolute; right:18px; top:16px; width:64px; height:64px; pointer-events:none; background:center/contain no-repeat; filter:drop-shadow(0 8px 14px #4031ff22); transition:transform .35s cubic-bezier(.22,.7,.3,1); }
body.nk-refined[data-page=home] .fbx-cell:hover::after { transform:translateY(-5px) rotate(-6deg); }
body.nk-refined[data-page=home] .fbx-tri > .fbx-cell:nth-child(1)::after { background-image:url(/images/3d/envelope.webp); }
body.nk-refined[data-page=home] .fbx-tri > .fbx-cell:nth-child(2)::after { background-image:url(/images/3d/newspaper.webp); }
body.nk-refined[data-page=home] .fbx-tri > .fbx-cell:nth-child(3)::after { background-image:url(/images/3d/cubes.webp); }
body.nk-refined[data-page=home] :is(.fbx-cell-title,.fbx-cell-label) { padding-right:80px; }

/* ── Closing plate: the page's one key-colour surface, with the hourglass (4 weeks) ── */
body.nk-refined[data-page=home] #main-content > .ctx .ctx-wrap { position:relative; overflow:hidden; background:radial-gradient(900px 480px at 100% 0%,#8c43ff73,transparent 62%),linear-gradient(135deg,#4a3cff 0%,#2f22d1 55%,#171553 100%)!important; border:1px solid #6a5dff!important; box-shadow:0 26px 70px #4031ff33; }
body.nk-refined[data-page=home] .ctx .ctx-wrap::after { content:''; position:absolute; right:44px; top:28px; width:220px; height:220px; pointer-events:none; background:url(/images/3d/hourglass.webp) center/contain no-repeat; filter:drop-shadow(0 22px 30px #0b0a3a66); animation:nk-float 6s ease-in-out infinite alternate; }
body.nk-refined[data-page=home] #main-content .ctx .ctx-title { color:#fff!important; max-width:760px!important; padding-right:240px; }
body.nk-refined[data-page=home] .ctx .ctx-row { display:flex!important; grid-template-columns:none!important; justify-content:flex-start!important; align-items:center!important; gap:32px!important; }
body.nk-refined[data-page=home] #main-content .ctx .ctx-body { color:#e6e2ff!important; max-width:560px!important; }
body.nk-refined[data-page=home] #main-content .ctx .ctx-cta { background:#fff!important; color:#11113a!important; border:0!important; box-shadow:0 10px 26px #0b0a3a33; }
body.nk-refined[data-page=home] #main-content .ctx .ctx-cta:hover { background:#e6f54a!important; }
body.nk-refined[data-page=home] .ctx .ctx-step { background:#ffffff14!important; border:1px solid #ffffff33!important; color:#fff!important; backdrop-filter:blur(10px); }
body.nk-refined[data-page=home] .ctx .ctx-step-num { color:#c9c2ff!important; }
body.nk-refined[data-page=home] .ctx .ctx-step-stat { color:#e6f54a!important; }
body.nk-refined[data-page=home] #main-content .ctx .ctx-step-desc { color:#eae7ff!important; }

/* ── Bands get a faint violet glow so gray is never flat ── */
body.nk-refined[data-page=home] .fbx { background:radial-gradient(760px 340px at 100% 0%,#8c43ff14,transparent 60%),#f4f4f9!important; }
body.nk-refined[data-page=home] .nk-guide-deck { background:radial-gradient(760px 340px at 0% 100%,#4031ff10,transparent 60%),#f4f4f9; }

@keyframes nk-float { from { translate:0 0; } to { translate:0 -12px; } }

/* ── Phones ── */
@media (max-width:767px) {
  body.nk-refined[data-page=home] .svx-col { grid-template-columns:46px minmax(0,1fr)!important; grid-template-areas:'num label' 'num stat' 'num body' 'num foot'!important; column-gap:12px!important; row-gap:2px!important; }
  body.nk-refined[data-page=home] .svx-label { word-break:keep-all; }
  body.nk-refined[data-page=home] .svx-stat { white-space:normal!important; justify-content:flex-start; }
  body.nk-refined[data-page=home] .svx-body { margin-top:4px!important; }
  body.nk-refined[data-page=home] #main-content :is(.svx-num,.prx-num,.crx-num) { width:46px; height:46px; margin:0!important; }
  body.nk-refined[data-page=home] .svx-num { grid-area:num; }
  body.nk-refined[data-page=home] .prx-step { display:grid; grid-template-columns:46px minmax(0,1fr); column-gap:12px; }
  body.nk-refined[data-page=home] .prx-num { grid-row:1 / 4; }
  body.nk-refined[data-page=home] .prx-desc { margin-left:0!important; }
  body.nk-refined[data-page=home] .crx-row { grid-template-columns:46px minmax(0,1fr)!important; }
  body.nk-refined[data-page=home] .kkx-head { padding-right:104px; min-height:0; }
  body.nk-refined[data-page=home] .kkx-head::after { right:-6px; top:-6px; width:104px; height:104px; }
  body.nk-refined[data-page=home] .fbx-head-copy::before { width:40px; height:40px; }
  body.nk-refined[data-page=home] .fbx-head-copy { gap:10px; }
  body.nk-refined[data-page=home] .fbx-cell::after { width:48px; height:48px; right:14px; top:14px; }
  body.nk-refined[data-page=home] :is(.fbx-cell-title,.fbx-cell-label) { padding-right:60px; }
  body.nk-refined[data-page=home] #main-content .ctx .ctx-title { padding-right:104px; max-width:none!important; }
  body.nk-refined[data-page=home] .ctx .ctx-wrap::after { right:8px; top:10px; width:110px; height:110px; }
  body.nk-refined[data-page=home] #main-content .ctx .ctx-body { max-width:none!important; }
  body.nk-refined[data-page=home] .ctx .ctx-row { flex-direction:column!important; align-items:stretch!important; gap:16px!important; }
}