/* Noga · ena za vse strani (30. 9., luply-50; v4 4. 10., luply-f7). Mreža 12 stolpcev kot vsebina strani, napis "luply" na dnu.
   Glavna stran: <footer class="lf" data-gl> → napis nariše WebGL (scene.js alignWordmark bere .lf-mark), CSS napis skoraj neviden.
   Podstrani: napis iz LED pikslov (js/noga.js, isti jezik kot Članki): ob prihodu se zbere, pod kazalcem se razstavi. Brez JS ostane CSS napis.
   ⚠ 4. 10.: vsa pravila začnejo z .lf. V buildu Vite naloži zgoščeni CSS strani (delo.css: .in{padding:0 var(--pad)}) ZA noga.css in je
   z enako specifičnostjo pobrisal zgornji in spodnji odmik (logo na robu, zadnja povezava čez spodnjo črto, na vseh podstraneh). */
.lf{position:relative;z-index:1;overflow:hidden;background:var(--pbg,var(--bg));color:var(--k)}
/* 1. 10. (luply-c0): na glavni je noga prosojna, da sveti skozi delci/napis iz platna; brez črt čez delce */
.lf[data-gl]{background:transparent}
.lf .lf-inner{position:relative;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:56px;padding-top:clamp(88px,12vh,132px);padding-bottom:clamp(56px,8vh,88px)}
/* črti samo v širini vsebine (prej zgoraj čez cel zaslon, spodaj širša od vsebine) */
.lf:not([data-gl]) .lf-inner::before,.lf:not([data-gl]) .lf-bottom::before{content:"";position:absolute;top:0;left:var(--pad);right:var(--pad);height:1px;background:var(--k12)}

.lf .lf-brand{grid-column:1/5;display:flex;flex-direction:column;align-items:flex-start;gap:20px;max-width:340px}
.lf .wm{font-size:28px}
.lf .lf-tag{font-size:17px;line-height:1.5;color:var(--k72);text-wrap:pretty}
.lf .lf-cta{display:inline-flex;align-items:center;gap:12px;margin-top:4px;font-size:16px;font-weight:600;color:var(--k);border:1px solid var(--k24);border-radius:999px;padding:7px 7px 7px 22px;transition:border-color .25s,background .25s}
.lf .lf-cta .arr{width:34px;height:34px;border:0;border-radius:50%;display:grid;place-items:center;background:var(--k);color:var(--pbg,var(--bg));transition:transform .25s}
.lf .lf-cta .arr svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.lf .lf-cta:hover{border-color:var(--k48);background:var(--k6)}
.lf .lf-cta:hover .arr{transform:translate(2px,-2px)}

.lf .lf-cols{grid-column:6/13;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.lf .lf-col{display:flex;flex-direction:column;align-items:flex-start;gap:12px;min-width:0}
.lf .lf-h{font-family:var(--fm);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--k48);margin-bottom:8px}
/* povezava: črta pod njo zraste ob prehodu z miško */
.lf .lf-col a{font-size:15.5px;line-height:1.4;color:var(--k72);background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:color .2s,background-size .35s cubic-bezier(.2,.8,.2,1)}
.lf .lf-col a:hover{color:var(--k);background-size:100% 1px}
.lf .lf-col .lf-loc{font-size:14px;line-height:1.4;color:var(--k48);white-space:nowrap}

.lf .lf-bottom{position:relative;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px 24px;padding-top:20px;padding-bottom:20px;font-family:var(--fm);font-size:11.5px;letter-spacing:.04em;color:var(--k48)}
.lf .lf-bottom a:hover{color:var(--k)}
.lf .lf-r{display:inline-flex;align-items:center;gap:20px;flex-wrap:wrap}
.lf .tt{display:inline-flex;align-items:center;gap:8px;background:none;border:1px solid var(--k24);border-radius:999px;padding:6px 12px;font-family:var(--fm);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--k72);cursor:pointer;transition:border-color .2s,color .2s}
.lf .tt:hover{border-color:var(--k48);color:var(--k)}
.lf .tt svg{width:13px;height:13px;flex:none}
.lf .tt .d{display:none}
:root[data-theme=dark] .lf .tt .l{display:none}
:root[data-theme=dark] .lf .tt .d{display:inline}

/* napis: v toku strani, cel (tudi p in y pod črto) */
.lf .lf-mark{display:block;text-align:center;font-weight:600;font-size:clamp(110px,25vw,400px);line-height:1.12;letter-spacing:-.05em;white-space:nowrap;margin:clamp(4px,1vw,16px) 0 0;padding-bottom:.1em;user-select:none;pointer-events:none;color:var(--k12)}
.lf[data-gl] .lf-mark{color:rgba(var(--kr,10,10,10),.03)}
/* LED napis (js/noga.js doda .px in platno): širina vsebine, piksli se odzovejo na kazalec */
.lf .lf-mark.px{max-width:var(--w);margin:clamp(12px,2vw,28px) auto 0;padding:0 var(--pad) clamp(20px,3vw,44px);font-size:0;line-height:0;color:transparent;pointer-events:auto}
.lf .lf-mark.px canvas{display:block;width:100%;cursor:crosshair;touch-action:pan-y}

@media(max-width:900px){
  .lf .lf-inner{row-gap:44px}
  .lf .lf-brand,.lf .lf-cols{grid-column:1/13;max-width:none}
  .lf .lf-cols{grid-template-columns:1fr 1fr;row-gap:40px}
  .lf .lf-bottom{justify-content:flex-start}
  .lf .lf-mark{font-size:27vw}
  .lf .lf-mark.px{font-size:0}
}
