
@font-face{font-family:Lora;src:url(/assets/fonts/lora.woff) format('woff');font-weight:400 700;font-display:swap}
@font-face{font-family:Lora;font-style:italic;src:url(/assets/fonts/lora-italic.woff) format('woff');font-weight:400 700;font-display:swap}
@font-face{font-family:Inter;src:url(/assets/fonts/inter-black.woff) format('woff');font-weight:900;font-display:swap}
@font-face{font-family:Inter;src:url(/assets/fonts/inter-bold.woff) format('woff');font-weight:700;font-display:swap}
:root{--tq1:#D9F7F5;--tq2:#9FE6E1;--tq3:#5FCFC8;--tq4:#2BA39B;--mag:#C2185B;--vio:#3F1D7A;--txt:#1F3A4A;--sub:#4F6B75;--carta:#FFFDF8}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:Lora,Georgia,serif;color:var(--txt);background:linear-gradient(180deg,var(--tq1) 0,var(--tq2) 55%,var(--tq3) 100%) fixed;line-height:1.55}
a{color:var(--mag)}
.wrap{max-width:980px;margin:0 auto;padding:0 18px}
header.top{padding:18px 0 6px}
.logo{font-family:Inter,Arial,sans-serif;font-weight:900;font-size:clamp(28px,7vw,54px);letter-spacing:.02em;text-decoration:none;display:inline-block;line-height:1}
.logo .k{color:var(--mag)}.logo .n{color:var(--vio)}
.logo .ma{background:linear-gradient(180deg,var(--mag) 50%,var(--vio) 50%);-webkit-background-clip:text;background-clip:text;color:transparent}
.motto{font-style:italic;color:var(--txt);margin:.3em 0 0;font-size:clamp(16px,3.6vw,21px)}
nav.menu{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0 4px}
nav.menu a{font-family:Inter,Arial,sans-serif;font-weight:700;font-size:14px;text-decoration:none;color:#fff;background:var(--mag);padding:8px 14px;border-radius:99px}
nav.menu a.alt{background:var(--vio)}
.panel{background:rgba(255,253,248,.9);border-radius:22px;padding:22px;margin:18px 0;box-shadow:0 6px 24px rgba(31,58,74,.10)}
h1,h2,h3{line-height:1.2}
h1{font-size:clamp(26px,5.5vw,38px);margin:.2em 0}
h2{font-size:clamp(21px,4.4vw,28px);color:var(--vio);margin:.2em 0 .5em}
.eti{font-family:Inter,Arial,sans-serif;font-weight:700;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--sub)}
.dev{font-size:28px;color:var(--txt)}
blockquote{font-style:italic;font-size:clamp(18px,4vw,22px);margin:.6em 0;padding:0 0 0 14px;border-left:4px solid var(--mag)}
.fonte{font-size:14px;color:var(--sub)}
.carte{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px}
.carta{background:#fff;border-radius:18px;padding:14px;border:2px solid var(--tq2);display:flex;flex-direction:column}
.carta img{width:100%;height:auto;border-radius:12px;background:var(--carta)}
.carta h3{margin:.5em 0 .1em;color:var(--mag)}
.carta p{margin:.2em 0 .6em;font-size:15px;color:var(--sub)}
.campioni{list-style:none;padding:0;margin:0;display:grid;gap:6px}
.campioni li{display:flex;align-items:center;gap:10px;font-size:14px}
.campioni span.c{width:28px;height:28px;border-radius:8px;border:1px solid rgba(0,0,0,.15);flex:none}
.campioni code{color:var(--sub);font-size:12px;margin-left:auto}
.griglia{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px}
.fig{background:#fff;border-radius:16px;padding:8px;text-decoration:none;color:var(--txt);text-align:center;border:2px solid transparent;transition:border-color .2s}
.fig:hover{border-color:var(--mag)}
.fig img{width:100%;height:auto;display:block}
.fig b{display:block;font-size:13px;color:var(--sub);font-family:Inter,Arial,sans-serif;font-weight:700;margin-top:4px}
.fig span{font-size:14px}
audio{width:100%;margin:10px 0}
.brano{display:grid;grid-template-columns:72px 1fr;gap:14px;align-items:center;padding:12px 0;border-bottom:1px solid var(--tq2)}
.brano:last-child{border-bottom:0}
.num{width:72px;height:72px;border-radius:50%;background:var(--tq4);color:#fff;font-family:Inter,Arial,sans-serif;font-weight:900;font-size:30px;display:flex;align-items:center;justify-content:center}
.btn{display:inline-block;font-family:Inter,Arial,sans-serif;font-weight:700;font-size:14px;text-decoration:none;color:#fff;background:var(--vio);padding:9px 16px;border-radius:99px;margin:4px 6px 4px 0}
.btn.m{background:var(--mag)}.btn.l{background:#fff;color:var(--vio);border:2px solid var(--vio)}
.passi{display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
.lettore{background:linear-gradient(135deg,var(--vio),var(--mag));color:#fff;border-radius:18px;padding:14px 16px;margin:14px 0}
.lettore audio{margin:6px 0 4px}
.lettore label{font-family:Inter,Arial,sans-serif;font-weight:700;font-size:15px;display:inline-flex;align-items:center;gap:8px;cursor:pointer;background:rgba(255,255,255,.18);padding:7px 14px;border-radius:99px}
.lettore input{width:18px;height:18px;accent-color:#FFE08B}
.lettore .cons{font-size:14px;margin:.6em 0 0;opacity:.95}
footer{padding:26px 0 40px;font-size:13px;color:var(--txt);text-align:center}
