/* base.css */
*,
*::before,
*::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  font-size: 16px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: var(--teksti, #222222);
  background: var(--sivupohja, #FAFAFA);
}

a {
  color: var(--linkki-sininen, #0066CC);
  text-decoration: none;
}

/* hover + näppäimistöfokus linkeille */
a:hover,
a:focus { text-decoration: underline; }

h1, h2, h3, h4, h5, h6 {
  font-weight: 600;
  line-height: 1.2;
  margin-bottom: 0.5em;
  color: var(--otsikko, #111111);
}

p { margin-bottom: 1em; }

ul, ol {
  margin-left: 1.5em;
  margin-bottom: 1em;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

input, textarea, select, button {
  font: inherit;
  line-height: 1.4;
}

/* ==================================================
   HEADER – YLEISET
   ================================================== */

header {
  background: var(--pinta);
  border-bottom: 1px solid var(--reuna-neutraali);
}

/* ==================================================
   STATUS-RIVI
   ================================================== */

.status-row {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.25rem 0.75rem;

  background: var(--sivupohja);
  border-bottom: 1px solid var(--reuna-kevyt);

  font-size: 0.8rem;
  line-height: 1.2;
}

.status-row > span:first-child {
  margin-right: auto;
}

.status-row .logout-form {
  display: inline;
  margin: 0;
  padding: 0;
}

.status-row .logout-link {
  background: none;
  border: none;
  padding: 0;
  margin: 0;

  color: var(--brand-primary);
  font-size: 0.8rem;
  cursor: pointer;
  text-decoration: underline;
}

.status-row .logout-link:hover {
  color: var(--linkki-hover);
  text-decoration: none;
}

/* ==================================================
   OTSAKERIVI (VASEN + OIKEA)
   ================================================== */

.header-row {
  display: flex;
  width: 100%;
  align-items: stretch;   /* molemmat saman korkuisia */
}

/* --- Vasen: otsakekuva --- */

.logo-row {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  border-bottom: 1px solid var(--reuna-neutraali);
}

/* Klikattava linkki */
.header-image-link {
  display: block;
  width: 100%;
}

/* Otsakekuva */
.logo-image {
  display: block;
  width: 100%;            /* täyttää vasemman palstan */
  height: auto;           /* korkeus elää leveyden mukaan */
}

/* --- Oikea: header-right --- */

/* Oikea palsta */
.header-right {
  flex: 0 0 320px;
  width: 320px;

  background-image: url("/kuvat/taustaoikealevyr2.jpg");
  background-repeat: repeat;
  background-position: top left;

  border-bottom: 1px solid var(--reuna-neutraali);

  display: flex;
  align-items: flex-end;   /* tärkeä */
  justify-content: center;
  padding-bottom: 0.5rem;
}

/* Rokki-Amor EI täytä korkeutta */
.rokki-amor {
  display: block;
}

/* Kuva: hallittu koko */
.rokki-amor img {
  height: auto;
  width: auto;
  max-height: 120px;   /* <-- TÄMÄ RATKAISEE */
  max-width: 100%;
  display: block;
}


/* ==================================================
   SAAVUTETTAVUUS
   ================================================== */

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ==================================================
   MOBIILI ≤768px
   ================================================== */

@media (max-width: 768px) {

  .header-row {
    flex-direction: column;
  }

  /* Mobiilissa vain otsake */
  .header-right {
    display: none;
  }

  .logo-image {
    width: 100%;
    height: auto;
  }
}

/* ==================================================
   NAV BAR – RIVI
   ================================================== */

.nav-bar {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.5rem 1rem;
  background: #B73128; /* navin punainen */
}

/* ==================================================
   PÄÄNAVIGAATIO – PEHMEÄ VINTAGE
   ================================================== */

.main-nav {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  gap: 0.75rem;
  align-items: center;
}

/* Päälinkit */
.main-nav a {
  background: #899BFF;
  color: #000;

  border: 1.5px solid #4D7068;
  border-radius: 8px;

  font-weight: 700;
  font-size: 1.3rem;     /* ISOMPI TEKSTI */
  letter-spacing: 0.02em;

  margin: 0;             /* EI ulkomarginaalia */
  padding: 0.25rem 0.6rem; /* TIIVI NAPPI */

  text-decoration: none;
  box-shadow: none;
}

/* ==================================================
   SUBNAV – SELKEÄ, ISO, MUSTA
   ================================================== */

.subnav-row {
  background: var(--brand-accent);
  border-bottom: 1px solid var(--reuna-neutraali);
}

.sub-nav-inline {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;

  margin: 0;
  padding: 0.35rem 0.75rem; /* minimaalinen korkeus */
}

.sub-nav-inline a {
  font-size: 1.3rem;      /* isompi */
  font-weight: 700;
  color: #000;            /* musta */

  text-decoration: none;
  margin: 0;
  padding: 0;             /* EI nappimaisuutta */
}

.sub-nav-inline a:hover {
  text-decoration: underline;
}

.sub-nav-inline a.is-active {
  text-decoration: underline;
}




/* ==================================================
   ALAVALIKOT – DESKTOP
   ================================================== */

.has-sub {
  position: relative;
  display: flex;
  align-items: center;
}

/* Dropdown */
.has-sub > .sub-nav {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;

  min-width: 14rem;
  padding: 0.5rem;

  margin-top: -2px; /* EI hover-rakoa */

  background: #ffffff;
  border: 1px solid #ccc;
  border-radius: 10px;
  box-shadow: 0 6px 18px rgba(0,0,0,.15);

  z-index: 100;
}

.has-sub:hover > .sub-nav,
.has-sub:focus-within > .sub-nav {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

/* Subnav-linkit */
.sub-nav a {
  background: #899BFF;
  color: #1b1b1b;
  border: 1px solid #4D7068;
  border-radius: 6px;
  padding: 0.45rem 0.75rem;
}

.sub-nav a:hover {
  background: #EBBD72;
}

/* ==================================================
   TOGGLET (PIILOSSA)
   ================================================== */

.nav-toggle,
.sub-toggle {
  position: absolute;
  left: -9999px;
}

/* ==================================================
   HAMBURGER – MOBIILI
   ================================================== */

.nav-btn {
  display: none;
  cursor: pointer;
  user-select: none;

  padding: 0.45rem 0.75rem;
  border-radius: 8px;

  background: #ffffff;
  border: 1px solid #ccc;
  font-weight: 700;
}

/* ==================================================
   MOBIILI ≤768px
   ================================================== */

@media (max-width: 768px) {

  .nav-bar {
    flex-wrap: wrap;
  }

  .nav-btn {
    display: inline-block;
    margin-left: auto;
  }

  .main-nav {
    display: none;
    width: 100%;

    margin-top: 0.5rem;
    padding: 0.5rem;

    background: #ffffff;
    border-radius: 10px;
    box-shadow: 0 2px 10px rgba(0,0,0,.15);

    flex-direction: column;
    gap: 0.25rem;
  }

  .nav-toggle:checked ~ .main-nav {
    display: flex;
  }

  .has-sub {
    flex-direction: column;
    align-items: stretch;
  }

  .has-sub > .sub-nav {
    position: static;
    display: none;
    margin-top: 0.25rem;
    box-shadow: none;
  }

  .has-sub:hover > .sub-nav,
  .has-sub:focus-within > .sub-nav {
    display: flex;
  }
}




/* ==================================================
   MID – KESKIOSA
   ================================================== */

.mid {
  min-height: 60vh;

  /* Vasemman puolen tausta */
  background-image: url("/kuvat/taustavasen.jpg");
  background-repeat: no-repeat;
  background-position: left top;
  background-size: cover;

  padding: 0 1rem 1rem;
}

/* ==================================================
   SARAKKEET – PERUSASETUKSET
   ================================================== */

.center-col,
.left-col,
.right-col {
  padding: 0;
  margin: 0;
  background: none;
  min-height: 100%;
  box-sizing: border-box;
}

/* Keskisisältö oletuksena täysleveä */
.center-col {
  width: 100%;
  background: var(--pinta);
}

/* Sivupalkit oletuksena piilossa */
.left-col,
.right-col {
  display: none;
}

/* ==================================================
   RIGHT COL – SAMA TAUSTA KUIN HEADER-RIGHT
   ================================================== */

.right-col {
  background-image: url("/kuvat/taustaoikealevyr2.jpg");
  background-repeat: repeat;
  background-position: top left;
}

/* ==================================================
   DESKTOP ≥769px (GRID)
   ================================================== */

@media (min-width: 769px) {

  .mid {
    display: grid;
    gap: 1rem;
  }

  /* Vain keskisisältö → 100 % leveä */
  .mid:not(.has-left):not(.has-right) {
    grid-template-columns: 1fr;
  }

  /* Keskisisältö + oikea */
  .mid.has-right:not(.has-left) {
    grid-template-columns: 1fr 320px;
  }

  /* Vasen + keskisisältö */
  .mid.has-left:not(.has-right) {
    grid-template-columns: 320px 1fr;
  }

  /* Vasen + keski + oikea */
  .mid.has-left.has-right {
    grid-template-columns: 260px 1fr 260px;
  }

  /* Sivupalkkien näkyvyys */
  .mid.has-left .left-col {
    display: block;
  }

  .mid.has-right .right-col {
    display: block;
  }

  /* Ei keskityksiä eikä max-widthiä gridissä */
  .center-col {
    max-width: none;
    margin: 0;
    padding: 1.25rem;
  }

  .left-col,
  .right-col {
    padding: 1rem;
  }
}

/* ==================================================
   MOBIILI ≤768px
   ================================================== */

@media (max-width: 768px) {

  .mid {
    display: block;
    padding: 0 0.75rem 1rem;
  }

  /* Ei sivupalstoja mobiilissa */
  .left-col,
  .right-col {
    display: none;
  }

  .center-col {
    width: 100%;
    padding: 1rem;
  }
}

/* forms.css */
form { margin-bottom: 1em; }
label { display: block; margin-bottom: 0.25rem; font-weight: 500; }
input[type=text], input[type=email], input[type=password], textarea, select {
  width: 100%; padding: 0.5rem; border: 1px solid #ccc; border-radius: 4px;
}
button, input[type=submit] {
  padding: 0.5rem 1rem; border: none; border-radius: 4px; background: #0066cc; color: #fff; cursor: pointer;
}
button:hover, input[type=submit]:hover { background: #004999; }

/* Auth layout */
/* Auth layout */
.auth {
  display: grid;
  gap: 1.5rem;
  grid-template-columns: 1fr;
  justify-content: center;
  margin: 1.5rem auto;
  max-width: 1200px; /* keskitys isolla näytöllä */
  padding: 0 1rem;
}
@media (min-width: 900px) {
  .auth {
    grid-template-columns: 1fr 1fr;
    align-items: start;
  }
}
.auth-card {
  background: #fff;
  border-radius: 12px;
  padding: 1.5rem 2rem;
  box-shadow: 0 2px 8px rgba(0,0,0,.06);
  max-width: 550px;
  margin: 0 auto;
}

/* Alerts */
.alert { padding:.75rem 1rem; border-radius:10px; font-weight:600; margin-bottom:1rem; }
.alert.ok { background:#eef9f2; border:1px solid #cfeedd; color:#185c2e; }
.alert.error { background:#fff2f2; border:1px solid #f3c2c2; color:#8a1f1f; }

/* Form fields */
.form { display:flex; flex-direction:column; gap:.75rem; }
.fld span { display:block; font-size:.9rem; color:#444; margin-bottom:.25rem; }
.fld input {
  width:100%; padding:.65rem .75rem; border:1px solid #d6d6d6; border-radius:10px;
  outline:none;
}
.fld input:focus { border-color:#8cb8ff; box-shadow:0 0 0 3px rgba(50,120,255,.15); }

/* Buttons */
.btn {
  display:inline-block; text-align:center; padding:.7rem 1rem;
  border:1px solid #cfcfcf; border-radius:12px; background:#f7f7f7; cursor:pointer;
}
.btn:hover { background:#efefef; }
.btn.primary { background:#0b57d0; color:#fff; border-color:#0b57d0; }
.btn.primary:hover { background:#0a4ec0; }
.btn.wide { width:100%; }

.muted { color:#666; font-size:.9rem; }

/* cards.css */
.card { border: 1px solid #ddd; border-radius: 6px; padding: 1rem; background: #fff; margin-bottom: 1rem; box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
.card h3 { margin-top: 0; }

.mod-missing { background:#fff6f6; border:1px solid #f3c2c2; }

/* utilities.css */
.text-center { text-align: center; }
.mt-1 { margin-top: 0.5rem; }
.mt-2 { margin-top: 1rem; }
.mb-1 { margin-bottom: 0.5rem; }
.mb-2 { margin-bottom: 1rem; }

/* theme.css */
:root {
  --primary: #0066cc;
  --primary-dark: #004999;
  --secondary: #f7f7f7;
  --text-color: #222;
}
body { color: var(--text-color); background: var(--secondary); }
a { color: var(--primary); }
button, input[type=submit] { background: var(--primary); }
button:hover, input[type=submit]:hover { background: var(--primary-dark); }

/* ==================================================
   FOOTER – YLEISET / RUNKO
   ================================================== */

.site-footer {
  position: relative;
  background: var(--linkki-sininen, #224EB5);
  color: #ffffff;
  margin-top: 0;
  font-size: 1rem;
}

/* ==================================================
   GRID
   ================================================== */

.footer-grid {
  max-width: 1200px;
  margin: 0 auto;
  padding: 2rem 1.25rem;

  display: grid;
  gap: 2rem;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

/* ==================================================
   OTSIKOT
   ================================================== */

.footer-col h4 {
  margin-bottom: 0.6rem;
  font-size: 1.05rem;
  font-weight: 600;
  letter-spacing: 0.04em;

  color: #ffffff;
  border-bottom: 1px solid rgba(255,255,255,0.35);
  padding-bottom: 0.3rem;
}

/* ==================================================
   LINKIT
   ================================================== */

.footer-col a {
  display: block;
  margin: 0.3rem 0;

  color: #ffffff;
  text-decoration: none;
  font-weight: 500;
}

.footer-col a:hover,
.footer-col a:focus {
  text-decoration: underline;
}

/* ==================================================
   TEKSTIT
   ================================================== */

.footer-col p {
  margin: 0.3rem 0;
  line-height: 1.5;
  color: rgba(255,255,255,0.95);
}

/* ==================================================
   ALARIVI
   ================================================== */

.footer-bottom {
  border-top: 1px solid rgba(255,255,255,0.35);
  padding: 1rem;
  text-align: center;

  font-size: 1rem;
  line-height: 1.4;
  color: rgba(255,255,255,0.9);
}

.footer-bottom a {
  display: block;
  margin: 0.3rem 0;

  color: #ffffff;
  text-decoration: none;
  font-weight: 500;
}

/* ==================================================
   FOOTER-LOGO
   ================================================== */

.footer-logo {
  position: absolute;
  right: 1.5rem;
  bottom: 1.5rem;
  width: 120px;
  opacity: 0.9;
}

/* ==================================================
   MOBIILI
   ================================================== */

@media (max-width: 700px) {

  .footer-grid {
    padding: 1.5rem 1rem;
  }

  .footer-logo {
    display: none;
  }
}

/* ==================================================
   FONTIT – ENSIN (AINOA SALLITTU PAIKKA)
   ================================================== */


/* ==================================================
   CSS-RAKENNE – @importit
   ================================================== */


/* ==================================================
   MUUTTUJAT
   ================================================== */

:root {
  --brand-primary: #4D7068;
  --brand-accent: #EBBD72;
  --brand-red: #B73128;
  --brand-link: #899BFF;

  --teksti: #000000;
  --otsikko: #111111;

  --pinta: #FFFFFF;
  --sivupohja: #F5F5F5;

  --reuna-kevyt: #E0E0E0;
  --reuna-neutraali: #CCCCCC;

  --linkki: var(--brand-link);
  --linkki-hover: #6f80e0;
}

/* ==================================================
   PERUSTEKSTI
   ================================================== */

body {
  font-family: "IM Fell English", serif;
  color: var(--teksti);
  line-height: 1.55;
}

/* ==================================================
   OTSIKOT / NAVI (HALUTTU KÄSINTEHTY TYYLI)
   ================================================== */

h1, h2, h3,
.main-nav,
.sub-nav-inline {
  font-family: "Unkempt", cursive;
}

/* Itse isännöidyt fontit (CSP sallii vain 'self'). Muuttuvat fontit: yksi tiedosto, painoalue. */
@font-face{font-family:'Old Standard TT';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/old-standard-tt-normal-400.woff2) format('woff2')}
@font-face{font-family:'Old Standard TT';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/old-standard-tt-normal-700.woff2) format('woff2')}
@font-face{font-family:'Old Standard TT';font-style:italic;font-weight:400;font-display:swap;src:url(/assets/fonts/old-standard-tt-italic-400.woff2) format('woff2')}
@font-face{font-family:'Source Serif 4';font-style:normal;font-weight:400 600;font-display:swap;src:url(/assets/fonts/source-serif-4-var.woff2) format('woff2')}
@font-face{font-family:'Source Serif 4';font-style:italic;font-weight:400;font-display:swap;src:url(/assets/fonts/source-serif-4-italic-400.woff2) format('woff2')}
@font-face{font-family:'Work Sans';font-style:normal;font-weight:500 700;font-display:swap;src:url(/assets/fonts/work-sans-var.woff2) format('woff2')}
@font-face{font-family:'Delius';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/delius-400.woff2) format('woff2')}
@font-face{font-family:'IM Fell English';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/im-fell-english-normal-400.woff2) format('woff2')}
@font-face{font-family:'IM Fell English';font-style:italic;font-weight:400;font-display:swap;src:url(/assets/fonts/im-fell-english-italic-400.woff2) format('woff2')}
@font-face{font-family:'Unkempt';font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/unkempt-400.woff2) format('woff2')}
@font-face{font-family:'Unkempt';font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/unkempt-700.woff2) format('woff2')}
/* ===== lsd.fi: moderni sanomalehti =====
   Ladataan style.css:n jälkeen (views/header.php), jotta nämä tyylit ohittavat vanhat.
   Fontit isännöidään itse (lsd-fonts.css), koska sivuston CSP sallii vain 'self'. */

:root{
  --paper:#faf8f1; --card:#ffffff; --ink:#1c1b18; --muted:#6b665a; --red:#b73128; --teal:#4d7068; --peri:#899bff; --sun:#fbe7a1; --soft:#e2dccb; --sininen:#384FB4;
  --head:"Old Standard TT",Georgia,serif; --body:"Source Serif 4","IM Fell English",Georgia,serif; --ui:"Work Sans",Arial,sans-serif;
  --amor:url("/kuvat/rokkiamor-lapinakyva.png");
}

/* Pohja: vaalea paperi, väri näkyy kuvissa */
body{background:var(--paper);color:var(--ink);font-family:var(--body);line-height:1.6}
main,main.has-right{background:none!important;grid-template-columns:minmax(0,1fr) 290px;gap:0}
.center-col{background:transparent;display:flex;flex-direction:column;gap:22px;min-width:0;padding:22px 18px}
.right-col{background:var(--sininen)!important;border-left:0;padding:86px 16px 22px;display:block}
.right-col{position:relative}
/* Palkin laatikot (.pl-/.ep-/.pk-laatikko): ylämarginaali vain, jos edellä on näkyvä elementti. Ensimmäinen laatikko on kiinni Amorin alla (ei tyhjää väliä); muokkaustilassa kehyksen sisällä marginaali säilyy. */
.right-col > :not(link):not(style):not(script) ~ :is(.pl-laatikko,.ep-laatikko,.pk-laatikko,.card),
.palkki-kehys :is(.pl-laatikko,.ep-laatikko,.pk-laatikko){margin-top:1.4rem}
.right-col::before{content:"";position:absolute;top:6px;right:22px;width:84px;height:80px;background:var(--amor) center/contain no-repeat;transform:rotate(-4deg);filter:drop-shadow(0 2px 2px rgba(0,0,0,.25));pointer-events:none;z-index:1}   /* Amor ylärivin tilassa (padding-top 86px) ensimmäisen laatikon yläreunalla; seuraa laatikon paikkaa, ei peitä muokkaustilan ohjaimia */
/* Sivupalkin vuorottelu (mods/palkki_vuorottelu.js): sivut sticky-kehyksessä, vaihto häivyttäen; piilotetut sivut inert + aria-hidden (JS) */
.right-col .palkki-vuoro{position:sticky;top:16px;display:grid}
.right-col .palkki-vuoro>.palkki-sivu{grid-area:1/1;min-width:0;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility 0s linear .3s}
.right-col .palkki-vuoro>.palkki-sivu.on{opacity:1;visibility:visible;transition:opacity .3s ease}
.right-col .palkki-sivu>*+*{margin-top:1.4rem}
@media (min-width:769px){.mid.has-right{padding-right:0;padding-bottom:0}}   /* sininen palkki yltää oikeaan reunaan ja alas footeriin asti */
@media (max-width:768px){.mid.has-right .right-col{margin:0 -.75rem -1rem}}   /* puhelin: sininen palkki reunasta reunaan */

/* Ylin rivi: päiväys vasemmalla, kirjautumislinkit oikealla */
header{background:#fff}
.status-row{display:flex;align-items:center;gap:14px;padding:6px 16px;background:var(--ink)!important;color:#f1ede0!important;
  font:600 .72rem/1.2 var(--ui);letter-spacing:.14em;text-transform:uppercase}
.status-row::before{content:"Kerava · Perustettu 1991 · Rock’n’roll-lauluyhtye";margin-right:auto}
.status-row a{color:#fff;text-decoration:none;border:1px solid rgba(255,255,255,.55);border-radius:999px;padding:3px 12px;transition:background .15s,color .15s}
.status-row a:hover{background:#fff;color:var(--ink)}

/* Lehden nimi: logo koko leveydeltä, amori lähti seikkailemaan */
.header-row{display:block;padding:0;border-bottom:0;background:#fff}
.header-right{display:none!important}
.logo-row{width:100%}
.header-image-link{display:block}
.header-image-link img{display:block;width:100%;height:auto}

/* Osastopalkki (kirjautuminen on ylärivillä) */
.nav-bar{background:var(--red);border:0;padding:0 14px;gap:2px;display:flex;flex-wrap:wrap;align-items:stretch}
.nav-bar a{background:none;border:0;border-radius:0;box-shadow:none;color:#fff;font:700 .82rem/1 var(--ui);letter-spacing:.14em;text-transform:uppercase;padding:15px 16px;
  border-bottom:3px solid transparent;transition:border-color .12s,background .12s}
.nav-bar a:hover{background:rgba(0,0,0,.14);border-bottom-color:#fff}
.nav-bar a[href="/kirjautuminen"]{display:none}

/* Kortit ja palstat */
article.card,.lsd-uutiset,.lsd-sarjis,.lsd-ilm{background:transparent;border:0;border-top:3px solid var(--ink);border-radius:0;box-shadow:none;margin:0;padding:14px 0 6px}
article.card>header{display:block!important;margin:0 0 12px;padding:0;border:0}
article.card>header::before,article.tapahtuma::before{display:block;margin-bottom:6px;font:700 .7rem/1.2 var(--ui);letter-spacing:.2em;text-transform:uppercase;color:var(--red)}
article.tapahtuma::before{content:"Keikkapalsta"}
.center-col>article.card:last-child>header::before{content:"Erikoisliite · Bändiuutiset"}
article.card>header :is(h1,h2,h3,h4){margin:0;font:700 clamp(2rem,4.8vw,3rem)/1.02 var(--head);color:var(--ink);letter-spacing:-.01em}
article.tapahtuma h2{margin:0;font:700 1.5rem/1.1 var(--head);color:var(--ink)}

/* Juttujen teksti */
.lehti-content{display:grid;grid-template-columns:minmax(140px,190px) minmax(0,1fr);column-gap:24px;row-gap:0;align-items:start}
.lehti-content>*{grid-column:2;margin:0 0 .75em;max-width:none}
.lehti-content>p{font-size:1.04rem;text-align:left;hyphens:auto}
.lehti-content>h2,.lehti-content>h3,.lehti-content>p:first-child,.lehti-content>h2+p,.lehti-content>.lsd-uutiset,.lehti-content>.lsd-sarjis,.lehti-content>.lsd-ilm{grid-column:1/-1}
.lehti-content>p:first-child{font:italic 400 1.3rem/1.4 var(--head);padding-bottom:.7em;border-bottom:1px solid var(--soft)}
.lehti-content>h2{margin:1em 0 .7em;padding:.4em 0;border-top:3px double var(--ink);border-bottom:3px double var(--ink);text-align:center;font:700 .95rem/1.2 var(--ui);letter-spacing:.3em;text-transform:uppercase;color:var(--ink)}
.lehti-content>h2+p{font-style:italic;text-align:center;margin-bottom:1em}
.lehti-content>h3{margin:1.3em 0 .5em;padding-top:.55em;border-top:1px solid var(--soft);font:700 1.7rem/1.12 var(--head);color:var(--ink)}
.lehti-content>h3::after{content:"";display:block;width:2.2em;height:4px;background:var(--red);margin-top:.3em}
.lehti-content>h2+h3{margin-top:.2em;padding-top:0;border-top:0}
.lehti-content>hr{display:none}
.lehti-content>p:has(>img)+p::first-letter{float:left;font:700 3.5em/.8 var(--head);color:var(--red);padding:.06em .1em 0 0}

/* Kuvat väreissä */
.lehti-content>p:has(>img){grid-column:1;grid-row:span 8;margin:0}
.lehti-content>p:has(>img) img{display:block;width:100%;height:auto;border-radius:3px;border:1px solid var(--soft);box-shadow:0 6px 16px rgba(28,27,24,.14)}
.lehti-content>p:has(>img):nth-last-child(-n+2){grid-column:1/-1;grid-row:auto;margin:.8em 0 0}
.lehti-content>p:has(>img):nth-last-child(-n+2) img{width:auto;max-width:100%;margin:0 auto}
.lehti-content>.lsd-levymyynti{grid-column:1/-1;display:grid;grid-template-columns:minmax(180px,32%) minmax(0,1fr);gap:24px 32px;align-items:start;margin:0}   /* Tilaa levy: mainoskuva vasemmalla, tekstit oikealla; ≤640 px allekkain */
.lsd-levymyynti img{display:block;width:100%;max-width:100%;height:auto;border:1px solid var(--soft);box-shadow:0 6px 16px rgba(28,27,24,.14)}
.lsd-levymyynti-teksti{min-width:0;font-size:1.04rem}
.lsd-levymyynti-teksti>:first-child{margin-top:0}
.lsd-levymyynti-teksti>:last-child{margin-bottom:0}
.lsd-levymyynti-teksti>h3{margin:1.2em 0 .45em;padding-top:.5em;border-top:1px solid var(--soft);font:700 1.45rem/1.12 var(--head)}
.lsd-levymyynti-teksti>h3::after{content:"";display:block;width:2.2em;height:4px;background:var(--red);margin-top:.3em}
/* Levyjen historia (Tilaa levy -sivun alaosa, app/levyhistoria.php) */
.center-col>article.card:has(~ .lsd-levyhistoria)>header::before{content:"Erikoisliite · Bändiuutiset"}
.lsd-levyhistoria{border-top:3px solid var(--ink);padding:14px 0 6px;margin:0}
.lsd-levyhistoria .lu-kicker{font:700 .7rem/1.2 var(--ui);letter-spacing:.18em;text-transform:uppercase;color:var(--red);margin-bottom:6px}
.lsd-levyhistoria>h2{margin:0 0 .5rem;font:700 clamp(1.6rem,3.6vw,2.2rem)/1.05 var(--head);color:var(--ink)}
.levy{padding:1rem 0 .6rem;border-top:1px solid var(--soft)}
.levy h3{margin:0;font:700 1.45rem/1.15 var(--head);color:var(--ink)}
.levy-vuosi{margin-left:.4em;font:600 .9rem/1 var(--ui);letter-spacing:.12em;color:var(--red)}
.levy-meta{margin:.2rem 0 .7rem;font:600 .72rem/1.3 var(--ui);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.levy-kuvallinen{display:grid;grid-template-columns:minmax(120px,170px) minmax(0,1fr);column-gap:24px;align-items:start}
.levy-kuvallinen>*{grid-column:2;min-width:0}
.levy-kansi{display:block;width:100%;max-width:170px;height:auto;border:1px solid var(--soft);box-shadow:0 4px 12px rgba(28,27,24,.14)}
.levy-kuvallinen>.levy-kansi{grid-column:1;grid-row:1/span 8}
@media (max-width:640px){.levy-kuvallinen{display:block}.levy-kansi{max-width:140px;margin:0 0 .8rem}}
.levy-kappaleet{margin:0;padding-left:1.7rem}
.levy-kappaleet li{margin:0 0 .5rem;padding-left:.2rem}
.levy-nimi{font-weight:600}
.levy-tekijat,.levy-tarina{display:block;font-size:.9rem;line-height:1.4;color:var(--muted);overflow-wrap:anywhere}
.levy-rooli{font-weight:600}
.levy-sanoitus summary{cursor:pointer;font-size:.85rem;color:var(--red)}
/* ===== LSD-sanomat: paperiefekti (mods/lehtio.php: .paper-wrap > .paper = ylärivi + nimiplanssi + päivän painos + sarjakuva) ===== */
.paper-wrap{margin:56px 0 44px;padding:0 4px;filter:drop-shadow(0 10px 14px rgba(40,25,5,.35)) drop-shadow(0 2px 3px rgba(40,25,5,.3))}   /* varjo wrapperissa: mask leikkaisi box-shadowin */
.paper{
  --zz:9px;
  --paper-noise:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .35  0 0 0 0 .25  0 0 0 0 .1  0 0 0 .22 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  --paper-mask:
    conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/calc(var(--zz)*2) var(--zz) repeat-x,
    conic-gradient(from 135deg at top,#0000,#000 1deg 89deg,#0000 90deg) top/calc(var(--zz)*2) var(--zz) repeat-x,
    linear-gradient(#000,#000) center/100% calc(100% - var(--zz)*2) no-repeat;
  position:relative;padding:26px 26px 34px;color:#2a2118;background-color:#efe4c4;
  background-image:
    radial-gradient(ellipse at 50% 0%,rgba(255,250,230,.5),transparent 60%),
    radial-gradient(ellipse at 100% 100%,rgba(150,110,40,.22),transparent 55%),
    radial-gradient(ellipse at 0% 100%,rgba(150,110,40,.16),transparent 50%),
    var(--paper-noise);
  -webkit-mask:var(--paper-mask);mask:var(--paper-mask);
}
.paper::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 60px rgba(120,80,20,.25)}
.paper-strip{display:flex;justify-content:space-between;align-items:center;font:600 11px "Work Sans",Arial,sans-serif;letter-spacing:.16em;text-transform:uppercase;border-top:4px double #2a2118;border-bottom:1px solid #2a2118;padding:7px 2px;margin-bottom:4px}
.paper-strip .strip-mid{letter-spacing:.5em}
.paper > header{background:transparent;border:0;padding:6px 0 4px;margin:0;text-align:center}
.paper > header h2{font-family:"Old Standard TT",Georgia,serif;font-weight:700;font-size:clamp(34px,7.2vw,68px);line-height:1;letter-spacing:.01em;text-transform:none;text-align:center;margin:6px 0 10px;padding:0;background:transparent;border:0;color:#1f170e}
.paper > header::after{content:"";display:block;height:3px;margin-top:2px;border-top:1px solid #2a2118;border-bottom:4px solid #2a2118}
.paper .lehti-content>.lsd-uutiset{border-top:0;padding-top:10px}   /* nimiplanssin kaksoisviiva toimii erottimena */
.paper .lu-kicker{border-color:rgba(42,33,24,.45)}
/* Jutut ja pääjuttu suoraan paperin päällä (ei vaaleaa laikkua); läpikuultava tausta vain pikkuilmoituksilla ja kehystetyillä ilmoituksilla (alla) */
.paper .lehti-daily .lehti-story,
.paper .lehti-daily .lehti-lead{background-color:transparent}
/* Pikkuilmoitukset ja ilmoituslaatikot painettuina paperille: lehti_front.css:n .lehti-daily .lehti-flow>.lehti-luokka (valkoinen) ja .lehti-ad (paperinväri) ovat spesifisempiä kuin yllä oleva sääntö */
.paper .lehti-daily .lehti-flow>.lehti-luokka,
.paper .lehti-daily .lehti-flow>.lehti-ad,
.paper .lehti-luokka-lista .lehti-luokka{background-color:rgba(255,248,225,.3)}
.paper .lehti-comic img{box-sizing:border-box;border:1px solid #2a2118;box-shadow:0 2px 6px rgba(40,25,5,.3)}   /* sarjakuva kuin lehteen liimattu leike */
/* Lehden alatunniste (colophon): kaksoisviiva ylhäällä kuten nimiplanssin alla, pieni keskitetty teksti, ohut viiva alhaalla */
.paper-colophon{margin-top:22px;text-align:center}
.paper-colophon::before{content:"";display:block;height:3px;margin-bottom:10px;border-top:1px solid #2a2118;border-bottom:4px solid #2a2118}
.paper-colophon p{margin:0 0 4px;font:600 10px/1.5 "Work Sans",Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#2a2118}
.paper-colophon p:last-child{margin-bottom:0}
.paper-colophon::after{content:"";display:block;margin-top:10px;border-bottom:1px solid #2a2118}
@media (max-width:640px){.paper-colophon p{font-size:9px;letter-spacing:.08em}}
/* Pääjutun (vain .lehti-lead) jättikirjain: sama punainen tyyli kuin jäsenesittelyissä (.lehti-content>p:has(>img)+p) */
.lehti-lead .lehti-story-body>p:first-child::first-letter{float:left;font:700 3.5em/.8 var(--head);color:var(--red);padding:.06em .1em 0 0}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
#lehti-paperi{scroll-margin-top:12px}   /* sivupalkin LSD-Sanomat-mainoksen linkki /#lehti-paperi: paperin yläreuna jää ruudun yläreunan tuntumaan */
@media (max-width:640px){
  .paper{padding:16px 16px 28px}
  .paper-strip{flex-wrap:wrap;justify-content:space-between;gap:2px 10px;font-size:10px;letter-spacing:.1em}
  .paper-strip .strip-mid{display:none}
}
@media (max-width:640px){.lehti-content>.lsd-levymyynti{grid-template-columns:minmax(0,1fr)}.lsd-levymyynti img{max-width:320px}}

/* Facebook-palsta: oma pieni osio. Rokkiamor seisoo oikean palkin ensimmäisen laatikon päällä (.right-col::before, alla) */
.right-col .card{position:relative;background:var(--card);border:1px solid var(--soft);border-top:3px solid var(--ink);border-radius:0;box-shadow:0 6px 16px rgba(28,27,24,.08);padding:14px}
.right-col .card::before{content:"Facebook-palsta";display:block;margin:-4px 0 10px;padding-bottom:8px;border-bottom:1px solid var(--soft);font:700 .7rem/1.2 var(--ui);letter-spacing:.2em;text-transform:uppercase;color:var(--red)}

/* Alatunniste, amori kävelee reunalla */
.site-footer{position:relative;background:var(--sininen)!important;color:#f1ede0;border-top:4px solid var(--red)}
.site-footer::before{content:"";position:absolute;left:7%;top:-70px;width:70px;height:75px;background:var(--amor) center/contain no-repeat;transform:scaleX(-1) rotate(4deg);filter:drop-shadow(0 4px 3px rgba(0,0,0,.25))}
.site-footer h2,.site-footer h3,.site-footer h4{font:700 .8rem/1.2 var(--ui);text-transform:uppercase;letter-spacing:.18em;color:#fff;border-bottom:1px solid rgba(241,237,224,.35)}
.site-footer a{color:#f1ede0;text-underline-offset:3px}
.footer-grid{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.footer-col{min-width:0}
.footer-pic{display:block;max-width:100%;height:auto}
.footer-grid{padding-bottom:0}   /* mikin jalka alkaa suoraan alimman (mustan) rivin yläreunasta */
.footer-col:has(.footer-pic){align-self:end}
@media (min-width:701px){.footer-col:not(:has(.footer-pic)){padding-bottom:2rem}}
.footer-logout{margin:.3rem 0}
.footer-logout button{display:block;background:none;border:0;padding:0;margin:0;font:inherit;color:#fff;text-align:left;cursor:pointer}
.footer-logout button:hover,.footer-logout button:focus-visible{text-decoration:underline}
.footer-bottom{background:var(--ink);border-top:0;color:#f1ede0;overflow-wrap:anywhere}   /* alin rivi: musta tausta, vaalea teksti */
.footer-bottom a{display:inline;margin:0;color:#fff;text-decoration:underline;text-underline-offset:3px}
#ajankohtaiset,#lehti,#kokoonpano{scroll-margin-top:1rem}   /* "Tällä sivulla" -hypyt: otsikko ei jää reunaan kiinni */

/* ===== Etusivun jutut (lsd-uutiset.html) ===== */
.lsd-uutiset .lu-kicker,.lsd-sarjis .lu-kicker,.lsd-ilm .lu-kicker{font:700 .7rem/1.2 var(--ui);letter-spacing:.18em;text-transform:uppercase;color:var(--red);margin-bottom:6px}
.lsd-uutiset>.lu-kicker,.lsd-sarjis>.lu-kicker,.lsd-ilm>.lu-kicker{border-bottom:1px solid var(--soft);padding-bottom:8px;margin-bottom:14px}
.lsd-uutiset h3{margin:0 0 6px;border:0;padding:0;font:700 clamp(2rem,5.4vw,3.2rem)/1.02 var(--head);text-transform:uppercase;letter-spacing:-.01em;color:var(--ink)}
.lsd-uutiset h3::after{display:none}
.lsd-uutiset .lu-deck{font:italic 400 1.25rem/1.35 var(--head);text-align:left;margin:0 0 6px}
.lsd-uutiset .lu-by{font:600 .72rem/1.2 var(--ui);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);text-align:left;margin:0 0 12px;padding-bottom:10px;border-bottom:1px solid var(--soft)}
.lsd-uutiset .lu-lead{padding-bottom:8px;margin-bottom:16px;border-bottom:1px solid var(--ink)}
.lsd-uutiset .lu-lead>p:not(.lu-deck):not(.lu-by){column-width:17em;column-gap:28px;column-rule:1px solid var(--soft);hyphens:auto;margin:0 0 .6em}
.lsd-uutiset .lu-lead>p:nth-of-type(3)::first-letter{float:left;font:700 3.4em/.8 var(--head);color:var(--red);padding:.06em .1em 0 0}
.lsd-uutiset .lu-cols{column-width:15em;column-gap:30px;column-rule:1px solid var(--soft)}
.lsd-uutiset .lu-story,.lsd-uutiset .lu-box{break-inside:avoid;margin:0 0 22px}
.lsd-uutiset h4{margin:0 0 6px;font:700 1.35rem/1.12 var(--head);color:var(--ink)}
.lsd-uutiset .lu-story p,.lsd-uutiset .lu-box p{margin:0;font-size:1rem;hyphens:auto}
.lsd-uutiset .lu-box{border:2px solid var(--teal);background:#f0f5f3;padding:14px 16px;border-radius:4px}

/* ===== Sarjakuva (lsd-sarjakuva.html) ===== */
.lsd-sarjis h3{margin:0 0 12px;font:700 1.6rem/1.1 var(--head);border:0;padding:0}
.lsd-sarjis h3::after{display:none}
.lsd-sarjis .strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(126px,1fr));gap:10px}
.lsd-sarjis .panel{position:relative;min-height:230px;border:3px solid var(--ink);background:var(--bg,#fbe7a1);overflow:hidden;box-shadow:3px 3px 0 var(--ink)}
.lsd-sarjis .panel:nth-child(1){--bg:#dfe4ff}.lsd-sarjis .panel:nth-child(2){--bg:#fbe7a1}.lsd-sarjis .panel:nth-child(3){--bg:#d7efe6}
.lsd-sarjis .cap{position:absolute;left:0;top:0;right:28%;background:#fff;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);padding:4px 8px;font:700 .58rem/1.25 var(--ui);letter-spacing:.06em;text-transform:uppercase}
.lsd-sarjis .cap.low{top:auto;bottom:0;right:0;border-right:0;border-bottom:0;border-top:2px solid var(--ink);background:var(--ink);color:#fff}
.lsd-sarjis .hero{position:absolute;width:52%;aspect-ratio:1;background:var(--amor) center/contain no-repeat;right:4%;bottom:12%}
.lsd-sarjis .panel:nth-child(2) .hero{width:62%;right:auto;left:8%;bottom:10%;transform:rotate(-8deg)}
.lsd-sarjis .panel:nth-child(3) .hero{right:auto;left:2%;transform:scaleX(-1)}
.lsd-sarjis .bubble{position:absolute;background:#fff;border:2px solid var(--ink);border-radius:16px;padding:5px 8px;font:600 .7rem/1.25 var(--ui);max-width:70%}
.lsd-sarjis .bubble::after{content:"";position:absolute;bottom:-9px;left:22px;width:14px;height:14px;background:#fff;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:rotate(45deg) skew(10deg,10deg)}
.lsd-sarjis .b1{left:8%;top:48px}
.lsd-sarjis .b2{right:6%;top:42px}
.lsd-sarjis .b3{left:8%;top:46px}
.lsd-sarjis .b4{right:6%;top:116px}
.lsd-sarjis .b4::after{left:auto;right:20px}
.lsd-sarjis .sfx{position:absolute;right:8%;bottom:14%;font:700 1.6rem/1 var(--head);color:var(--red);transform:rotate(-10deg);letter-spacing:.04em;text-shadow:2px 2px 0 #fff}

/* ===== Pikkuilmoitukset ===== */
.lsd-ilm .ads{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.lsd-ilm .ad{border:2px dashed var(--ink);padding:12px 14px;background:#fff;font-size:.95rem;line-height:1.45}
.lsd-ilm .ad b{display:block;font:700 .72rem/1.2 var(--ui);letter-spacing:.16em;text-transform:uppercase;color:var(--red);margin-bottom:4px}
.lsd-ilm .ad i{display:block;margin-top:6px;font:600 .72rem/1.2 var(--ui);color:var(--muted);font-style:normal}

@media (max-width:640px){
  .lehti-content{display:block}
  .lehti-content>p:has(>img){max-width:230px;margin:0 0 .75em}
  .right-col{padding-top:90px}
  .status-row::before{content:"Kerava · Est. 1991"}
  .nav-bar a{padding:13px 11px;letter-spacing:.08em}
}

/* ===== Sovitukset tämän sivuston rakenteeseen (nav.css, header.css, forms.css) ===== */

/* Uloskirjautuminen ja tervehdys tummalla ylärivillä */
.status-row .logout-link{background:none;color:#fff;font:600 .72rem/1.2 var(--ui);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;
  border:1px solid rgba(255,255,255,.55);border-radius:999px;padding:3px 12px;transition:background .15s,color .15s}
.status-row .logout-link:hover{background:#fff;color:var(--ink)}

/* Pudotusvalikko: tumma paperi, ei vanhaa sinistä */
.has-sub>.sub-nav{background:var(--ink);border:0;border-top:3px solid #fff;border-radius:0;padding:4px 0;box-shadow:0 10px 24px rgba(0,0,0,.25)}
.sub-nav a{background:none;border:0;border-radius:0;color:#fff;padding:11px 16px;border-bottom:1px solid rgba(255,255,255,.12)}
.sub-nav a:hover{background:rgba(255,255,255,.12);border-bottom-color:rgba(255,255,255,.12)}
.nav-bar a.is-active{border-bottom-color:#fff;background:rgba(0,0,0,.14)}
.has-sub{align-items:stretch}
.has-sub>a{display:flex;align-items:center}

/* Alanavigaatio (aktiivisen osaston sivut) */
.subnav-row{background:var(--paper);border-bottom:1px solid var(--ink);box-shadow:0 1px 0 var(--soft)}
.sub-nav-inline{gap:.2rem 1.6rem;padding:.55rem 18px}
.sub-nav-inline a{font:600 .78rem/1.2 var(--ui);letter-spacing:.14em;text-transform:uppercase;color:var(--ink);padding:4px 0;border-bottom:2px solid transparent}
.sub-nav-inline a:hover{text-decoration:none;border-bottom-color:var(--red)}
.sub-nav-inline a.is-active{text-decoration:none;border-bottom-color:var(--red);color:var(--red)}

/* Lomakkeiden painikkeet lehden väreihin (aiemmin #0066cc) */
button,input[type=submit]{background:var(--ink);font-family:var(--ui);font-weight:600;letter-spacing:.06em;border-radius:0}
button:hover,input[type=submit]:hover{background:var(--red)}
a{color:var(--red)}
a:hover{color:var(--ink)}
.status-row a,.nav-bar a,.sub-nav a,.site-footer a,.footer-col a{color:inherit}
.nav-bar a,.sub-nav a{color:#fff}
.sub-nav-inline a{color:var(--ink)}
.sub-nav-inline a.is-active{color:var(--red)}
.status-row a{color:#fff}
.status-row a:hover{color:var(--ink)}
.site-footer a{color:#f1ede0}
.footer-col .cta-button{display:inline-block;border:1px solid rgba(241,237,224,.6);padding:.4rem .9rem;border-radius:0}

/* Mobiili: valikko tummalle pohjalle (aiemmin valkoinen, jolloin valkoinen teksti katosi) */
@media (max-width:768px){
  .nav-bar{padding:6px 14px}
  .main-nav{background:var(--ink);border-radius:0;box-shadow:none;padding:0}
  .main-nav a{padding:14px 12px;border-bottom:1px solid rgba(255,255,255,.12)}
  .has-sub>.sub-nav{background:rgba(255,255,255,.07);border:0;box-shadow:none;padding:0}
  .sub-nav a{padding-left:28px}
  .nav-btn{border-radius:0;border:0;font:700 .8rem/1 var(--ui);letter-spacing:.14em;text-transform:uppercase}
}

/* Otsikot muuallakin (lomakkeet, jäsensivut) lehden otsikkofontilla; vanha Unkempt ei enää lataudu */
h1,h2,h3{font-family:var(--head)}
.main-nav,.sub-nav-inline{font-family:var(--ui)}

/* Facebook-palsta (aiemmin mods/facebook.css, erillinen pyyntö) */
.facebook-iframe{width:100%;max-width:100%}
.facebook-iframe iframe{display:block;width:100%!important;max-width:100%;border:none}

/* Kaksipalstainen (kuva + teksti) asettelu vain sisällölle, jossa on kuvia; hallintalomakkeet ja taulukot saavat koko leveyden */
.lehti-content:not(:has(>p>img)){display:block}
/* Leveät taulukot ja lomakkeet vierittyvät sisältöpalstan sisällä, eivät koko sivua */
.center-col{overflow-x:auto;position:relative}

/* Korttien otsikot läpinäkyviksi (sivuston ylätunnisteen valkoinen tausta ei kuulu korteille) */
article.card>header{background:transparent}

/* Etusivun "Katso ja kuuntele": videot kolmessa sarakkeessa (tallennetun tekstin inline-tyyli), puhelimessa yksi sarake */
@media (max-width:560px){ul.klipit-3{grid-template-columns:minmax(0,1fr)!important}}

/* Etusivun ryhmäkuvat (p.kuva-koko): keskitetty koko palstan leveydelle (kuva luonnollisessa koossa), ei kapeaan sivupalstaan eikä puhelimessa 230 px:n rajaan */
.lehti-content>p.kuva-koko{grid-column:1/-1;grid-row:auto;max-width:none;margin:.8em 0 1.2em}
.lehti-content>p.kuva-koko img{display:block;width:auto;max-width:100%;height:auto;margin:0 auto}   /* luonnollinen koko (suht tarkka), keskitetty; kapealla näytöllä palstan levyinen */