/* /kirjoituksia ja kirjoitussivut /kirjoituksia/<kirjoitus> (siirretty sivun <style>-lohkosta 26.10.2026). */
.top{padding:clamp(44px,7vw,88px) 0 clamp(34px,4vw,54px)}
.top h1{font-size:clamp(2.4rem,5.6vw,4.2rem);max-width:12em;font-variation-settings:"SOFT" 0,"WONK" 1;letter-spacing:-.025em}
.top .eyebrow{margin-bottom:clamp(22px,3.5vw,34px)}
.top .intro{max-width:30em;margin-top:clamp(26px,3.5vw,38px);color:var(--muted)}
.index{border-top:1px solid var(--rule2);margin-top:clamp(38px,5vw,60px)}
.index a,.index .dead{display:grid;grid-template-columns:3.2em 1fr auto;gap:clamp(14px,2.5vw,30px);align-items:baseline;padding:20px 8px 20px 0;border-bottom:1px solid var(--rule);color:var(--ink);transition:padding-left .22s cubic-bezier(.4,0,.2,1)}
.index a:hover{padding-left:12px;color:var(--green);text-decoration:none}
.index .no{font-size:11.5px;letter-spacing:.12em;color:var(--muted);font-variant-numeric:tabular-nums}
.index .ti{font-family:Fraunces,Georgia,serif;font-size:clamp(1.1rem,1.9vw,1.5rem);line-height:1.25;letter-spacing:-.018em}
.index .dead{color:var(--muted)}
.index .dead .ti{color:var(--muted)}
article{border-top:1px solid var(--rule);padding:clamp(56px,9vw,110px) 0 0;scroll-margin-top:20px}
@media(max-width:640px){.index a,.index .dead{grid-template-columns:2.6em 1fr;gap:4px 12px}.index a .meta,.index .dead .avoin{grid-column:2}}
.head{display:flex;justify-content:space-between;align-items:baseline;gap:24px;flex-wrap:wrap;margin-bottom:clamp(30px,4vw,48px)}
.body{max-width:32em;margin:0 auto}
.lede{font-family:Fraunces,Georgia,serif;font-size:clamp(1.65rem,3.4vw,2.65rem);line-height:1.2;letter-spacing:-.025em;font-variation-settings:"SOFT" 0,"WONK" 1;margin-bottom:1.1em}
.lede span{display:block}
.body p{font-size:clamp(1.02rem,1.2vw,1.12rem)}
.body p+p{margin-top:1.05em}
.body p.knock{font-family:Fraunces,Georgia,serif;font-size:clamp(1.3rem,2.2vw,1.7rem);line-height:1.3;letter-spacing:-.018em;margin:1.35em 0}
.calc{margin:1.7em 0;padding:1.4em 0;border-top:1px solid var(--rule2);border-bottom:1px solid var(--rule2)}
.calc p{font-size:clamp(1rem,1.15vw,1.06rem);line-height:1.55}
.calc p+p{margin-top:1em}
.calc b{font-weight:500;font-variant-numeric:tabular-nums}
.body p.end{margin-top:1.35em;font-family:Fraunces,Georgia,serif;font-size:clamp(1.3rem,2.2vw,1.7rem);line-height:1.3;letter-spacing:-.018em;color:var(--green)}
.huomio{max-width:33em;margin-top:clamp(26px,3.4vw,38px);border:1px solid var(--rule2);padding:clamp(18px,2.4vw,24px) clamp(20px,2.8vw,28px);font-size:16px;line-height:1.65;color:var(--muted)}
.huomio .eyebrow{margin-bottom:12px}
.huomio p+p{margin-top:.9em}
.huomio a{color:var(--green);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.2em;text-decoration-color:color-mix(in srgb,var(--green) 40%,transparent)}
.body .huomio p:not(.eyebrow){font-size:16px}
.body .huomio .eyebrow{font-size:11.5px}
.body h3{font-family:Fraunces,Georgia,serif;font-size:clamp(1.2rem,1.85vw,1.46rem);letter-spacing:-.016em;line-height:1.24;margin:2em 0 .45em}
/* KONVERSIO (Joel 26.10.2026, L1): hiljainen tekstilinkki jokaisen kirjoituksen loppuun (lukijat
   pysähtyvät usein puoliväliin, ja sivun ainoa kehote on vasta lopussa). Ei banneria. */
