/* Page layout: background, header, hero, sections, footer */
/* Interactive background: the logo, blurred, drifting with pointer / tilt */
.bg{position:fixed;inset:-6%;z-index:-2;background:url(/assets/img/logo.png) center/cover no-repeat;
  filter:blur(7px) saturate(1.1);transform:translate3d(var(--x,0),var(--y,0),0) scale(1.08);
  transition:transform .25s ease-out}
.bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,22,28,.55),rgba(20,22,28,.88) 70%)}
.glow{position:fixed;z-index:-1;width:34rem;height:34rem;left:0;top:0;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(240,110,180,.22),transparent 65%);
  transform:translate(calc(var(--gx,50vw) - 50%),calc(var(--gy,30vh) - 50%))}
.bar{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem clamp(1rem,4vw,3rem)}
.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;font:700 1.25rem var(--serif)}
.brand img{width:2.5rem;height:2.5rem;border-radius:.4rem;object-fit:cover}
nav{display:flex;align-items:center;gap:1.4rem;font-weight:500}
nav a{text-decoration:none;color:var(--muted)}
nav a:hover{color:var(--paper)}
.lang{background:none;border:1px solid var(--line);color:var(--paper);border-radius:2rem;padding:.3rem .8rem;font:inherit;font-size:.9rem;cursor:pointer}
.hero{min-height:82vh;display:grid;align-content:center;justify-items:start;gap:1.4rem;padding:2rem clamp(1rem,6vw,5rem)}
.tiles{display:flex;gap:.6rem}
.tile{width:4.6rem;aspect-ratio:1;padding:.35rem .5rem;border:2px solid #14161c;color:#14161c;display:flex;flex-direction:column;justify-content:space-between;
  font:500 .7rem/1 var(--sans);transition:transform .3s}
.tile b{font:500 2.6rem/1 var(--serif);text-align:center}
.tile.u{background:var(--u)}
.tile.s{background:var(--s)}
.tile:hover{transform:translateY(-6px) rotate(-3deg)}
h1{font:700 clamp(2.8rem,9vw,6.5rem)/.98 var(--serif);letter-spacing:-.01em}
h1 em{font-style:italic;font-weight:600;color:var(--u)}
.lead{max-width:34rem;color:var(--muted);font-size:1.2rem}
section{padding:4.5rem clamp(1rem,6vw,5rem);max-width:70rem}
h2{font:700 clamp(1.9rem,4.5vw,3rem)/1.1 var(--serif);margin-bottom:1.6rem}
.about{display:grid;gap:2.2rem;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}
.about h3{font:600 1.35rem var(--serif);margin-bottom:.3rem;color:var(--s)}
.about p{color:var(--muted)}
.band{background:rgba(20,22,28,.72);backdrop-filter:blur(6px);border-block:1px solid var(--line);max-width:none}
.band .in{max-width:70rem}
.rules{list-style:none;padding:0;display:grid;gap:.9rem;max-width:36rem}
.rules li{padding-left:1.4rem;position:relative}
.rules li::before{content:"";position:absolute;left:0;top:.7em;width:.6rem;height:.6rem;background:var(--u)}
.partner{display:flex;flex-wrap:wrap;align-items:baseline;gap:.5rem 1.2rem}
.partner p{font:500 1.7rem var(--serif)}
.site-footer{padding:2.5rem clamp(1rem,6vw,5rem) 3rem;color:var(--muted);font-size:.95rem;border-top:1px solid var(--line)}
.bar nav{flex-wrap:wrap;justify-content:flex-end}
nav a.active{color:var(--paper);border-bottom:2px solid var(--u)}
.page-head{padding:3rem clamp(1rem,6vw,5rem) 0;max-width:70rem}
.page-head p{color:var(--muted);max-width:40rem}
main>section:first-child{padding-top:2rem}
.site-footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem}
.site-footer a{margin-right:1.2rem;color:var(--muted)} .site-footer a:hover{color:var(--paper)}
.steps{list-style:none;padding:0;counter-reset:s;display:grid;gap:1.3rem;max-width:40rem}
.steps li{counter-increment:s;padding-left:3.2rem;position:relative}
.steps li::before{content:counter(s);position:absolute;left:0;top:-.1rem;width:2.2rem;height:2.2rem;display:grid;place-items:center;background:var(--u);color:#14161c;font:700 1.1rem var(--serif)}
.prose{max-width:40rem} .prose h2{font-size:1.5rem;margin:2rem 0 .5rem} .prose p,.prose li{color:var(--muted)} .prose ul{padding-left:1.2rem}
.notfound{text-align:center;padding-top:5rem}
@media (max-width:640px){.bar{justify-content:center}.hero{min-height:70vh}}
.page-head h1{font-size:clamp(2rem,5vw,3.2rem);line-height:1.1;margin-bottom:.6rem}