/* ------------------------------------------------------------
   wc-2026 — alasivujen yhteinen tyylitiedosto (21.10.2026).
   Koottu hyväksytyn etusivun v9 lopullisista arvoista ilman
   v3–v8:n kerrostuneita ohituksia. Muuttujanimet vastaavat
   theme.jsonin --wp--preset--* -muuttujia. Etusivu-v9.html
   käyttää vielä omaa sisäistä tyyliään; sama sisältö.
   ------------------------------------------------------------ */
:root{
  /* graafinen opas 16.10.2026 */
  --wp--preset--color--ink:#131E27;          /* mustesininen: otsikot, tumma pinta */
  --wp--preset--color--blue:#395B73;         /* brändisininen: palveluotsakkeet */
  --wp--preset--color--steel:#527D9C;
  --wp--preset--color--deep:#2A4051;         /* jatkopalvelun otsake */
  --wp--preset--color--fog:#8FA8B8;          /* sumu */
  --wp--preset--color--pale-blue:#D2DBE2;
  --wp--preset--color--sand:#B7A68A;         /* hiekka */
  --wp--preset--color--light-sand:#D7CEBE;   /* vaalea hiekka, verkkojohdannainen */
  --wp--preset--color--pearl:#D4D0C8;        /* helmi */
  --wp--preset--color--petrol:#356B70;       /* petrooli: oppaat */
  --wp--preset--color--canvas:#F6F5F2;       /* paperi */
  --wp--preset--color--white:#FFFFFF;
  --wp--preset--color--line:#E2E1DC;
  --wp--preset--color--text:#3E4246;
  --wp--preset--color--muted:#5E6268;
  --wp--preset--color--on-dark:#EFEEE9;
  --wp--preset--color--on-dark-soft:#B4BEC7;
  --wp--preset--color--warm-on-dark:#E0D9C5;
  --wp--preset--color--gold:#CA9200;         /* tunnuskulta: painikkeet, viivat */
  --wp--preset--color--gold-hover:#E0AC2E;   /* kulta tummalla tekstinä */
  --wp--preset--color--gold-text:#8F6800;    /* kulta vaalealla tekstinä, ≥ 4,5:1 */
  --wp--preset--gradient--hero:linear-gradient(135deg,#527D9C 0%,#39586F 20%,#1F3242 55%,#101B24 100%);
  --wp--preset--gradient--band:linear-gradient(135deg,#3E5D75 0%,#2A4051 30%,#1B2A36 70%,#131E27 100%);

  --wp--preset--font-family--brand:"brother-1816",Arial,sans-serif;
  --wp--preset--font-size--small:clamp(.84rem,.82rem + .1vw,.9rem);
  --wp--preset--font-size--medium:clamp(1.06rem,1rem + .2vw,1.125rem);
  --wp--preset--font-size--large:clamp(1.1rem,1rem + .25vw,1.25rem);
  --wp--preset--font-size--x-large:clamp(1.7rem,1.35rem + 1vw,2.3rem);
  --wp--preset--font-size--xx-large:clamp(2.1rem,1.5rem + 1.8vw,3rem);
  --wp--preset--spacing--30:1rem;
  --wp--preset--spacing--40:1.5rem;
  --wp--preset--spacing--50:clamp(2rem,1.5rem + 1.5vw,3rem);
  --wp--preset--spacing--60:clamp(3rem,2rem + 3vw,5rem);
  --wp--preset--spacing--70:clamp(4rem,3rem + 3vw,6rem);
  --wp--style--global--content-size:44rem;
  --wp--style--global--wide-size:76rem;
  --gutter:clamp(1rem,4vw,3rem);
  --header-h:80px;
}

/* Perusta */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 1rem)}
body{margin:0;background:#fff;color:var(--wp--preset--color--text);font-family:var(--wp--preset--font-family--brand);font-weight:400;font-size:var(--wp--preset--font-size--medium);line-height:1.7;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
h1,h2,h3,h4{font-weight:300;color:var(--wp--preset--color--ink);line-height:1.15;letter-spacing:-.02em;margin:0 0 var(--wp--preset--spacing--40);text-wrap:balance}
h1{font-size:var(--wp--preset--font-size--xx-large);letter-spacing:-.035em}
h2{font-size:var(--wp--preset--font-size--x-large)}
h3{font-size:var(--wp--preset--font-size--large);line-height:1.3}
p{margin:0 0 var(--wp--preset--spacing--30)}
strong{font-weight:500;color:var(--wp--preset--color--ink)}
a{color:var(--wp--preset--color--ink);text-underline-offset:.2em;text-decoration-thickness:1px}
:focus-visible{outline:2px solid var(--wp--preset--color--gold);outline-offset:4px}
.wrap{width:min(var(--wp--style--global--wide-size),100% - 2*var(--gutter));margin-inline:auto}
.section{padding-block:var(--wp--preset--spacing--70)}
.is-canvas{background:var(--wp--preset--color--canvas)}
.lead{font-size:var(--wp--preset--font-size--large);line-height:1.55}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;z-index:50;background:#fff;padding:.5rem 1rem}

/* Osio-otsikko: viiva + versaali (v8) */
.kicker{font-size:clamp(1.05rem,1rem + .25vw,1.2rem);font-weight:400;line-height:1.45;letter-spacing:.09em;text-transform:uppercase;color:var(--wp--preset--color--gold-text);margin:0 0 1.25rem}
.kicker.has-line::before{content:"";display:inline-block;width:32px;height:3px;background:var(--wp--preset--color--gold);vertical-align:middle;margin-right:12px}
.on-dark .kicker{color:var(--wp--preset--color--gold-hover)}
.section-head{max-width:52rem;margin-bottom:var(--wp--preset--spacing--50)}
.section-head h2{margin-bottom:0}
.section-head p.section-description{font-size:clamp(1.15rem,1rem + .5vw,1.5rem);line-height:1.55;color:var(--wp--preset--color--ink);margin:0}
.section-head.split{max-width:none;display:flex;justify-content:space-between;align-items:end;gap:2rem}

/* Painikkeet ja linkit */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;padding:.95em 1.5em;font:inherit;font-weight:500;font-size:var(--wp--preset--font-size--small);letter-spacing:.02em;text-decoration:none;border:1px solid transparent;cursor:pointer;line-height:1.3;text-align:center}
.btn--primary{background:var(--wp--preset--color--gold);color:var(--wp--preset--color--ink)}
.btn--primary:hover{background:var(--wp--preset--color--gold-hover)}
.btn--outline{border-color:var(--wp--preset--color--ink);color:var(--wp--preset--color--ink);background:transparent}
.btn--outline:hover{background:var(--wp--preset--color--ink);color:#fff}
.on-dark .btn--outline{border-color:var(--wp--preset--color--on-dark);color:var(--wp--preset--color--on-dark)}
.on-dark .btn--outline:hover{background:var(--wp--preset--color--on-dark);color:var(--wp--preset--color--ink)}
.link-arrow{font-weight:500;text-decoration:none;border-bottom:1px solid var(--wp--preset--color--gold);padding-bottom:2px}
.link-arrow::after{content:" →";color:var(--wp--preset--color--gold-text)}
.link-arrow:hover{color:var(--wp--preset--color--gold-text)}
.on-dark .link-arrow{color:#fff}.on-dark .link-arrow::after{color:var(--wp--preset--color--gold-hover)}

/* Yläpalkki: kiinteä, tumma lasipinta */
.site-header{position:fixed;inset:0 0 auto;z-index:20;background:rgba(19,30,39,.92);backdrop-filter:blur(12px)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;min-height:var(--header-h)}
.site-logo img{height:36px;width:auto}
.nav{display:flex;align-items:center;gap:clamp(1rem,2vw,2rem);font-size:var(--wp--preset--font-size--small)}
.nav a{color:var(--wp--preset--color--on-dark);text-decoration:none;font-weight:500}
.nav a:hover,.nav a[aria-current]{color:var(--wp--preset--color--gold-hover)}
.header-actions{display:flex;align-items:center;gap:1rem}
.nav-mobile{display:none}
.nav-mobile summary{list-style:none;cursor:pointer;color:var(--wp--preset--color--on-dark);font-size:.8rem;font-weight:500;padding:.5rem .25rem}
.nav-mobile summary::-webkit-details-marker{display:none}
.nav-mobile .panel{position:absolute;left:0;right:0;top:100%;background:var(--wp--preset--color--ink);padding:.5rem var(--gutter) 1.25rem;display:grid}
.nav-mobile .panel a{padding:.75rem 0;border-bottom:1px solid rgba(239,238,233,.1);color:var(--wp--preset--color--on-dark);text-decoration:none}
main{padding-top:var(--header-h)}

/* Murupolku */
.crumbs{font-size:var(--wp--preset--font-size--small);color:var(--wp--preset--color--muted);margin:0 0 1.5rem}
.crumbs a{color:inherit;text-decoration:none;border-bottom:1px solid currentColor}
.crumbs span[aria-hidden]{margin-inline:.5rem;opacity:.6}
.on-dark .crumbs{color:var(--wp--preset--color--on-dark-soft)}

/* Tummat pinnat */
.on-dark{color:var(--wp--preset--color--on-dark)}
.on-dark h1,.on-dark h2,.on-dark h3{color:#fff}
.is-hero{background:var(--wp--preset--gradient--hero)}
.is-band{background:var(--wp--preset--gradient--band)}

/* Tumma nauha: tekstinosto, valinnainen kuva oikealla (IT-ruori) */
.band .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,26rem);gap:clamp(2rem,5vw,5rem);align-items:center;padding-block:var(--wp--preset--spacing--60)}
.band.is-text .wrap{grid-template-columns:minmax(0,52rem)}
.band p{font-size:clamp(1.3rem,1.1rem + .8vw,1.7rem);line-height:1.5;color:#fff;letter-spacing:-.01em}
.band p.warm{color:var(--wp--preset--color--warm-on-dark)}
.band figure{margin:0}
.ruori-open{display:block;position:relative;width:100%;padding:0;border:0;background:none;cursor:zoom-in}
.ruori-zoom{position:absolute;right:0;bottom:0;font-size:.8rem;letter-spacing:.06em;color:var(--wp--preset--color--on-dark);background:rgba(19,30,39,.8);padding:.35rem .7rem}

/* Palvelukortti (v8–v9) */
.services{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem}
.services.is-two{grid-template-columns:repeat(2,minmax(0,1fr))}
.service{background:#fff;border:1px solid var(--wp--preset--color--pearl);border-top:7px solid var(--wp--preset--color--gold);display:flex;flex-direction:column}
.service-title{background:var(--wp--preset--color--blue);padding:1.75rem 2rem;min-height:9rem;display:flex;flex-direction:column;justify-content:flex-start}
.service-title h3{color:#fff;margin:0;font-size:clamp(1.5rem,2vw,1.85rem);line-height:1.25}
.service-title .sub{color:var(--wp--preset--color--on-dark);font-size:.9rem;margin:.6rem 0 0}
.service.is-continuation .service-title{background:var(--wp--preset--color--deep)}
.service-body{padding:1.75rem 2rem 2rem;display:flex;flex-direction:column;flex:1}
.service-body p{margin:0 0 1.75rem;font-size:1rem}
.service-body .link-arrow{align-self:flex-start;margin-top:auto}

/* Asiakaskommentit */
.quotes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--wp--preset--spacing--50)}
.quote{margin:0}
.quote svg{width:30px;height:24px;fill:var(--wp--preset--color--gold);margin-bottom:1rem}
.quote blockquote{margin:0 0 1.25rem}
.quote blockquote p{color:var(--wp--preset--color--ink);font-size:var(--wp--preset--font-size--large);line-height:1.5;margin:0}
.quote figcaption{font-size:var(--wp--preset--font-size--small);line-height:1.45}
.quote figcaption strong{display:block}
.quote figcaption a{display:inline-block;margin-top:.6rem}
.quote:first-child{border-left:3px solid var(--wp--preset--color--gold);padding-left:1.5rem}

/* Oppaat: petroolinauha */
.guide-band{background:var(--wp--preset--color--petrol);color:#fff}
.guide-band .kicker,.guide-band h2,.guide-band h3,.guide-band p,.guide-band .link-arrow{color:#fff}
.guide-band .link-arrow::after{color:#fff}
.guide-feature{display:grid;grid-template-columns:150px minmax(0,1fr);gap:2rem;align-items:center}
.guide-feature img{width:150px}
.guide-feature h2{font-size:clamp(1.5rem,1.2rem + 1vw,2.1rem);margin-bottom:.75rem}

/* Lopun kehote */
.closing .wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:var(--wp--preset--spacing--60);align-items:end;padding-top:var(--wp--preset--spacing--60)}
.closing figure{margin:0}
.closing figure img{width:100%;aspect-ratio:900/1200}
.closing-text{align-self:center;padding-bottom:var(--wp--preset--spacing--60)}
.closing .contact{margin-top:var(--wp--preset--spacing--40);display:flex;flex-wrap:wrap;gap:.5rem 1.75rem;font-size:var(--wp--preset--font-size--small)}
.closing .contact a{color:#fff}

/* Alapalkki */
.site-footer{background:var(--wp--preset--color--ink);color:var(--wp--preset--color--on-dark-soft);font-size:var(--wp--preset--font-size--small)}
.site-footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;padding-block:1.75rem 3rem;border-top:1px solid rgba(239,238,233,.1)}
.site-footer a{color:var(--wp--preset--color--on-dark);text-decoration:none}
.site-footer nav{display:flex;gap:1.5rem;flex-wrap:wrap}

/* Kuvadialogi */
dialog.image-dialog{width:min(1000px,calc(100% - 2rem));max-height:94vh;padding:1.5rem;border:1px solid var(--wp--preset--color--line);overflow:hidden}
dialog.image-dialog::backdrop{background:rgba(13,24,34,.75);backdrop-filter:blur(4px)}
dialog.image-dialog img{margin:0 auto;width:auto;max-width:100%;max-height:calc(94vh - 3rem);object-fit:contain;cursor:zoom-out}
.dialog-close{position:absolute;top:1rem;right:1rem;background:#fff;border:1px solid var(--wp--preset--color--pearl);padding:.6rem 1rem;font:inherit;cursor:pointer}
body:has(dialog[open]){overflow:hidden}

/* ============ PALVELUSIVU ============ */
.page-hero .wrap{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(2rem,5vw,5rem);align-items:center;padding-block:var(--wp--preset--spacing--60)}
.page-hero .question{font-size:clamp(1.25rem,1.1rem + .6vw,1.6rem);line-height:1.45;color:var(--wp--preset--color--warm-on-dark);margin-bottom:1.5rem}
.page-hero .lead{color:var(--wp--preset--color--on-dark);font-size:1.15rem;line-height:1.65}
.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.5rem;margin-top:2rem}
.at-a-glance{background:#fff;color:var(--wp--preset--color--text);border-top:7px solid var(--wp--preset--color--gold);padding:2rem}
.at-a-glance h2{font-size:.95rem;font-weight:500;letter-spacing:.09em;text-transform:uppercase;color:var(--wp--preset--color--gold-text);margin-bottom:1.25rem}
.at-a-glance dl{margin:0;display:grid;gap:1.1rem}
.at-a-glance dt{font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--wp--preset--color--muted)}
.at-a-glance dd{margin:.15rem 0 0;color:var(--wp--preset--color--ink);font-size:1rem;line-height:1.55}

.fit{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--wp--preset--spacing--60);align-items:start}
.fit-list{background:var(--wp--preset--color--light-sand);padding:2rem 2.25rem}
.fit-list h3{font-size:1.2rem;margin-bottom:1rem}
.fit-list p{color:var(--wp--preset--color--ink);margin:0}
.fit-list ul{margin:0;padding:0;list-style:none;display:grid;gap:.6rem}
.fit-list li{padding-left:1.4rem;position:relative;color:var(--wp--preset--color--ink);line-height:1.5}
.fit-list li::before{content:"";position:absolute;left:0;top:.65em;width:.6rem;height:2px;background:var(--wp--preset--color--gold-text)}

.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.5rem;counter-reset:step}
.steps li{counter-increment:step;border-top:1px solid var(--wp--preset--color--pearl);padding-top:1.5rem;position:relative}
.steps li::before{content:counter(step);display:grid;place-items:center;width:40px;height:40px;border-radius:50%;border:1px solid var(--wp--preset--color--gold);color:var(--wp--preset--color--gold-text);font-weight:500;margin-bottom:1.25rem;background:#fff}
.steps h3{font-size:1.25rem;margin-bottom:.6rem}
.steps.is-six{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:2.5rem}
.steps.is-six h3{font-size:1.2rem;margin:0}
.steps p{font-size:1rem;margin:0}

.deliverables{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem}
.deliverables li{background:#fff;border-top:3px solid var(--wp--preset--color--blue);padding:1.5rem 1.75rem}
.deliverables strong{display:block;font-weight:400;font-size:1.2rem;line-height:1.35;margin-bottom:.5rem}
.deliverables p{font-size:.95rem;margin:0;color:var(--wp--preset--color--muted)}
.deliverables li.is-next{background:var(--wp--preset--color--deep);border-top-color:var(--wp--preset--color--gold);display:flex;flex-direction:column;justify-content:space-between;gap:1rem}
.deliverables li.is-next strong,.deliverables li.is-next p{color:#fff}
.deliverables li.is-next .link-arrow{color:#fff;align-self:flex-start}
.deliverables li.is-next .link-arrow::after{color:var(--wp--preset--color--gold-hover)}

.path{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;font-size:var(--wp--preset--font-size--small);margin-bottom:2rem}
.path span{padding:.35rem .8rem;border:1px solid var(--wp--preset--color--pearl);color:var(--wp--preset--color--muted)}
.path span.is-current{background:var(--wp--preset--color--blue);border-color:var(--wp--preset--color--blue);color:#fff}
.path i{font-style:normal;color:var(--wp--preset--color--gold-text)}

/* ============ ARTIKKELISIVU ============ */
.article-head{background:var(--wp--preset--color--canvas);padding-block:var(--wp--preset--spacing--60) 0}
.article-head .wrap{max-width:60rem}
.article-head h1{font-size:clamp(2rem,1.4rem + 1.2vw,2.5rem);line-height:1.2;margin-bottom:1.25rem}
.article-head .standfirst{font-size:var(--wp--preset--font-size--large);line-height:1.55;color:var(--wp--preset--color--ink);max-width:46rem}
.byline{display:flex;align-items:center;gap:1rem;font-size:var(--wp--preset--font-size--small);color:var(--wp--preset--color--muted);margin:2rem 0 0;padding-bottom:var(--wp--preset--spacing--50)}
.byline img{width:48px;height:48px;border-radius:50%;object-fit:cover;object-position:top;background:var(--wp--preset--color--pale-blue)}
.byline strong{display:block;font-weight:500}
.article-figure{margin:0;background:linear-gradient(var(--wp--preset--color--canvas) 50%,#fff 50%)}
.article-figure .wrap{max-width:60rem}
.article-figure img{width:100%;aspect-ratio:16/9;object-fit:cover}
.article-figure figcaption{font-size:.85rem;color:var(--wp--preset--color--muted);margin-top:.6rem}

.article-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,var(--wp--style--global--content-size)) minmax(0,1fr);gap:0 3rem;padding-block:var(--wp--preset--spacing--50) var(--wp--preset--spacing--60)}
.article-layout>.prose{grid-column:2}
.toc{grid-column:3;grid-row:1;align-self:start;position:sticky;top:calc(var(--header-h) + 2rem);font-size:.9rem;max-width:17rem}
.toc summary{list-style:none;font-size:.85rem;font-weight:500;letter-spacing:.09em;text-transform:uppercase;color:var(--wp--preset--color--gold-text);margin-bottom:1rem}
.toc summary::-webkit-details-marker{display:none}
.toc ol{margin:0;padding:0;list-style:none;border-left:1px solid var(--wp--preset--color--pearl)}
.toc a{display:block;padding:.35rem 0 .35rem 1rem;margin-left:-1px;border-left:2px solid transparent;text-decoration:none;color:var(--wp--preset--color--muted);line-height:1.4}
.toc a:hover,.toc a.is-active{color:var(--wp--preset--color--ink);border-left-color:var(--wp--preset--color--gold)}

.prose{font-size:1.125rem;line-height:1.75;color:var(--wp--preset--color--text)}
.prose>*{margin-block:0 1.25rem}
.prose h2{font-size:clamp(1.6rem,1.3rem + 1vw,2.1rem);margin-top:3.25rem;line-height:1.2}
.prose h3{font-size:1.35rem;margin-top:2.25rem;font-weight:400}
.prose ul,.prose ol{padding-left:1.4rem}
.prose li{margin-bottom:.4rem}
.prose li::marker{color:var(--wp--preset--color--gold-text)}
.prose a{color:var(--wp--preset--color--blue);text-decoration-color:var(--wp--preset--color--gold)}
.prose a:hover{color:var(--wp--preset--color--ink)}
.prose figure{margin:2.25rem 0}
.prose figcaption{font-size:.85rem;color:var(--wp--preset--color--muted);margin-top:.5rem}
.prose blockquote{margin:2rem 0;padding-left:1.5rem;border-left:3px solid var(--wp--preset--color--gold);font-size:1.3rem;line-height:1.5;color:var(--wp--preset--color--ink)}
.prose .intro-list{list-style:none;padding:1.25rem 1.5rem;background:var(--wp--preset--color--canvas);border-left:3px solid var(--wp--preset--color--blue)}
.prose .intro-list li{margin:0;padding:.2rem 0;color:var(--wp--preset--color--ink)}
.prose .excerpt-note{font-size:.9rem;color:var(--wp--preset--color--muted);border-top:1px dashed var(--wp--preset--color--pearl);padding-top:1rem}

/* Artikkelin sisään upotettava opasnosto (Convert Pro -lomakkeen paikka) */
.inline-guide{display:grid;grid-template-columns:96px minmax(0,1fr);gap:1.5rem;align-items:center;background:var(--wp--preset--color--petrol);color:#fff;padding:1.75rem;margin:2.5rem 0}
.inline-guide img{width:96px}
.inline-guide p{margin:0 0 .75rem;color:#fff;font-size:1rem;line-height:1.55}
.inline-guide .label{font-size:.8rem;letter-spacing:.09em;text-transform:uppercase;margin-bottom:.4rem;color:#fff}
.inline-guide strong{color:#fff;font-size:1.2rem;font-weight:400;display:block;margin-bottom:.4rem}
.inline-guide .link-arrow{color:#fff}.inline-guide .link-arrow::after{color:#fff}

/* Artikkelin lopun palvelunosto */
.service-cta{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1.5rem 2rem;align-items:center;border:1px solid var(--wp--preset--color--pearl);border-top:7px solid var(--wp--preset--color--gold);padding:2rem;margin:3rem 0 0;background:#fff}
.service-cta .kicker{font-size:.85rem;margin-bottom:.5rem}
.service-cta h2{font-size:1.6rem;margin:0 0 .6rem}
.service-cta p{margin:0;font-size:1rem}
.service-cta .btn{white-space:nowrap}

.author{display:grid;grid-template-columns:88px minmax(0,1fr);gap:1.25rem;align-items:start;margin-top:3rem;padding-top:2rem;border-top:1px solid var(--wp--preset--color--line)}
.author img{width:88px;height:88px;border-radius:50%;object-fit:cover;object-position:top;background:var(--wp--preset--color--pale-blue)}
.author p{font-size:1rem;margin:0 0 .5rem}
.author strong{font-weight:500}

.tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:2rem}
.tags a{font-size:.85rem;text-decoration:none;padding:.3rem .75rem;border:1px solid var(--wp--preset--color--pearl);color:var(--wp--preset--color--ink)}
.tags a:hover{border-color:var(--wp--preset--color--gold)}

.related{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem}
.related article{background:#fff;border-top:3px solid var(--wp--preset--color--blue);padding:1.5rem 1.75rem;display:flex;flex-direction:column}
.related .meta{font-size:.8rem;color:var(--wp--preset--color--muted);margin-bottom:.75rem}
.related h3{font-size:1.25rem;line-height:1.35;margin-bottom:1.25rem}
.related h3 a{text-decoration:none}
.related h3 a:hover{text-decoration:underline;text-decoration-color:var(--wp--preset--color--gold)}
.related .link-arrow{margin-top:auto;align-self:flex-start;font-size:.9rem}

.reading-progress{position:fixed;left:0;top:var(--header-h);height:3px;width:0;background:var(--wp--preset--color--gold);z-index:19}

/* ============ Responsiivisuus ============ */
@media (max-width:1200px){
  .article-layout{grid-template-columns:minmax(0,1fr) minmax(0,var(--wp--style--global--content-size)) minmax(0,15rem)}
  .article-layout>.spacer{display:none}
}
@media (max-width:1000px){
  .services,.services.is-two{grid-template-columns:1fr}
  .band .wrap,.page-hero .wrap,.fit{grid-template-columns:1fr}
  .band figure{max-width:24rem;margin-inline:auto}
  .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .deliverables,.related{grid-template-columns:1fr 1fr}
  .article-layout{grid-template-columns:minmax(0,var(--wp--style--global--content-size));justify-content:center}
  .article-layout>.prose{grid-column:1}
  .toc{grid-column:1;grid-row:1;position:static;max-width:none;margin-bottom:2rem;background:var(--wp--preset--color--canvas);padding:1rem 1.25rem}
  .toc summary{margin:0;cursor:pointer}
  .toc summary::after{content:" +";}
  .toc[open] summary::after{content:" −"}
  .toc[open] ol{margin-top:1rem}
}
@media (max-width:900px){
  :root{--header-h:64px}
  .nav{display:none}
  .nav-mobile{display:block}
  .site-header .wrap{position:relative;gap:.75rem}
  .site-logo img{height:26px}
  .site-header .btn{padding:.7em 1em;font-size:.75rem}
  .closing .wrap{grid-template-columns:1fr}
  .closing figure{order:2;max-width:380px;margin-inline:auto}
  .closing-text{padding-bottom:0}
  .quotes{grid-template-columns:1fr}
  .section-head.split{flex-direction:column;align-items:flex-start}
}
@media (max-width:640px){
  .steps,.deliverables,.related{grid-template-columns:1fr}
  .service-title{min-height:0;padding:1.5rem}
  .service-body{padding:1.5rem}
  .at-a-glance,.fit-list{padding:1.5rem}
  .guide-feature{grid-template-columns:96px minmax(0,1fr);gap:1.25rem}
  .guide-feature img{width:96px}
  .inline-guide{grid-template-columns:72px minmax(0,1fr);gap:1rem;padding:1.25rem}
  .inline-guide img{width:72px}
  .service-cta{grid-template-columns:1fr;padding:1.5rem}
  .service-cta .btn{white-space:normal}
  .prose{font-size:1.06rem}
  .article-head{padding-top:2.5rem}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Video (21.10.2026): kevyt upotus. YouTube-soitin (youtube.com/embed) ladataan vasta
   painalluksesta, joten Googlen evästeet ja skriptit eivät lataudu sivun mukana.
   youtube-nocookie.com antoi Safarissa toistovirheen. Kansikuva omasta mediakirjastosta. */
.video-feature{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:clamp(2rem,4vw,4rem);align-items:center}
.video-feature h2{font-size:clamp(1.6rem,1.3rem + 1vw,2.2rem)}
.video{position:relative;aspect-ratio:16/9;background:var(--wp--preset--gradient--band);border:0;padding:0;width:100%;cursor:pointer;overflow:hidden;display:block;color:#fff;font:inherit;text-align:left}
.video img{width:100%;height:100%;object-fit:cover}
.video .play{position:absolute;left:clamp(1.25rem,4%,2.25rem);bottom:clamp(1.25rem,7%,2.25rem);width:clamp(56px,6vw,72px);height:clamp(56px,6vw,72px);border-radius:50%;background:var(--wp--preset--color--gold);display:grid;place-items:center;transition:transform .2s;z-index:2}
/* Kansikuva: videon nimi ja rajattu henkilökuva liukuvärin päällä */
.video .poster{position:absolute;inset:0;display:block}
.video .poster img{position:absolute;right:-4%;bottom:0;width:auto;height:96%;object-fit:contain;object-position:right bottom}
.video .poster-title{position:absolute;left:clamp(1.25rem,4%,2.25rem);top:clamp(1.25rem,9%,2.5rem);width:52%;font-weight:300;font-size:clamp(1.25rem,.9rem + 1.3vw,2.1rem);line-height:1.2;letter-spacing:-.02em;color:#fff;z-index:1}
.video .poster-kicker{display:block;font-size:.72rem;font-weight:400;letter-spacing:.14em;text-transform:uppercase;color:var(--wp--preset--color--gold-hover);margin-bottom:.6rem}
.video .play::after{content:"";border-style:solid;border-width:12px 0 12px 20px;border-color:transparent transparent transparent var(--wp--preset--color--ink);margin-left:5px}
.video:hover .play,.video:focus-visible .play{transform:scale(1.08)}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.rating{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.rating .stars{color:var(--wp--preset--color--gold);letter-spacing:.1em;font-size:1.05rem}
@media(max-width:900px){.video-feature{grid-template-columns:1fr}}
@media(max-width:520px){.video .poster-kicker{display:none}.video .poster-title{font-size:1.1rem;width:56%}.video .play{width:48px;height:48px}}

/* ============ MINUSTA / CV (21.10.2026) ============ */
.deliverables.is-four{grid-template-columns:repeat(4,minmax(0,1fr))}
.deliverables.is-four li{background:var(--wp--preset--color--canvas)}
.industries{margin-top:var(--wp--preset--spacing--50)}
.industries .label{font-size:.85rem;letter-spacing:.06em;text-transform:uppercase;color:var(--wp--preset--color--muted);margin:0}
.industries .tags{margin-top:.75rem}
.tags span{font-size:.9rem;padding:.3rem .75rem;border:1px solid var(--wp--preset--color--pearl);color:var(--wp--preset--color--ink);background:#fff}
.band .link-arrow{display:inline-block;margin-top:.5rem}
.band figure.speaker img{width:100%;aspect-ratio:3/2;object-fit:cover}
.band figure.speaker figcaption{font-size:.85rem;color:var(--wp--preset--color--on-dark-soft);margin-top:.6rem}
/* Aikajana: vuodet vasemmalla, kultainen pallo pystyviivalla */
.timeline{list-style:none;margin:0;padding:0;max-width:56rem}
.timeline li{display:grid;grid-template-columns:9rem minmax(0,1fr);gap:0 2.5rem;position:relative;padding-bottom:2.25rem}
.timeline li::before{content:"";position:absolute;left:calc(9rem + 1.25rem - 1px);top:.45rem;bottom:0;width:1px;background:var(--wp--preset--color--pearl)}
.timeline li:last-child::before{display:none}
.timeline li>div{position:relative}
.timeline li>div::before{content:"";position:absolute;left:calc(-1.25rem - 6px);top:.4rem;width:11px;height:11px;border-radius:50%;background:#fff;border:2px solid var(--wp--preset--color--gold)}
.timeline .years{margin:0;font-weight:500;color:var(--wp--preset--color--gold-text);font-size:1rem;text-align:right}
.timeline h3{font-size:1.25rem;margin:0 0 .2rem}
.timeline .org{margin:0 0 .5rem;color:var(--wp--preset--color--muted);font-size:.95rem}
.timeline li p:last-child{margin-bottom:0}
/* Sertifioinnit ryhmittäin */
.certs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.5rem}
.certs section{border-top:3px solid var(--wp--preset--color--blue);padding-top:1.25rem}
.certs h3{font-size:1.1rem;margin:0 0 1rem}
.certs ul{list-style:none;margin:0;padding:0;display:grid;gap:1rem}
.certs strong{font-weight:500;color:var(--wp--preset--color--ink);font-size:.98rem;line-height:1.4}
.certs .year{display:inline-block;margin-left:.5rem;font-size:.8rem;color:var(--wp--preset--color--gold-text)}
.certs p{margin:.2rem 0 0;font-size:.88rem;line-height:1.5;color:var(--wp--preset--color--muted)}
@media (max-width:1000px){.deliverables.is-four,.certs{grid-template-columns:1fr 1fr}}
@media (max-width:640px){
  .deliverables.is-four,.certs{grid-template-columns:1fr}
  .timeline li{grid-template-columns:1fr;padding-left:1.75rem}
  .timeline li::before{left:.3rem;top:.45rem}
  .timeline li>div::before{left:calc(-1.75rem + .3rem - 6px)}
  .timeline .years{text-align:left;margin-bottom:.25rem}
  .timeline .years::before{content:"";position:absolute;left:0;top:.35rem;width:11px;height:11px;border-radius:50%;background:#fff;border:2px solid var(--wp--preset--color--gold)}
  .timeline li>div::before{display:none}
}
#sertifioinnit .section-head h2{margin-bottom:1rem}
.certs li{line-height:1.4}
/* CV: tiiviimpi nauha ja kommentit pitkille teksteille (Niklas 21.10.2026) */
.band.is-compact p{font-size:var(--wp--preset--font-size--large);line-height:1.55}
.quotes.is-compact .quote blockquote p{font-size:var(--wp--preset--font-size--medium);line-height:1.65}
#tyohistoria .section-head h2.kicker{margin:0}
.nowrap{white-space:nowrap}