.kloppu + .sig{margin-top:clamp(14px,2vw,22px)}
.sig{margin-top:clamp(34px,4vw,48px);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:baseline}
.sig a{display:inline-flex;align-items:center;min-height:44px}
@media(max-width:520px){.top{padding:32px 0 30px}.top h1{font-size:clamp(1.95rem,8.2vw,2.4rem)}.top .eyebrow{margin-bottom:16px}.top .intro{margin-top:22px}.index{margin-top:30px}.index a,.index .dead{padding:17px 0}article{padding-top:48px}.head{margin-bottom:26px}.lede{font-size:1.5rem;margin-bottom:1.15em}.body p.knock{font-size:1.24rem;margin:1.9em 0}.body p.end{font-size:1.24rem;margin-top:1.9em}.body h3{font-size:1.18rem;margin:2.2em 0 .5em}.calc{margin:2.1em 0;padding:1.5em 0}.sig{margin-top:34px}.close{padding-top:48px}}
/* Infopallot — portattu hintasivulta (Mittasuhde-osio 19.8.2026) */
.info{position:relative;display:inline-flex;vertical-align:baseline;margin-left:5px}
.info .dot{display:inline-flex;align-items:center;justify-content:center;width:12px;height:12px;border-radius:50%;border:1px solid var(--edge,#C9C4B6);font-family:Inter,system-ui,sans-serif;font-size:8px;font-style:italic;line-height:1;color:var(--muted);text-decoration:none;transform:translateY(-1px);background:none;padding:0;cursor:pointer}
.info.open .dot{background:var(--green);border-color:var(--green);color:var(--paper)}
@media(hover:hover){.info .dot:hover{background:var(--green);border-color:var(--green);color:var(--paper)}.info:hover .tip{opacity:1;pointer-events:auto}}
.info .tip{position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%);white-space:nowrap;background:var(--ink);color:var(--paper);font-size:12px;letter-spacing:.01em;padding:6px 10px;opacity:0;pointer-events:none;transition:opacity .14s ease;z-index:5}
.info .dot:focus-visible+.tip,.info.open .tip{opacity:1;pointer-events:auto}
.info .tip a{color:var(--paper);text-decoration:underline;text-underline-offset:.18em}
.info .tip--wide{white-space:normal;width:min(340px,74vw);text-align:left;line-height:1.5;font-size:11.5px;padding:11px 13px}
.ex .hit+.row{margin-top:.9em}
.tip-close{display:none}
@media print{.info{display:none}}
@media(hover:none){.info .dot{width:22px;height:22px;font-size:12px}}
@media(max-width:560px){.info .dot{width:20px;height:20px;font-size:11px;transform:translateY(-2px)}.info .tip,.info .tip--wide{position:fixed;left:14px;right:14px;bottom:14px;top:auto;transform:none;width:auto;max-width:none;white-space:normal;text-align:left;font-size:13px;line-height:1.55;padding:15px 17px 15px 17px;padding-right:46px;z-index:200;max-height:calc(100dvh - 28px);overflow-y:auto;overscroll-behavior:contain}.tip-close{display:flex;position:absolute;top:4px;right:4px;width:36px;height:36px;align-items:center;justify-content:center;background:none;border:0;color:var(--paper);font-size:15px;line-height:1;padding:0;cursor:pointer}}
/* kirjoituksen oma sivu (Joel 26.10.2026) */
.kirjoitus-sivu .takaisin{padding-top:clamp(18px,3vw,30px)}
.kirjoitus-sivu .takaisin a{display:inline-flex;align-items:center;gap:.35em;min-height:44px;font-size:16px;color:var(--muted);text-decoration:underline;text-decoration-color:var(--rule2);text-underline-offset:3px}
.kirjoitus-sivu .takaisin a:hover{color:var(--ink);text-decoration-color:currentColor}
.kirjoitus-sivu article{border-top:0;padding-top:clamp(14px,2.4vw,30px)}
.sig .seuraava{display:flex;flex-direction:column;align-items:flex-end;gap:2px;text-align:right;min-height:44px;color:var(--ink);text-decoration:none}
.sig .seuraava .meta{color:var(--muted)}
.sig .seuraava .seur-ti{font-family:Fraunces,Georgia,serif;font-size:clamp(1.05rem,1.6vw,1.2rem);line-height:1.3;letter-spacing:-.012em;max-width:22em}
.sig .seuraava:hover .seur-ti{color:var(--green)}