/* Evästesuostumus — teeman sävyt (--bg, --cream, --red, --sans, --bebas); varamäärittelyt jos muuttujat puuttuvat. */
/* z-index jää Ghost Portalin (3999999) alle: kirjautumis-/tilausikkuna peittää bannerin eikä toisin päin. */
.cc{position:fixed;z-index:3999000;left:16px;right:16px;bottom:16px;display:flex;justify-content:flex-start;pointer-events:none;font-family:var(--sans,'DM Sans',system-ui,sans-serif)}
.cc[hidden]{display:none}
.cc-box{pointer-events:auto;box-sizing:border-box;width:100%;max-width:440px;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow:auto;background:var(--bg,#000d13);color:var(--cream,#f0e6d3);border:1px solid rgba(240,230,211,.18);border-top:3px solid var(--red,#cc2031);border-radius:2px;padding:22px 22px 18px;box-shadow:0 18px 50px rgba(0,0,0,.45);font-size:15px;line-height:1.55}
.cc-k{margin:0 0 4px;font-family:var(--bebas,'Bebas Neue',sans-serif);font-size:15px;letter-spacing:.12em;color:var(--red,#cc2031)}
.cc-h{margin:0 0 8px;font-family:var(--bebas,'Bebas Neue',sans-serif);font-weight:400;font-size:34px;line-height:.95;letter-spacing:.01em;color:var(--cream,#f0e6d3)}
.cc-p{margin:0 0 16px;color:rgba(240,230,211,.82)}
.cc-p a{color:var(--cream,#f0e6d3);text-decoration:underline;text-underline-offset:2px}
.cc-acts{display:grid;grid-template-columns:1fr 1fr;gap:8px;position:sticky;bottom:-18px;margin:0 -22px -18px;padding:12px 22px 18px;background:var(--bg,#000d13)}
.cc-btn{appearance:none;-webkit-appearance:none;font:inherit;font-weight:700;font-size:14px;line-height:1.2;padding:.85em 1em;border-radius:2px;cursor:pointer;border:1px solid transparent;text-align:center}
.cc-btn:focus-visible{outline:2px solid var(--cream,#f0e6d3);outline-offset:2px}
/* Hylkää ja Hyväksy ovat tarkoituksella täsmälleen samannäköiset (Traficom: yhtä helppo kieltäytyä). */
.cc-btn-solid{background:var(--red,#cc2031);color:#fff}
.cc-btn-solid:hover{background:#b01b2a}
.cc-btn-line{background:transparent;color:var(--cream,#f0e6d3);border-color:rgba(240,230,211,.45)}
.cc-btn-line:hover{border-color:var(--cream,#f0e6d3)}
.cc-btn-text{grid-column:1/-1;background:transparent;color:var(--cream,#f0e6d3);text-decoration:underline;text-underline-offset:3px;padding:.5em}
.cc-btn[hidden]{display:none}
.cc-acts .cc-btn-line{grid-column:1/-1}
.cc-panel{margin:0 0 14px;border-top:1px solid rgba(240,230,211,.14)}
.cc-panel[hidden]{display:none}
.cc-row{display:flex;gap:14px;align-items:flex-start;justify-content:space-between;padding:12px 0;border-bottom:1px solid rgba(240,230,211,.14);cursor:pointer}
.cc-row-on{cursor:default}
.cc-row-t{display:flex;flex-direction:column;gap:2px}
.cc-row-t b{font-weight:700;color:var(--cream,#f0e6d3)}
.cc-row-t span{font-size:13px;color:rgba(240,230,211,.7)}
.cc-sw{appearance:none;-webkit-appearance:none;flex:none;position:relative;width:42px;height:24px;margin:2px 0 0;border-radius:12px;background:rgba(240,230,211,.22);cursor:pointer;transition:background .2s}
.cc-sw::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:var(--cream,#f0e6d3);transition:transform .2s}
.cc-sw:checked{background:var(--red,#cc2031)}
.cc-sw:checked::after{transform:translateX(18px)}
.cc-sw:disabled{opacity:.55;cursor:default}
.cc-sw:focus-visible{outline:2px solid var(--cream,#f0e6d3);outline-offset:2px}
@media (max-width:520px){.cc{left:10px;right:10px;bottom:10px}.cc-box{max-width:none;padding:18px 16px 14px}.cc-acts{bottom:-14px;margin:0 -16px -14px;padding:10px 16px 14px}.cc-h{font-size:30px}}

/* Upotuksen paikkamerkki (artikkeleissa, sekä tummalla että paperilla) */
.cc-ph{box-sizing:border-box;width:100%;aspect-ratio:16/9;min-height:200px;display:flex;align-items:center;justify-content:center;background:var(--bg,#000d13);color:var(--cream,#f0e6d3);border:1px solid rgba(240,230,211,.18);border-radius:2px;margin:0 0 1.5em;font-family:var(--sans,'DM Sans',system-ui,sans-serif)}
.cc-ph-in{max-width:420px;padding:20px;text-align:center}
.cc-ph-t{margin:0 0 6px;font-family:var(--bebas,'Bebas Neue',sans-serif);font-size:28px;line-height:1;letter-spacing:.02em}
.cc-ph-d{margin:0 0 14px;hyphens:manual;-webkit-hyphens:manual;font-size:14px;line-height:1.5;color:rgba(240,230,211,.75)}
.cc-ph-b{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.cc-ph .cc-btn{font-size:13px}
/* Bannerin otsikko samalla Bebas-otsikkotyylillä kaikilla sivuilla (teeman h2-säännöt antoivat etusivulla DM Serifin ja
   alasivuilla DM Sansin) */
html .cc .cc-h,html.jkj body.sub .cc .cc-h{font-family:var(--bebas,'Bebas Neue',sans-serif);font-weight:400;letter-spacing:.01em}
