/* BuenoTalk – päihdetietosivujen tyyli. Kevyt, ei JS-riippuvuuksia. */
:root{--bg:#07041c;--bg2:#0e1230;--kortti:#141a3a;
--reuna:#242c52;--tl:#71DBD4;--tx:#eef2ff;--mt:#9aa6c8;--or:#ff9438;}
*{box-sizing:border-box;margin:0;padding:0;}
body{background:radial-gradient(1100px 600px at 80% -10%,#123049 0%,var(--bg) 55%);
  color:var(--tx);font-family:Montserrat,system-ui,sans-serif;font-weight:500;line-height:1.65;
  -webkit-font-smoothing:antialiased;min-height:100vh;}
.ohita{position:absolute;left:-9999px;}
.ohita:focus{left:8px;top:8px;background:var(--tl);color:#04241a;padding:10px 16px;border-radius:8px;z-index:99;}
a{color:var(--tl);}
.ylapalkki{display:flex;align-items:center;gap:18px;flex-wrap:wrap;
  padding:14px 22px;border-bottom:1px solid var(--reuna);background:rgba(7,4,28,.85);}
.logo{font-weight:900;letter-spacing:1.4px;color:var(--tl);text-decoration:none;font-size:17px;}
.murut{font-size:12.5px;color:var(--mt);font-weight:700;}
.murut a{color:var(--mt);text-decoration:none;}
.murut a:hover{color:var(--tl);}
.murut strong{color:var(--tx);}
.murut span{opacity:.5;margin:0 3px;}
main{max-width:760px;margin:0 auto;padding:34px 22px 60px;}
.ylatunniste{font-size:11px;letter-spacing:2.4px;text-transform:uppercase;color:var(--tl);font-weight:800;margin-bottom:8px;}
h1{font-size:clamp(28px,6vw,42px);font-weight:900;line-height:1.12;margin-bottom:14px;}
h2{font-size:clamp(19px,3.4vw,24px);font-weight:800;margin-bottom:12px;color:var(--tl);}
.lead{font-size:17px;color:var(--tx);opacity:.92;margin-bottom:26px;}
.lohko{background:var(--kortti);border:1px solid var(--reuna);border-radius:18px;
  padding:22px 24px;margin-bottom:18px;}
.lohko ul{padding-left:20px;}
.lohko li{margin-bottom:9px;}
.lohko p{color:var(--tx);opacity:.92;}
.ap{font-size:14px;color:var(--mt);margin-bottom:10px;}
.mtaulu{display:grid;gap:2px;}
.mrivi{display:flex;gap:12px;padding:9px 0;border-bottom:1px solid var(--reuna);}
.mrivi:last-child{border-bottom:none;}
.mrivi dt{min-width:96px;color:var(--mt);font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:.6px;}
.mrivi dd{flex:1;font-weight:700;}
.tk-grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));}
.tk{background:rgba(113,219,212,.07);border:1px solid rgba(113,219,212,.28);border-radius:14px;padding:16px;}
.tk-luku{display:block;font-size:32px;font-weight:900;color:var(--tl);line-height:1;}
.tk-lab{display:block;font-size:11px;text-transform:uppercase;letter-spacing:1.4px;color:var(--mt);font-weight:800;margin:4px 0 8px;}
.tk p{font-size:14px;}
.laki{border-color:rgba(255,148,56,.4);background:rgba(255,148,56,.07);}
.laki h2{color:var(--or);}
.apu{border-color:rgba(113,219,212,.4);}
.linkkilista{list-style:none;padding-left:0;}
.linkkilista li{padding:8px 0;border-bottom:1px solid var(--reuna);}
.linkkilista li:last-child{border-bottom:none;}
.aiheet{list-style:none;padding-left:0;display:flex;flex-wrap:wrap;gap:8px;}
.aiheet li a{display:inline-block;background:var(--bg2);border:1px solid var(--reuna);
  border-radius:100px;padding:8px 15px;text-decoration:none;font-weight:700;font-size:13.5px;}
.aiheet li a:hover{border-color:var(--tl);}
.toiminta{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:26px;}
.nappi{display:inline-block;background:var(--tl);color:#04241a;text-decoration:none;
  font-weight:800;font-size:14.5px;padding:13px 22px;border-radius:100px;}
.nappi.toissijainen{background:transparent;color:var(--tl);border:1.5px solid var(--tl);}
.nappi:hover{filter:brightness(1.08);}
.aihelista{list-style:none;padding:0;display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin-bottom:24px;}
.aihekortti a{display:block;height:100%;background:var(--kortti);border:1px solid var(--reuna);
  border-radius:18px;padding:20px;text-decoration:none;color:var(--tx);transition:border-color .15s,transform .15s;}
.aihekortti a:hover{border-color:var(--tl);transform:translateY(-2px);}
.aihekortti .ico{font-size:28px;display:block;margin-bottom:6px;}
.aihekortti .nimi{display:block;font-weight:900;font-size:18px;color:var(--tl);margin-bottom:5px;}
.aihekortti .kuvaus{display:block;font-size:13.5px;color:var(--mt);line-height:1.5;}
.alapalkki{border-top:1px solid var(--reuna);padding:24px 22px 40px;text-align:center;
  color:var(--mt);font-size:13px;}
.alapalkki p{max-width:640px;margin:0 auto 8px;}
@media(max-width:600px){main{padding:24px 16px 44px;} .lohko{padding:18px 16px;}}