@font-face{font-family:"Space Grotesk";src:url(/assets/fonts/spacegrotesk.woff2) format("woff2");font-weight:300 700;font-display:swap}
@font-face{font-family:"Manrope";src:url(/assets/fonts/manrope.woff2) format("woff2");font-weight:200 800;font-display:swap}
:root{--deep:#0d2b33;--deep-2:#123a44;--mint:#7fd1b9;--mint-2:#a8e6d4;--coral:#c8442b;--coral-2:#e86248;--page:#eef3f2;--card:#fff;--ink:#14232a;--ink-2:#4a5b62;--line:#d5e0de;
--display:"Space Grotesk",system-ui,sans-serif;--text:"Manrope",system-ui,sans-serif}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--page);color:var(--ink);font-family:var(--text);font-size:1.05rem;line-height:1.6}
img{max-width:100%;height:auto;display:block}
a{color:var(--coral)}
:focus-visible{outline:3px solid var(--coral-2);outline-offset:3px;border-radius:6px}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;background:#fff;padding:.4rem .8rem;z-index:9}
.col{width:min(100% - 2.2rem,40rem);margin-inline:auto}
h1,h2,h3{font-family:var(--display);line-height:1.15;margin:0 0 .5em;letter-spacing:-.01em}
h2{font-size:1.5rem;display:flex;align-items:center;gap:.6rem}
h2::before{content:"";width:12px;height:12px;border-radius:50%;background:var(--coral-2);box-shadow:0 0 0 4px rgba(232,98,72,.18)}
.band{background:var(--deep) url(/assets/img/network.svg) center/cover no-repeat;color:#e6f2ef;padding:3.4rem 0 5.6rem;text-align:center}
.avatar{width:min(100%,264px);aspect-ratio:4/3;margin:0 auto 1.3rem;border-radius:24px;padding:5px;background:conic-gradient(var(--mint),var(--coral-2),var(--mint))}
.avatar picture{display:block;width:100%;height:100%}
.avatar img{width:100%;height:100%;border-radius:20px;object-fit:cover;object-position:30% 50%;border:4px solid var(--deep)}
.band h1{font-size:clamp(2.4rem,8vw,3.4rem);color:#fff;margin:0}
.band .tag{font-family:var(--display);color:var(--mint-2);font-size:1.08rem;margin:.4rem 0 1rem;letter-spacing:.02em}
.band .intro{max-width:32rem;margin:0 auto;color:#c9dcd8}
.links{list-style:none;padding:0;margin:-3.4rem auto 0;display:grid;gap:.85rem;position:relative}
.links a{display:grid;grid-template-columns:3rem 1fr auto;align-items:center;gap:1rem;background:var(--card);border-radius:16px;padding:1rem 1.2rem;text-decoration:none;color:var(--ink);
border:1px solid var(--line);box-shadow:0 6px 18px rgba(13,43,51,.08);transition:transform .15s,box-shadow .15s}
.links a:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(13,43,51,.14);border-color:var(--mint)}
.links .ic{width:3rem;height:3rem;border-radius:12px;display:grid;place-items:center;font-family:var(--display);font-weight:700;color:#fff;background:var(--deep-2)}
.links strong{display:block;font-family:var(--display);font-size:1.08rem}
.links span.d{font-size:.93rem;color:var(--ink-2)}
.links .arr{color:var(--coral);font-weight:700}
section{padding:2.8rem 0 0}
.chips{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}
.chips li{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:.9rem 1rem}
.chips strong{display:block;font-family:var(--display)}
.chips span{font-size:.92rem;color:var(--ink-2)}
.topics{list-style:none;padding:0;margin:0;counter-reset:t}
.topics li{counter-increment:t;display:grid;grid-template-columns:2.4rem 1fr;gap:.8rem;padding:.9rem 0;border-bottom:1px dashed var(--line)}
.topics li::before{content:counter(t,decimal-leading-zero);font-family:var(--display);font-weight:700;color:var(--coral)}
.topics strong{font-family:var(--display)}
.callout{background:var(--deep);color:#d9ebe7;border-radius:18px;padding:1.4rem 1.5rem;margin-top:1.4rem}
.callout a{color:var(--mint-2)}
.callout p{margin:.2rem 0}
footer{margin-top:3.4rem;padding:2rem 0 2.6rem;border-top:1px solid var(--line);font-size:.9rem;color:var(--ink-2)}
@media (max-width:560px){.chips{grid-template-columns:1fr}.links a{grid-template-columns:2.6rem 1fr auto;padding:.9rem 1rem}.links .ic{width:2.6rem;height:2.6rem}}