/* TTM Factory etusivu ilman Elementoria (wordpress/etusivu). Ladataan vain etusivulla ja testisivulla (mu-plugin ttm-etusivu.php).
   Ilme yhtenäinen muun sivuston kanssa: tumma #0f1114 / #15181d, punainen #e51b24, terävät kulmat, painokkaat otsikot. */

.ttm-etu, .ttm-etu-arvostelut { --puna: #e51b24; --tumma: #0f1114; --teksti: #15181d; --harmaa: #596473; --pohja: #f3f5f7; }
.ttm-etu *, .ttm-etu *::before, .ttm-etu *::after { box-sizing: border-box; }
.ttm-etu { color: var(--teksti); font-size: 17px; line-height: 1.6; }
.ttm-etu p { margin: 0 0 14px; }

/* Täysleveät osiot sisältöalueen sisältä */
.ttm-etu-hero, .ttm-etu-osio, .ttm-etu .ttm-home-guides { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }
.ttm-etu-sisa { max-width: 1180px; margin: 0 auto; padding: 0 24px; }
.ttm-etu-kapea { max-width: 820px; }
.ttm-etu-osio { padding: 80px 0; }

.ttm-etu-kicker { display: inline-block; color: var(--puna); font-size: 13px; font-weight: 900; text-transform: uppercase; letter-spacing: 1.8px; margin-bottom: 10px; }
.ttm-etu-otsikko { color: var(--teksti); font-size: clamp(28px, 3.6vw, 42px); line-height: 1.05; font-weight: 900; letter-spacing: -0.8px; margin: 0 0 22px; }
.ttm-etu-korostus { font-weight: 800; }

.ttm-etu-napit { display: flex; flex-wrap: wrap; gap: 12px; }
.ttm-etu-nappi { display: inline-flex; align-items: center; justify-content: center; min-height: 50px; padding: 0 24px; font-size: 14px; font-weight: 900; text-transform: uppercase; letter-spacing: 0.9px; text-decoration: none !important; border: 2px solid transparent; transition: background .2s ease, color .2s ease, border-color .2s ease; }
.ttm-etu-nappi--puna { background: var(--puna); color: #fff !important; }
.ttm-etu-nappi--puna:hover { background: #fff; color: var(--tumma) !important; border-color: var(--tumma); }
.ttm-etu-nappi--reuna { border-color: #fff; color: #fff !important; }
.ttm-etu-nappi--reuna:hover { background: #fff; color: var(--tumma) !important; }
.ttm-etu-nappi:focus-visible { outline: 3px solid var(--puna); outline-offset: 3px; }

/* Yläosa */
.ttm-etu-hero { position: relative; min-height: clamp(460px, 64vh, 640px); display: flex; align-items: flex-end; background: var(--tumma); overflow: hidden; margin-top: 0; }
.ttm-etu-hero__kuva { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% 40%; }
.ttm-etu-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(15,17,20,.92) 0%, rgba(15,17,20,.72) 42%, rgba(15,17,20,.15) 100%); }
.ttm-etu-hero__sisus { position: relative; z-index: 1; width: 100%; max-width: 1180px; margin: 0 auto; padding: 72px 24px 64px; color: #fff; }
.ttm-etu-hero h1 { max-width: 720px; color: #fff; font-size: clamp(38px, 6vw, 72px); line-height: 0.98; font-weight: 900; letter-spacing: -1.8px; margin: 0 0 18px; }
.ttm-etu-hero__ingressi { max-width: 560px; color: #e6e8eb; font-size: clamp(18px, 2vw, 22px); line-height: 1.4; margin: 0 0 28px !important; }
.ttm-etu-hero { border-bottom: 5px solid var(--puna); }
.ttm-etu-hero .ttm-etu-kicker { background: var(--puna); color: #fff; padding: 5px 10px; margin-bottom: 18px; }
.ttm-etu-luotto { list-style: none; margin: 30px 0 0; padding: 18px 0 0; border-top: 1px solid rgba(255,255,255,.18); display: flex; flex-wrap: wrap; gap: 8px 28px; color: #e6e8eb; font-size: 15px; font-weight: 700; }
.ttm-etu-luotto li { margin: 0; display: flex; align-items: center; gap: 8px; }
.ttm-etu-luotto li:not(:first-child)::before { content: ""; width: 6px; height: 6px; background: var(--puna); flex: none; }
.ttm-etu-luotto__tahdet { color: #fbbc04; letter-spacing: 1px; }

/* Ikonit: ohut punainen viiva */
.ttm-etu svg { width: 34px; height: 34px; flex: none; fill: none; stroke: var(--puna); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* Kaksi polkua yläosassa: huolto ja varaosat */
.ttm-etu-polut { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; max-width: 980px; margin-top: 8px; }
.ttm-etu-polku-kortti { background: #fff; color: var(--teksti); border-top: 5px solid var(--puna); padding: 24px; display: flex; flex-direction: column; gap: 8px; }
.ttm-etu-polku-kortti__laji { color: var(--puna); font-size: 12px; font-weight: 900; text-transform: uppercase; letter-spacing: 1.6px; }
.ttm-etu-polku-kortti h2 { margin: 0; color: var(--teksti); font-size: 26px; line-height: 1.1; font-weight: 900; }
.ttm-etu-polku-kortti p { margin: 0; font-size: 16px; line-height: 1.5; color: #3d4652; }
.ttm-etu-polku-kortti .ttm-etu-nappi { margin-top: auto; }
.ttm-etu-polku-kortti p + .ttm-etu-nappi { margin-top: 10px; }
.ttm-etu-vapaa b { color: #1d8148; }
.ttm-etu-pieni { font-size: 15px !important; }
.ttm-etu-pieni a { color: var(--teksti); font-weight: 700; }

/* Merkkirivi */
.ttm-etu-merkit { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); background: var(--pohja); padding: 22px 0; }
.ttm-etu-merkit .ttm-etu-sisa { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 28px; }
.ttm-etu-merkit b { font-size: 16px; }
.ttm-etu-merkit__lista { font-size: 17px; font-weight: 900; letter-spacing: 1px; text-transform: uppercase; color: #3d4652; }

/* Palvelukortit */
.ttm-etu-palvelut__kortit { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.ttm-etu-kortti { display: flex; flex-direction: column; gap: 10px; padding: 24px; background: #fff; border: 1px solid #e3e7ec; border-top: 3px solid var(--puna); color: var(--teksti) !important; text-decoration: none !important; transition: transform .2s ease, box-shadow .2s ease; }
.ttm-etu-kortti:hover { transform: translateY(-3px); box-shadow: 0 16px 34px rgba(15,17,20,.12); }
.ttm-etu-kortti h3 { margin: 4px 0 0; font-size: 20px; line-height: 1.15; font-weight: 900; color: var(--teksti); }
.ttm-etu-kortti h3::after { content: " →"; color: var(--puna); }
.ttm-etu-kortti p { margin: 0; font-size: 15px; line-height: 1.5; color: #3d4652; }
.ttm-etu-kortti:focus-visible { outline: 3px solid var(--puna); outline-offset: 3px; }

/* Asiointipolku */
.ttm-etu-polku { background: var(--pohja); }
.ttm-etu-polku .ttm-etu-otsikko { margin-bottom: 32px; }
.ttm-etu-polku__nappi { margin-top: 28px; }
.ttm-etu-polku__vaiheet { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; counter-reset: vaihe; }
.ttm-etu-polku__vaiheet li { position: relative; counter-increment: vaihe; margin: 0; padding: 26px 16px 22px; background: #fff; border-top: 3px solid var(--puna); display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; font-weight: 800; line-height: 1.3; }
.ttm-etu-polku__vaiheet li::before { content: counter(vaihe); position: absolute; top: 10px; left: 12px; font-size: 13px; font-weight: 900; color: var(--harmaa); }
.ttm-etu-polku__vaiheet li:not(:last-child)::after { content: "→"; position: absolute; right: -14px; top: 50%; transform: translateY(-50%); z-index: 1; color: var(--puna); font-weight: 900; font-size: 18px; }

/* Oppaat (siirretty Elementorin HTML-lohkosta sellaisenaan, margin säädetty) */
.ttm-home-guides { background: #0f1114; border-top: 5px solid #e51b24; padding: 76px 24px; margin-top: 0; margin-bottom: 0; }
.ttm-home-guides * { box-sizing: border-box; }
.ttm-home-guides-inner { max-width: 1180px; margin: 0 auto; }
.ttm-guides-header { max-width: 760px; margin-bottom: 40px; }
.ttm-kicker { display: inline-block; color: #e51b24; font-size: 13px; font-weight: 900; text-transform: uppercase; letter-spacing: 1.8px; margin-bottom: 10px; }
.ttm-guides-header h2 { color: #fff; font-size: clamp(34px, 5vw, 58px); line-height: 0.98; font-weight: 900; letter-spacing: -1.8px; margin: 0 0 16px; }
.ttm-guides-header p { color: #d8d8d8; font-size: 19px; line-height: 1.55; margin: 0; }
.ttm-guides-grid { display: grid; grid-template-columns: 1.35fr 1fr 1fr; gap: 24px; }
.ttm-guide-card { display: flex; flex-direction: column; min-height: 100%; background: #181b20; border-top: 3px solid #e51b24; color: #fff; text-decoration: none !important; overflow: hidden; transition: transform 0.2s ease, box-shadow 0.2s ease; }
.ttm-guide-card:hover { transform: translateY(-4px); box-shadow: 0 22px 48px rgba(0, 0, 0, 0.34); }
.ttm-guide-featured { grid-row: span 2; }
.ttm-guide-image { overflow: hidden; background: #111; }
.ttm-guide-image img { width: 100%; height: 210px; display: block; object-fit: cover; transition: transform 0.25s ease; }
.ttm-guide-featured .ttm-guide-image img { height: 430px; }
.ttm-guide-card:hover .ttm-guide-image img { transform: scale(1.04); }
.ttm-guide-content { padding: 24px 24px 26px; display: flex; flex-direction: column; flex: 1; }
.ttm-guide-tag { display: inline-block; align-self: flex-start; color: #e51b24; font-size: 12px; font-weight: 900; text-transform: uppercase; letter-spacing: 1.4px; margin-bottom: 12px; }
.ttm-guide-content h3 { color: #fff; font-size: 22px; line-height: 1.08; font-weight: 900; letter-spacing: -0.5px; margin: 0 0 12px; }
.ttm-guide-featured .ttm-guide-content h3 { font-size: 34px; line-height: 1.02; }
.ttm-guide-content p { color: #cfcfcf; font-size: 16px; line-height: 1.55; margin: 0 0 22px; }
.ttm-guide-link { margin-top: auto; display: inline-flex; align-self: flex-start; background: #e51b24; color: #fff; padding: 12px 16px; font-size: 13px; font-weight: 900; text-transform: uppercase; letter-spacing: 0.8px; }
.ttm-guide-card:hover .ttm-guide-link { background: #fff; color: #111; }
.ttm-guides-footer { margin-top: 34px; display: flex; justify-content: center; }
.ttm-guides-button { display: inline-block; background: transparent; color: #fff !important; border: 1px solid #3a3f48; padding: 15px 24px; text-decoration: none !important; font-size: 14px; font-weight: 900; text-transform: uppercase; letter-spacing: 1px; transition: 0.2s ease; }
.ttm-guides-button:hover { background: #e51b24; border-color: #e51b24; color: #fff !important; }


/* Oppaat: kolme tasakokoista korttia */
.ttm-guides-grid--kolme { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.ttm-guides-footer { gap: 12px; flex-wrap: wrap; }

/* Loppuosio */
.ttm-etu-loppu__ruudukko { display: grid; grid-template-columns: 1.3fr 1fr; gap: 48px; align-items: center; }
.ttm-etu-loppu p { max-width: 560px; }
.ttm-etu-nappi--tumma-reuna { border-color: var(--teksti); color: var(--teksti) !important; }
.ttm-etu-nappi--tumma-reuna:hover { background: var(--teksti); color: #fff !important; }
.ttm-etu-yhteys { font-style: normal; display: flex; flex-direction: column; gap: 6px; padding: 26px; border: 1px solid #e3e7ec; border-top: 3px solid var(--puna); }
.ttm-etu-yhteys b { font-size: 18px; }
.ttm-etu-yhteys a { color: var(--teksti); font-weight: 700; }
.ttm-etu-nappi, .ttm-etu-kortti, .ttm-guide-card { cursor: pointer; touch-action: manipulation; }

/* Arvostelut (lyhytkoodi [ttm_reviews] tuo oman sisältönsä) */
.ttm-etu-arvostelut { padding: 24px 0 72px; }

@media (max-width: 1024px) {
  .ttm-guides-grid:not(.ttm-guides-grid--kolme) { grid-template-columns: 1fr 1fr; }
  .ttm-guide-featured { grid-column: 1 / -1; grid-row: auto; }
  .ttm-guide-featured .ttm-guide-image img { height: 360px; }
  .ttm-etu-polku__vaiheet { grid-template-columns: repeat(3, 1fr); }
  .ttm-etu-polku__vaiheet li:nth-child(3)::after { display: none; }
}
@media (max-width: 860px) {
  .ttm-etu-osio { padding: 56px 0; }
  .ttm-etu-polut, .ttm-etu-loppu__ruudukko { grid-template-columns: 1fr; gap: 14px; }
  .ttm-etu-palvelut__kortit { grid-template-columns: 1fr 1fr; }
  .ttm-guides-grid--kolme { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
  .ttm-etu-hero { min-height: 520px; }
  .ttm-etu-hero::after { background: linear-gradient(180deg, rgba(15,17,20,.35) 0%, rgba(15,17,20,.85) 55%, rgba(15,17,20,.95) 100%); }
  .ttm-etu-hero__sisus { padding: 48px 20px 40px; }
  .ttm-etu-napit .ttm-etu-nappi { flex: 1 1 100%; }
  .ttm-etu-palvelut__kortit { grid-template-columns: 1fr; }
  .ttm-etu-polku-kortti { padding: 20px; }
  .ttm-etu-luotto { flex-direction: column; gap: 8px; font-size: 14px; margin-top: 24px; }
  .ttm-etu-sisa { padding: 0 20px; }
  .ttm-etu-polku__vaiheet { grid-template-columns: 1fr; gap: 10px; }
  .ttm-etu-polku__vaiheet li { flex-direction: row; text-align: left; padding: 16px 18px 16px 44px; }
  .ttm-etu-polku__vaiheet li::before { top: 50%; transform: translateY(-50%); left: 16px; }
  .ttm-etu-polku__vaiheet li::after { display: none; }
  .ttm-etu svg { width: 28px; height: 28px; }
  .ttm-home-guides { padding: 54px 20px; }
  .ttm-guides-grid { grid-template-columns: 1fr; gap: 22px; }
  .ttm-guide-image img, .ttm-guide-featured .ttm-guide-image img { height: 230px; }
  .ttm-guide-content h3, .ttm-guide-featured .ttm-guide-content h3 { font-size: 23px; line-height: 1.08; }
  .ttm-guides-header p { font-size: 17px; }
  .ttm-guides-button { width: 100%; text-align: center; }
}
@media (prefers-reduced-motion: reduce) { .ttm-etu * { transition: none !important; } }

/* Varaosat-sivu (wordpress/varaosat/sisalto.html) */
.ttm-vo-hero { background: var(--tumma); color: #fff; border-bottom: 5px solid var(--puna); padding: 72px 0; }
.ttm-vo-hero__ruudukko { display: grid; grid-template-columns: 1.05fr 1fr; gap: 56px; align-items: center; }
.ttm-vo-hero h1 { color: #fff; font-size: clamp(36px, 5.4vw, 64px); line-height: 1; font-weight: 900; letter-spacing: -1.6px; margin: 0 0 18px; }
.ttm-vo-hero .ttm-etu-kicker { background: var(--puna); color: #fff; padding: 5px 10px; margin-bottom: 18px; }
.ttm-vo-hero__ingressi { color: #e6e8eb; font-size: clamp(18px, 2vw, 21px); line-height: 1.45; max-width: 560px; }
.ttm-vo-toimitus { display: inline-flex; align-items: center; gap: 10px; margin: 6px 0 24px !important; padding: 8px 14px; border: 1px solid rgba(255,255,255,.35); font-weight: 800; color: #fff; }
.ttm-vo-toimitus::before { content: ""; width: 8px; height: 8px; background: #2fbf6b; flex: none; }
.ttm-vo-hero__nappi { min-height: 58px; padding: 0 30px; font-size: 16px; }
.ttm-vo-hero__omat { margin: 16px 0 0 !important; color: #c9ced4; font-size: 15px; }
.ttm-vo-hero__omat a { color: #fff; font-weight: 700; }
.ttm-vo-toimittajat__otsikko { display: block; color: #c9ced4; font-size: 13px; font-weight: 900; text-transform: uppercase; letter-spacing: 1.6px; margin-bottom: 12px; }
.ttm-vo-toimittajat ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ttm-vo-toimittajat li { margin: 0; height: 92px; background: #fff; display: flex; align-items: center; justify-content: center; padding: 16px 22px; }
.ttm-vo-toimittajat li.ttm-vo-tumma { background: #1c2027; border: 1px solid #2c313a; }
.ttm-vo-toimittajat img { max-width: 100%; max-height: 54px; width: auto; height: auto; display: block; object-fit: contain; }
.ttm-vo-ryhmat { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.ttm-vo-ryhmat .ttm-etu-kortti h3 { font-size: 18px; }
.ttm-vo-vaiheet { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; counter-reset: vo; }
.ttm-vo-vaiheet li { counter-increment: vo; margin: 0; background: #fff; border-top: 3px solid var(--puna); padding: 24px; display: flex; flex-direction: column; gap: 8px; }
.ttm-vo-vaiheet li::before { content: counter(vo); font-size: 28px; font-weight: 900; color: var(--puna); line-height: 1; }
.ttm-vo-vaiheet b { font-size: 19px; }
.ttm-vo-vaiheet span { color: #3d4652; font-size: 15px; line-height: 1.5; }
.ttm-vo-wp { background: var(--tumma); color: #e6e8eb; }
.ttm-vo-wp .ttm-etu-otsikko { color: #fff; }
.ttm-vo-wp__ruudukko { display: grid; grid-template-columns: 320px 1fr; gap: 56px; align-items: center; }
.ttm-vo-wp__logo { background: #1c2027; padding: 32px; display: flex; align-items: center; justify-content: center; aspect-ratio: 4 / 3; }
.ttm-vo-wp__logo img { width: 100%; max-width: 250px; height: auto; display: block; }
.ttm-etu-nappi--valkoinen-reuna { border-color: #fff; color: #fff !important; margin-top: 8px; }
.ttm-etu-nappi--valkoinen-reuna:hover { background: #fff; color: var(--tumma) !important; }
@media (max-width: 1024px) { .ttm-vo-ryhmat { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 860px) {
  .ttm-vo-hero__ruudukko, .ttm-vo-wp__ruudukko { grid-template-columns: 1fr; gap: 32px; }
  .ttm-vo-vaiheet { grid-template-columns: 1fr; }
  .ttm-vo-wp__logo { max-width: 340px; }
}
@media (max-width: 680px) {
  .ttm-vo-hero { padding: 44px 0; }
  .ttm-vo-hero__nappi { width: 100%; }
  .ttm-vo-toimittajat li { height: 76px; padding: 12px 16px; }
  .ttm-vo-toimittajat img { max-height: 44px; }
  .ttm-vo-ryhmat { grid-template-columns: 1fr; }
}
.ttm-vo-merkit { padding-top: 8px; }
.ttm-vo-merkit__lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; }
.ttm-vo-merkit__lista li { margin: 0; height: 96px; display: flex; align-items: center; justify-content: center; padding: 16px 22px; background: #fff; border: 1px solid #e3e7ec; }
.ttm-vo-merkit__lista li.ttm-vo-tumma { background: #1c2027; border-color: #1c2027; }
.ttm-vo-merkit__lista img { max-width: 100%; max-height: 52px; width: auto; height: auto; object-fit: contain; display: block; }
@media (max-width: 860px) { .ttm-vo-merkit__lista { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 480px) { .ttm-vo-merkit__lista { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ttm-vo-merkit__lista li { height: 76px; } }

/* ===== Pehmeämpi ilme (10/2026): pyöristetyt kulmat, punainen vain toiminnoissa, syvyys varjolla ===== */
.ttm-etu, .ttm-etu-arvostelut { --r-iso: 18px; --r-kortti: 14px; --r-nappi: 10px; --varjo: 0 1px 2px rgba(15,17,20,.06), 0 8px 24px rgba(15,17,20,.08); --varjo-hover: 0 2px 4px rgba(15,17,20,.08), 0 18px 40px rgba(15,17,20,.14); }

.ttm-etu-nappi { border-radius: var(--r-nappi); text-transform: none; letter-spacing: .1px; font-size: 16px; font-weight: 800; }
.ttm-etu-nappi--puna:hover { background: #c8141c; color: #fff !important; border-color: transparent; }
.ttm-etu-kicker { letter-spacing: 1.2px; }
.ttm-etu-hero .ttm-etu-kicker, .ttm-vo-hero .ttm-etu-kicker { border-radius: 999px; padding: 6px 12px; }

/* Yläosan polkukortit: lasimainen vaalea kortti, ei punaista yläreunaa */
.ttm-etu-polku-kortti { border-top: 0; border-radius: var(--r-iso); box-shadow: 0 20px 50px rgba(0,0,0,.35); padding: 26px; }
.ttm-etu-polku-kortti__laji { display: inline-flex; align-self: flex-start; align-items: center; gap: 6px; background: #fdecec; color: #b3141b; padding: 4px 10px; border-radius: 999px; letter-spacing: .8px; }
.ttm-etu-luotto { border-top-color: rgba(255,255,255,.14); }
.ttm-etu-luotto li:not(:first-child)::before { border-radius: 50%; }
.ttm-etu-hero { border-bottom: 0; }

/* Merkkirivi */
.ttm-etu-merkit { background: #fff; border-bottom: 1px solid #eef1f4; }
.ttm-etu-merkit__lista { color: #59606b; }

/* Kortit: ei viivaa ylhäällä, pyöristys + varjo, ikoni pehmeässä neliössä */
.ttm-etu-kortti { border: 1px solid #edf0f3; border-top: 1px solid #edf0f3; border-radius: var(--r-kortti); box-shadow: var(--varjo); padding: 26px; }
.ttm-etu-kortti:hover { transform: translateY(-3px); box-shadow: var(--varjo-hover); border-color: #e3e7ec; }
.ttm-etu-kortti svg { width: 26px; height: 26px; padding: 11px; box-sizing: content-box; background: #fdecec; border-radius: 12px; }
.ttm-etu-kortti h3::after { content: ""; }
.ttm-etu-kortti h3 { display: flex; justify-content: space-between; gap: 10px; }

/* Asiointipolku: numeropallot ja ohut yhdysviiva korttien sijaan */
.ttm-etu-polku { background: #f6f7f9; }
.ttm-etu-polku__vaiheet li { background: #fff; border-top: 0; border-radius: var(--r-kortti); box-shadow: var(--varjo); padding: 22px 16px 20px; }
.ttm-etu-polku__vaiheet li::before { position: static; order: -1; display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; background: var(--teksti); color: #fff; font-size: 13px; transform: none; }
.ttm-etu-polku__vaiheet li:not(:last-child)::after { right: -13px; width: 10px; content: ""; height: 2px; background: #d6dbe1; }
.ttm-etu-polku__vaiheet svg { width: 30px; height: 30px; }

/* Oppaat: pyöristetyt kortit, kuva yläreunassa */
.ttm-home-guides { border-top: 0; }
.ttm-guide-card { border-top: 0; border-radius: var(--r-kortti); }
.ttm-guide-link { border-radius: 8px; }
.ttm-guides-button { border-radius: var(--r-nappi); }

/* Loppuosio ja yhteystiedot */
.ttm-etu-yhteys { border: 0; border-radius: var(--r-kortti); background: #f6f7f9; }

/* Varaosat-sivu */
.ttm-vo-hero { border-bottom: 0; }
.ttm-vo-toimitus { border-radius: 999px; }
.ttm-vo-toimitus::before { border-radius: 50%; }
.ttm-vo-toimittajat li, .ttm-vo-merkit__lista li { border-radius: 12px; }
.ttm-vo-merkit__lista li { border-color: #edf0f3; box-shadow: var(--varjo); }
.ttm-vo-vaiheet li { border-top: 0; border-radius: var(--r-kortti); box-shadow: var(--varjo); }
.ttm-vo-vaiheet li::before { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; background: #fdecec; color: #b3141b; font-size: 16px; }
.ttm-vo-wp__logo { border-radius: var(--r-iso); }

@media (max-width: 680px) {
  .ttm-etu-polku__vaiheet li { padding: 14px 16px; gap: 12px; }
  .ttm-etu-polku__vaiheet li::before { position: static; transform: none; }
}

@font-face { font-family: "TTM Saira"; font-style: italic; font-weight: 600 900; font-display: swap; src: url("fontit/saira-italic-latin.woff2") format("woff2"); }

/* ===== Omannäköinen ilme (10/2026): kapea otsikkofontti, kuvat, liike, vinot reunat ===== */
.ttm-etu { --otsikko: "TTM Saira", "Arial", sans-serif; --vino: 4vw; }

.ttm-etu-hero h1, .ttm-vo-hero h1 { font-family: var(--otsikko) !important; font-style: italic; font-weight: 800; text-transform: uppercase; letter-spacing: -.5px; line-height: .92; font-size: clamp(46px, 7.2vw, 96px); }
.ttm-etu-otsikko, .ttm-guides-header h2 { font-family: var(--otsikko) !important; font-weight: 800; text-transform: uppercase; letter-spacing: 0; line-height: .98; font-size: clamp(34px, 4.4vw, 56px); }
.ttm-etu-polku-kortti h2, .ttm-etu-kortti h3, .ttm-guide-content h3, .ttm-vo-vaiheet b, .ttm-etu-polku__vaiheet span { font-family: var(--otsikko) !important; font-weight: 700; letter-spacing: .2px; }
.ttm-etu-polku-kortti h2 { font-size: 30px; text-transform: uppercase; }
.ttm-etu-kortti h3 { font-size: 24px; text-transform: uppercase; }
.ttm-guide-content h3, .ttm-guide-featured .ttm-guide-content h3 { font-size: 26px; line-height: 1.02; }
.ttm-etu-polku__vaiheet span { font-size: 19px; text-transform: uppercase; line-height: 1.1; }
.ttm-vo-vaiheet b { font-size: 24px; text-transform: uppercase; }

/* Yläosan kuva liikkuu hitaasti (pois, jos käyttäjä on pyytänyt vähemmän liikettä) */
@keyframes ttm-zoom { from { transform: scale(1.02); } to { transform: scale(1.12); } }
.ttm-etu-hero__kuva { animation: ttm-zoom 22s ease-out both; transform-origin: 70% 45%; }

/* Vinot reunat: yläosa ja oppaat */
.ttm-etu-hero { clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--vino)), 0 100%); padding-bottom: var(--vino); }
.ttm-etu .ttm-home-guides { clip-path: polygon(0 var(--vino), 100% 0, 100% 100%, 0 100%); padding-top: calc(76px + var(--vino)); margin-top: 24px; }
.ttm-vo-hero, .ttm-vo-wp { clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--vino)), 0 100%); padding-bottom: calc(72px + var(--vino)); }

/* Numerorivi */
.ttm-etu-luvut { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); padding: 40px 0 8px; }
.ttm-etu-luvut .ttm-etu-sisa { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.ttm-etu-luvut div > div { display: flex; flex-direction: column; gap: 4px; padding: 6px 0 6px 18px; border-left: 3px solid var(--puna); }
.ttm-etu-luvut b { font-family: var(--otsikko) !important; font-style: italic; font-weight: 800; font-size: clamp(40px, 4.6vw, 60px); line-height: .9; color: var(--teksti); }
.ttm-etu-luvut span { font-size: 15px; color: #59606b; line-height: 1.35; }

/* Palvelukortit kuvilla */
.ttm-etu-kortti--kuva { padding: 0; overflow: hidden; }
.ttm-etu-kortti__kuva { width: 100%; height: 190px; object-fit: cover; display: block; transition: transform .35s ease; }
.ttm-etu-kortti--kuva:hover .ttm-etu-kortti__kuva { transform: scale(1.05); }
.ttm-etu-kortti--kuva h3, .ttm-etu-kortti--kuva p { padding: 0 22px; }
.ttm-etu-kortti--kuva h3 { margin-top: 18px; }
.ttm-etu-kortti--kuva h3::after { content: "→"; color: var(--puna); }
.ttm-etu-kortti--kuva p { padding-bottom: 22px; }

/* Kuvanauha pajalta */
.ttm-etu-nauha { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; background: var(--tumma); }
.ttm-etu-nauha img { width: 100%; height: clamp(160px, 18vw, 260px); object-fit: cover; display: block; }

/* Varaosat-sivun yläosan taustakuva */
.ttm-vo-hero { position: relative; overflow: hidden; }
.ttm-vo-hero__tausta { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .28; animation: ttm-zoom 22s ease-out both; }
.ttm-vo-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(15,17,20,.95) 0%, rgba(15,17,20,.75) 50%, rgba(15,17,20,.55) 100%); }
.ttm-vo-hero > .ttm-etu-sisa { position: relative; z-index: 1; }

@media (max-width: 860px) {
  .ttm-etu-luvut .ttm-etu-sisa { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 24px; }
  .ttm-etu-nauha { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  .ttm-etu { --vino: 28px; }
  .ttm-etu-kortti__kuva { height: 170px; }
}
@media (prefers-reduced-motion: reduce) { .ttm-etu-hero__kuva, .ttm-vo-hero__tausta { animation: none; } }

/* ===== Saira (logon henki: leveä, kulmikas kursiivi) ja maltillisempi mittakaava ===== */
.ttm-etu { font-size: 16px; }
.ttm-etu-hero h1, .ttm-vo-hero h1, .ttm-etu-otsikko, .ttm-guides-header h2, .ttm-etu-polku-kortti h2, .ttm-etu-kortti h3, .ttm-guide-content h3, .ttm-vo-vaiheet b, .ttm-etu-polku__vaiheet span, .ttm-etu-luvut b { font-style: italic; letter-spacing: -.3px; }
.ttm-etu-hero h1 { font-weight: 800; font-size: clamp(32px, 4.4vw, 58px); line-height: 1.02; margin-bottom: 14px; }
.ttm-vo-hero h1 { font-weight: 800; font-size: clamp(30px, 4vw, 52px); line-height: 1.04; }
.ttm-etu-otsikko, .ttm-guides-header h2 { font-weight: 800; font-size: clamp(24px, 2.8vw, 36px); line-height: 1.1; margin-bottom: 18px; }
.ttm-etu-polku-kortti h2 { font-size: 21px; }
.ttm-etu-kortti h3, .ttm-vo-ryhmat .ttm-etu-kortti h3 { font-size: 17px; line-height: 1.2; }
.ttm-guide-content h3, .ttm-guide-featured .ttm-guide-content h3 { font-size: 18px; line-height: 1.2; }
.ttm-etu-polku__vaiheet span { font-size: 14px; line-height: 1.25; }
.ttm-vo-vaiheet b { font-size: 17px; }
.ttm-etu-luvut b { font-size: clamp(28px, 3vw, 40px); }
.ttm-etu-luvut span { font-size: 14px; }
.ttm-etu-hero__ingressi, .ttm-vo-hero__ingressi { font-size: 17px; margin-bottom: 22px !important; }
.ttm-etu-hero { min-height: 0; }
.ttm-etu-hero__sisus { padding-top: 56px; padding-bottom: 48px; }
.ttm-etu-osio { padding: 60px 0; }
.ttm-etu-apu, .ttm-etu-palvelut { padding-top: 52px; }
.ttm-etu-polku-kortti { padding: 20px 22px; gap: 6px; }
.ttm-etu-polku-kortti p { font-size: 15px; }
.ttm-etu-nappi { min-height: 46px; padding: 0 20px; font-size: 15px; }
.ttm-vo-hero__nappi { min-height: 50px; }
.ttm-etu-kortti__kuva { height: 150px; }
.ttm-etu-kortti--kuva h3 { margin-top: 14px; }
.ttm-etu-kortti p { font-size: 14px; }
.ttm-guide-image img, .ttm-guide-featured .ttm-guide-image img { height: 180px; }
.ttm-guide-content { padding: 18px 20px 20px; }
.ttm-guide-content p { font-size: 15px; }
.ttm-guides-header p { font-size: 16px; }
.ttm-guides-header { margin-bottom: 28px; }
.ttm-home-guides { padding-bottom: 60px; }
.ttm-etu-nauha img { height: clamp(140px, 14vw, 200px); }
.ttm-etu-polku__vaiheet li { padding: 18px 14px 16px; }
.ttm-etu-polku__vaiheet svg { width: 26px; height: 26px; }
.ttm-vo-hero { padding-top: 56px; }
.ttm-vo-toimittajat li { height: 78px; }
.ttm-vo-toimittajat img { max-height: 44px; }
.ttm-vo-merkit__lista li { height: 80px; }
.ttm-vo-merkit__lista img { max-height: 42px; }
.ttm-vo-wp__ruudukko { grid-template-columns: 260px 1fr; }

/* ===== Kevyempi yläosa ja pienet tekstit (10/2026) ===== */
@font-face { font-family: "TTM Saira"; font-style: normal; font-weight: 400 800; font-display: swap; src: url("fontit/saira-latin.woff2") format("woff2"); }

/* Kursiivi vain isoissa otsikoissa (h1, osioiden otsikot, numerot); pienet otsikot pystyyn */
.ttm-etu-polku-kortti h2, .ttm-etu-kortti h3, .ttm-guide-content h3, .ttm-vo-vaiheet b, .ttm-etu-polku__vaiheet span { font-style: normal; letter-spacing: 0; text-transform: none; font-weight: 700; }
.ttm-etu-polku-kortti h2 { font-size: 20px; }
.ttm-etu-kortti h3, .ttm-vo-ryhmat .ttm-etu-kortti h3 { font-size: 17px; }
.ttm-etu-polku__vaiheet span { font-size: 15px; font-weight: 600; }

/* Pienet käyttöliittymätekstit: Saira pysty, 600 (kevyempi kuin teeman Source Sans 800) */
.ttm-etu-nappi, .ttm-etu-kicker, .ttm-etu-polku-kortti__laji, .ttm-etu-luotto li, .ttm-etu-merkit b, .ttm-etu-merkit__lista,
.ttm-guide-tag, .ttm-guide-link, .ttm-guides-button, .ttm-vo-toimitus, .ttm-vo-toimittajat__otsikko, .ttm-kicker, .ttm-etu-luvut span {
  font-family: var(--otsikko) !important; font-style: normal; font-weight: 600; letter-spacing: .2px;
}
.ttm-etu-nappi { font-weight: 600; font-size: 15px; }
.ttm-etu-kicker, .ttm-kicker, .ttm-guide-tag, .ttm-vo-toimittajat__otsikko { font-size: 12px; letter-spacing: 1px; text-transform: uppercase; }
.ttm-guide-link, .ttm-guides-button { text-transform: none; font-size: 14px; letter-spacing: .2px; }
.ttm-etu-merkit__lista { font-weight: 600; letter-spacing: .6px; }
.ttm-etu-luotto { font-size: 14px; font-weight: 600; }
.ttm-etu-polku-kortti__laji { font-size: 11px; text-transform: uppercase; letter-spacing: 1px; }

/* Yläosan polkukortit: tumma läpikuultava lasi kuvan päällä */
.ttm-etu-polku-kortti { background: rgba(15,17,20,.55); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,.16); box-shadow: none; color: #fff; }
.ttm-etu-polku-kortti h2 { color: #fff; }
.ttm-etu-polku-kortti p { color: #d6dade; }
.ttm-etu-polku-kortti__laji { background: rgba(229,27,36,.18); color: #ff8a8f; }
.ttm-etu-pieni a { color: #fff; }
.ttm-etu-vapaa b { color: #6ee7a0; }
@supports not (backdrop-filter: blur(1px)) { .ttm-etu-polku-kortti { background: rgba(15,17,20,.82); } }

/* Yläosan tunniste ja Google-arvio samalla rivillä (luottamusrivi poistettu, numerorivi kertoo saman) */
.ttm-etu-hero__rivi { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-bottom: 18px; }
.ttm-etu-hero__rivi .ttm-etu-kicker { margin-bottom: 0; }
.ttm-etu-arvio { font-family: var(--otsikko) !important; font-weight: 600; font-size: 14px; color: #e6e8eb; }
.ttm-etu-polut { margin-top: 4px; }

/* ===== Ilmavuus ja rauhallisempi teksti (10/2026, Autoklinikan oppien pohjalta) ===== */
/* Otsikot tavallisin kirjaimin, kursiivi säilyy logon henkenä */
.ttm-etu-hero h1, .ttm-vo-hero h1, .ttm-etu-otsikko, .ttm-guides-header h2 { text-transform: none; letter-spacing: -.5px; }
.ttm-etu-hero h1 { font-size: clamp(36px, 5vw, 64px); line-height: 1.02; margin-bottom: 16px; }
.ttm-etu-hero__ingressi { max-width: 520px; color: #e6e8eb; }
.ttm-etu-hero__rivi { margin-bottom: 14px; }
.ttm-etu-polut { max-width: 860px; gap: 14px; }
.ttm-etu-polku-kortti { gap: 8px; }

/* Isommat välit osioiden välillä */
.ttm-etu-osio { padding: 88px 0; }
.ttm-etu-otsikko { margin-bottom: 28px; }

/* Merkit keskitetysti */
.ttm-etu-merkit { padding: 44px 0 8px; border-bottom: 0; }
.ttm-etu-merkit .ttm-etu-sisa { display: block; text-align: center; }
.ttm-etu-merkit__otsikko { margin: 0 0 10px !important; font-family: var(--otsikko) !important; font-weight: 600; font-size: 15px; color: #59606b; }
.ttm-etu-merkit__lista { margin: 0 !important; font-size: 22px; font-weight: 700; letter-spacing: .5px; color: var(--teksti); text-transform: uppercase; }
.ttm-etu-merkit__lista span { color: var(--puna); margin: 0 6px; }

/* Luvut keskitettynä, punaiset numerot */
.ttm-etu-luvut { padding: 56px 0 0; }
.ttm-etu-luvut .ttm-etu-sisa { max-width: 980px; text-align: center; }
.ttm-etu-luvut div > div { border-left: 0; padding: 0; align-items: center; }
.ttm-etu-luvut b { color: var(--puna); font-size: clamp(34px, 3.6vw, 48px); }

/* Prosessi: tumma osio, kuva + numeroitu lista */
.ttm-etu-prosessi { background: var(--tumma); color: #e6e8eb; margin-top: 88px; }
.ttm-etu-prosessi .ttm-etu-otsikko { color: #fff; }
.ttm-etu-prosessi__ruudukko { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.ttm-etu-prosessi__ruudukko img { width: 100%; height: auto; display: block; border-radius: var(--r-iso); }
.ttm-etu-prosessi__lista { list-style: none; margin: 0 0 28px; padding: 0; counter-reset: pr; display: flex; flex-direction: column; gap: 18px; }
.ttm-etu-prosessi__lista li { counter-increment: pr; margin: 0; display: grid; grid-template-columns: 40px 1fr; column-gap: 14px; align-items: start; }
.ttm-etu-prosessi__lista li::before { content: counter(pr); grid-row: span 2; width: 36px; height: 36px; border-radius: 50%; background: var(--puna); color: #fff; display: flex; align-items: center; justify-content: center; font-family: var(--otsikko); font-weight: 700; }
.ttm-etu-prosessi__lista b { font-family: var(--otsikko) !important; font-weight: 700; font-size: 18px; color: #fff; padding-top: 6px; }
.ttm-etu-prosessi__lista span { color: #b9c0c8; font-size: 15px; }

/* Palvelukortit: enemmän ilmaa */
.ttm-etu-palvelut__kortit { gap: 20px; }

@media (max-width: 860px) {
  .ttm-etu-prosessi__ruudukko { grid-template-columns: 1fr; gap: 28px; }
  .ttm-etu-osio { padding: 60px 0; }
  .ttm-etu-prosessi { margin-top: 60px; }
  .ttm-etu-merkit__lista { font-size: 17px; line-height: 1.6; }
}

/* Merkit: jokainen nimi omana kokonaisuutenaan, punainen piste väliin */
.ttm-etu-merkit__lista { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px 0; }
.ttm-etu-merkit__lista b { white-space: nowrap; font-weight: 700; }
.ttm-etu-merkit__lista b + b::before { content: "·"; color: var(--puna); margin: 0 12px; }
.ttm-etu-luotto { margin-top: 22px; }

/* ===== Mobiili (1. prioriteetti) ===== */
@media (max-width: 680px) {
  .ttm-etu-hero h1 { font-size: 38px; }
  .ttm-etu-hero__sisus { padding: 40px 20px 36px; }
  .ttm-etu-hero__ingressi { font-size: 16px; }
  .ttm-etu-polku-kortti { padding: 16px 18px; }
  .ttm-etu-polku-kortti h2 { font-size: 18px; }
  .ttm-etu-luotto { flex-direction: row; flex-wrap: wrap; gap: 6px 14px; font-size: 13px; margin-top: 18px; padding-top: 14px; }
  .ttm-etu-merkit { padding-top: 36px; }
  .ttm-etu-merkit__lista { font-size: 16px; gap: 4px 0; }
  .ttm-etu-merkit__lista b + b::before { margin: 0 8px; }
  .ttm-etu-luvut { padding-top: 36px; }
  .ttm-etu-osio { padding: 52px 0; }
  .ttm-etu-otsikko { margin-bottom: 20px; }
  /* Palvelukortit vaakasuuntaisiksi: kuva vasemmalla, teksti oikealla */
  .ttm-etu-palvelut__kortit { gap: 12px; }
  .ttm-etu-kortti--kuva { display: grid; grid-template-columns: 112px 1fr; grid-template-rows: auto 1fr; column-gap: 14px; align-items: start; }
  .ttm-etu-kortti--kuva .ttm-etu-kortti__kuva { grid-row: 1 / span 2; width: 112px; height: 100%; min-height: 104px; }
  .ttm-etu-kortti--kuva h3 { margin: 14px 12px 4px 0; padding: 0; font-size: 16px; }
  .ttm-etu-kortti--kuva p { margin: 0 12px 14px 0; padding: 0; font-size: 13px; }
  .ttm-etu-kortti--kuva:hover .ttm-etu-kortti__kuva { transform: none; }
  /* Prosessi */
  .ttm-etu-prosessi { margin-top: 52px; }
  .ttm-etu-prosessi__lista b { font-size: 16px; }
  /* Oppaat: matalammat kuvat, painikkeet rinnakkain */
  .ttm-home-guides { padding-left: 20px; padding-right: 20px; padding-bottom: 48px; }
  .ttm-guides-grid { gap: 14px; }
  .ttm-guide-image img, .ttm-guide-featured .ttm-guide-image img { height: 150px; }
  .ttm-guide-content { padding: 14px 16px 16px; }
  .ttm-guide-content p { margin-bottom: 14px; }
  .ttm-guides-footer { justify-content: flex-start; gap: 8px; }
  .ttm-guides-button { width: auto; padding: 10px 14px; font-size: 13px; }
  /* Loppuosio: painikkeet täysleveinä mutta matalampina */
  .ttm-etu-loppu .ttm-etu-napit .ttm-etu-nappi { min-height: 44px; }
}

/* ===== Mobiilin kiinteä alapalkki ja kuvakaista yläosassa (Autoklinikan mobiilin oppien pohjalta) ===== */
.ttm-etu-alapalkki { display: none; }
@media (max-width: 680px) {
  .ttm-etu-alapalkki { display: grid; grid-template-columns: 1.2fr 1fr 1fr 1.1fr; position: fixed; left: 0; right: 0; bottom: 0; z-index: 9990; background: rgba(255,255,255,.97); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); border-top: 1px solid #e3e7ec; padding: 6px 8px calc(6px + env(safe-area-inset-bottom)); gap: 4px; box-shadow: 0 -6px 20px rgba(15,17,20,.08); }
  .ttm-etu-alapalkki a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-height: 52px; border-radius: 10px; color: var(--teksti) !important; text-decoration: none !important; font-family: var(--otsikko) !important; font-weight: 600; font-size: 12px; }
  .ttm-etu-alapalkki a:first-child { background: var(--puna); color: #fff !important; }
  .ttm-etu-alapalkki svg { width: 22px; height: 22px; stroke: currentColor; }
  .ttm-etu-alapalkki a:first-child svg { stroke: #fff; }
  body:has(.ttm-etu-alapalkki) { padding-bottom: calc(68px + env(safe-area-inset-bottom)); }
  /* Evästebanneri alapalkin yläpuolelle */
  body:has(.ttm-etu-alapalkki) .ttm-ev { bottom: calc(76px + env(safe-area-inset-bottom)); }

  /* Yläosa: kuva omana kaistanaan, teksti sen alla tummalla pohjalla */
  .ttm-etu-hero { display: block; min-height: 0; clip-path: none; padding-bottom: 0; }
  .ttm-etu-hero__kuva { position: relative; inset: auto; height: 210px; animation: none; object-position: 65% 35%; }
  .ttm-etu-hero::after { display: none; }
  .ttm-etu-hero__sisus { padding: 26px 20px 34px; }
  .ttm-etu-hero h1 { font-size: 34px; }
}

/* Ensikertalaiselle: kuka ja missä otsikon yläpuolella, luottamusrivi heti ingressin alla */
.ttm-etu-esittely { margin: 0 0 10px !important; font-family: var(--otsikko) !important; font-weight: 600; font-size: 15px; letter-spacing: .4px; color: #c9ced4; }
.ttm-etu-hero .ttm-etu-luotto { margin: 0 0 22px; padding-top: 0; border-top: 0; }
@media (max-width: 680px) {
  .ttm-etu-esittely { font-size: 14px; margin-bottom: 8px !important; }
  .ttm-etu-hero .ttm-etu-luotto { margin-bottom: 18px; padding-top: 0; }
}

/* Oppaiden kortit: väljemmät */
.ttm-guides-grid--kolme { gap: 28px; }
.ttm-guide-image img, .ttm-guide-featured .ttm-guide-image img { height: 210px; }
.ttm-guide-content { padding: 26px 28px 28px; gap: 4px; }
.ttm-guide-tag { margin-bottom: 10px; }
.ttm-guide-content h3, .ttm-guide-featured .ttm-guide-content h3 { margin-bottom: 10px; line-height: 1.25; }
.ttm-guide-content p { line-height: 1.6; margin-bottom: 24px; color: #c3c9d0; }
.ttm-guides-footer { margin-top: 40px; }
@media (max-width: 680px) {
  .ttm-guides-grid { gap: 18px; }
  .ttm-guide-image img, .ttm-guide-featured .ttm-guide-image img { height: 170px; }
  .ttm-guide-content { padding: 20px 20px 22px; }
}

/* ===== Huolto näkyy dynossa (havainnekuva, pohjana oikea mittaus) ===== */
.ttm-etu-dyno { background: #f6f7f9; margin-top: 0; }
.ttm-etu-dyno__ruudukko { display: grid; grid-template-columns: .9fr 1.1fr; gap: 56px; align-items: center; }
.ttm-etu-dyno__sisus p { color: #3d4652; }
.ttm-etu-dyno__selite { list-style: none; margin: 22px 0 10px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 22px; font-family: var(--otsikko) !important; font-weight: 600; font-size: 15px; }
.ttm-etu-dyno__selite li { margin: 0; display: flex; align-items: center; gap: 10px; }
.ttm-etu-dyno__viiva { width: 28px; height: 0; border-top: 4px solid var(--puna); border-radius: 2px; }
.ttm-etu-dyno__viiva--kulunut { border-top: 3px dashed #8b929c; }
.ttm-etu-dyno__huom { font-size: 13px !important; color: #6b7480 !important; margin-top: 6px !important; }
.ttm-etu-dyno__kortti { margin: 0; background: var(--tumma); border-radius: var(--r-iso); padding: 18px 14px 8px; box-shadow: var(--varjo-hover); }
.ttm-etu-dyno__kaavio { width: 100%; height: auto; display: block; overflow: visible; }
.ttm-etu-dyno__ruutu { stroke: #232831; stroke-width: 1; }
.ttm-etu-dyno__akseli { stroke: #3a414b; stroke-width: 1.5; }
.ttm-etu-dyno__teksti { fill: #9aa3ad; font-size: 14px; font-family: "TTM Saira", sans-serif; font-weight: 600; }
.ttm-etu-dyno__kayra { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.ttm-etu-dyno__kayra--huollettu { stroke: var(--puna); stroke-width: 4.5; }
.ttm-etu-dyno__kayra--kulunut { stroke: #8b929c; stroke-width: 3; stroke-dasharray: 8 7; }
.ttm-etu-dyno__ero { stroke: #fff; stroke-width: 1.5; stroke-dasharray: 3 4; }
.ttm-etu-dyno__ero-teksti { fill: #fff; font-family: "TTM Saira", sans-serif; font-weight: 800; font-style: italic; font-size: 22px; }
/* Piirtoanimaatio, kun osio tulee näkyviin (vain jos JS lisää luokan; ilman JS:ää käyrät näkyvät suoraan) */
.ttm-etu-dyno.animoi .ttm-etu-dyno__kayra--huollettu { stroke-dasharray: 1; stroke-dashoffset: 1; }
.ttm-etu-dyno.animoi .ttm-etu-dyno__kayra--kulunut { opacity: 0; }
.ttm-etu-dyno.animoi .ttm-etu-dyno__ero, .ttm-etu-dyno.animoi .ttm-etu-dyno__ero-teksti { opacity: 0; }
.ttm-etu-dyno.animoi.nakyy .ttm-etu-dyno__kayra--kulunut { opacity: 1; transition: opacity .6s ease; }
.ttm-etu-dyno.animoi.nakyy .ttm-etu-dyno__kayra--huollettu { stroke-dashoffset: 0; transition: stroke-dashoffset 1.6s cubic-bezier(.3,.7,.2,1) .5s; }
.ttm-etu-dyno.animoi.nakyy .ttm-etu-dyno__ero, .ttm-etu-dyno.animoi.nakyy .ttm-etu-dyno__ero-teksti { opacity: 1; transition: opacity .5s ease 2s; }
@media (max-width: 860px) { .ttm-etu-dyno__ruudukko { grid-template-columns: 1fr; gap: 28px; } }
@media (max-width: 680px) { .ttm-etu-dyno__kortti { padding: 12px 6px 4px; } .ttm-etu .ttm-etu-dyno__teksti { font-size: 18px; } }
@media (prefers-reduced-motion: reduce) { .ttm-etu-dyno.animoi .ttm-etu-dyno__kayra--huollettu { stroke-dasharray: none; stroke-dashoffset: 0; } .ttm-etu-dyno.animoi * { opacity: 1 !important; transition: none !important; } }
.ttm-etu .ttm-etu-dyno__kaavio { width: 100%; height: auto; stroke: none; fill: none; }
.ttm-etu .ttm-etu-dyno__kaavio text { stroke: none; }
.ttm-etu .ttm-etu-dyno__teksti { font-size: 22px; }
.ttm-etu .ttm-etu-dyno__ero-teksti { font-size: 34px; }
.ttm-etu .ttm-etu-dyno__kayra--kulunut { stroke-dasharray: 12 10; stroke-width: 3.5; }
.ttm-etu .ttm-etu-dyno__kayra--huollettu { stroke-width: 5.5; }
@media (max-width: 680px) { .ttm-etu .ttm-etu-dyno__teksti { font-size: 26px; } .ttm-etu .ttm-etu-dyno__ero-teksti { font-size: 40px; } }

/* Ajotuntisäädin */
.ttm-etu-dyno__saadin { padding: 14px 16px 10px; color: #e6e8eb; }
.ttm-etu-dyno__saadin label { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-family: var(--otsikko) !important; font-weight: 600; font-size: 15px; color: #c9ced4; }
.ttm-etu-dyno__saadin label b { font-family: var(--otsikko) !important; font-style: italic; font-weight: 800; font-size: 22px; color: #fff; }
.ttm-etu-dyno__saadin input[type=range] { -webkit-appearance: none; appearance: none; width: 100%; height: 44px; margin: 4px 0 0; background: transparent; cursor: pointer; }
.ttm-etu-dyno__saadin input[type=range]::-webkit-slider-runnable-track { height: 6px; border-radius: 3px; background: linear-gradient(90deg, #2fbf6b 0%, #f2c14e 50%, #e51b24 100%); }
.ttm-etu-dyno__saadin input[type=range]::-moz-range-track { height: 6px; border-radius: 3px; background: linear-gradient(90deg, #2fbf6b 0%, #f2c14e 50%, #e51b24 100%); }
.ttm-etu-dyno__saadin input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; width: 28px; height: 28px; margin-top: -11px; border-radius: 50%; background: #fff; border: 4px solid #e51b24; box-shadow: 0 2px 10px rgba(0,0,0,.4); }
.ttm-etu-dyno__saadin input[type=range]::-moz-range-thumb { width: 22px; height: 22px; border-radius: 50%; background: #fff; border: 4px solid #e51b24; }
.ttm-etu-dyno__saadin input[type=range]:focus-visible { outline: 3px solid #fff; outline-offset: 2px; border-radius: 6px; }
.ttm-etu-dyno__asteikko { display: flex; justify-content: space-between; font-size: 12px; color: #8b929c; margin-top: -4px; }
.ttm-etu-dyno__vali { margin: 10px 0 4px !important; font-size: 13px !important; color: #b9c0c8 !important; }

/* ===== Varaosat-sivu samoilla parannuksilla kuin etusivu ===== */
.ttm-vo-hero .ttm-etu-luotto { margin: 0 0 22px; }
.ttm-vo-hero__ingressi { margin-bottom: 16px !important; }
.ttm-vo-merkit .ttm-etu-sisa { text-align: center; }
.ttm-vo-merkit .ttm-etu-merkit__otsikko { margin-bottom: 18px !important; }
.ttm-vo-merkit { padding-top: 24px; }
/* Tumman prosessin jälkeen WP-osio vaaleana, ettei kaksi tummaa osiota tule peräkkäin */
.ttm-etu-prosessi + .ttm-vo-wp { background: #f6f7f9; color: var(--teksti); clip-path: none; padding-bottom: 88px; }
.ttm-etu-prosessi + .ttm-vo-wp .ttm-etu-otsikko { color: var(--teksti); }
.ttm-etu-prosessi + .ttm-vo-wp p { color: #3d4652; }
.ttm-etu-prosessi + .ttm-vo-wp .ttm-etu-nappi--valkoinen-reuna { border-color: var(--teksti); color: var(--teksti) !important; }
.ttm-etu-prosessi + .ttm-vo-wp .ttm-etu-nappi--valkoinen-reuna:hover { background: var(--teksti); color: #fff !important; }
.ttm-vo-ryhmat { gap: 18px; }
@media (max-width: 680px) {
  /* Yläosa: kuva kaistana ylhäällä kuten etusivulla */
  .ttm-vo-hero { clip-path: none; padding: 0 0 36px; }
  .ttm-vo-hero__tausta { position: relative; height: 180px; opacity: 1; animation: none; object-position: 50% 40%; }
  .ttm-vo-hero::after { top: 180px; background: var(--tumma); }
  .ttm-vo-hero > .ttm-etu-sisa { padding-top: 24px; }
  .ttm-vo-hero h1 { font-size: 32px; }
  .ttm-vo-hero .ttm-etu-luotto { flex-direction: row; flex-wrap: wrap; gap: 6px 14px; font-size: 13px; }
  .ttm-vo-toimittajat ul { gap: 8px; }
  .ttm-vo-toimittajat li { height: 64px; padding: 10px 14px; }
  .ttm-vo-toimittajat img { max-height: 36px; }
  .ttm-vo-ryhmat { gap: 10px; }
  .ttm-vo-ryhmat .ttm-etu-kortti { padding: 16px 18px; }
  .ttm-vo-merkit__lista { gap: 8px; }
  .ttm-vo-merkit__lista li { height: 64px; padding: 10px 14px; }
  .ttm-vo-wp__logo { max-width: 260px; padding: 20px; }
}
@media (max-width: 860px) { .ttm-vo-wp__ruudukko { grid-template-columns: 1fr; } }
.ttm-vo-hero .ttm-etu-luotto { border-top: 0; padding-top: 0; }

/* ===== Varaosat-sivu v2: vaalea "kauppa", hakukenttä, katalogiruudukko ===== */
.ttm-vo2-hero { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); background: linear-gradient(180deg, #f6f7f9 0%, #fff 100%); padding: 64px 0 56px; border-bottom: 1px solid #eef1f4; }
.ttm-vo2-hero__ruudukko { display: grid; grid-template-columns: 1.15fr .85fr; gap: 56px; align-items: center; }
.ttm-vo2-esittely { margin: 0 0 10px !important; font-family: var(--otsikko) !important; font-weight: 600; font-size: 15px; color: #59606b; }
.ttm-vo2-hero h1 { font-family: var(--otsikko) !important; font-style: italic; font-weight: 800; letter-spacing: -.5px; font-size: clamp(34px, 4.4vw, 56px); line-height: 1.04; margin: 0 0 14px; color: var(--teksti); }
.ttm-vo2-ingressi { font-size: 17px; color: #3d4652; max-width: 560px; margin-bottom: 22px !important; }
.ttm-vo2-haku { display: grid; grid-template-columns: 1fr 1fr auto; gap: 10px; align-items: end; background: #fff; border: 1px solid #e3e7ec; border-radius: 16px; padding: 14px; box-shadow: var(--varjo-hover); }
.ttm-vo2-haku__kentta { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.ttm-vo2-haku label { font-family: var(--otsikko) !important; font-weight: 600; font-size: 13px; color: #59606b; padding-left: 2px; }
.ttm-vo2-haku input { width: 100%; height: 48px; border: 1px solid #d4dbe3; border-radius: 10px; padding: 0 14px; font: inherit; font-size: 16px; color: var(--teksti); background: #fff; box-sizing: border-box; }
.ttm-vo2-haku input:focus { outline: none; border-color: var(--puna); box-shadow: 0 0 0 3px rgba(229,27,36,.15); }
.ttm-vo2-haku .ttm-etu-nappi { height: 48px; min-height: 48px; border: 0; cursor: pointer; white-space: nowrap; }
.ttm-vo2-luotto { list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 22px; font-family: var(--otsikko) !important; font-weight: 600; font-size: 14px; color: #3d4652; }
.ttm-vo2-luotto li { margin: 0; display: flex; align-items: center; gap: 8px; }
.ttm-vo2-luotto li:not(:first-child)::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--puna); }
.ttm-vo2-omat { margin: 12px 0 0 !important; font-size: 14px; color: #59606b; }
.ttm-vo2-omat a { color: var(--teksti); font-weight: 700; }
.ttm-vo2-pieni-otsikko { margin: 0 0 12px !important; font-family: var(--otsikko) !important; font-weight: 600; font-size: 12px; letter-spacing: 1px; text-transform: uppercase; color: #6b7480; }
.ttm-vo2-toimittajat ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ttm-vo2-toimittajat li { margin: 0; height: 80px; display: flex; align-items: center; justify-content: center; padding: 14px 20px; background: #fff; border: 1px solid #edf0f3; border-radius: 12px; box-shadow: var(--varjo); }
.ttm-vo2-toimittajat li.ttm-vo-tumma { background: #1c2027; border-color: #1c2027; }
.ttm-vo2-toimittajat img { max-width: 100%; max-height: 44px; width: auto; height: auto; object-fit: contain; display: block; }

/* Katalogiruudukko */
.ttm-vo2-ryhmat { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.ttm-vo2-ryhma { display: flex; flex-direction: column; gap: 6px; padding: 22px; background: #fff; border: 1px solid #edf0f3; border-radius: var(--r-kortti); box-shadow: var(--varjo); color: var(--teksti) !important; text-decoration: none !important; transition: transform .2s ease, box-shadow .2s ease; }
.ttm-vo2-ryhma:hover { transform: translateY(-3px); box-shadow: var(--varjo-hover); }
.ttm-vo2-ryhma:focus-visible { outline: 3px solid var(--puna); outline-offset: 3px; }
.ttm-etu .ttm-vo2-ryhma svg { width: 24px; height: 24px; padding: 10px; box-sizing: content-box; background: #fdecec; border-radius: 12px; stroke: var(--puna); fill: none; stroke-width: 1.8; margin-bottom: 6px; }
.ttm-vo2-ryhma h3 { margin: 0; font-family: var(--otsikko) !important; font-weight: 700; font-size: 17px; color: var(--teksti); }
.ttm-vo2-ryhma p { margin: 0 !important; font-size: 14px; color: #3d4652; }
.ttm-vo2-merkit { margin-top: auto; padding-top: 10px; font-family: var(--otsikko) !important; font-weight: 600; font-size: 13px; color: #59606b; line-height: 1.45; }
.ttm-vo2-ryhma--wp { background: var(--tumma); border-color: var(--tumma); color: #fff !important; grid-column: span 2; }
.ttm-vo2-ryhma--wp img { height: 22px; width: auto; margin-bottom: 8px; align-self: flex-start; }
.ttm-vo2-ryhma--wp h3 { color: #fff; font-size: 22px; font-style: italic; }
.ttm-vo2-ryhma--wp p { color: #c9ced4; font-size: 15px; }
.ttm-vo2-ryhma--wp .ttm-vo2-merkit { color: #ff8a8f; }
.ttm-vo2-huom { margin-top: 22px !important; text-align: center; color: #59606b; font-size: 15px; }

@media (max-width: 1024px) { .ttm-vo2-ryhmat { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 860px) {
  .ttm-vo2-hero__ruudukko { grid-template-columns: 1fr; gap: 32px; }
  .ttm-vo2-haku { grid-template-columns: 1fr; }
  .ttm-vo2-haku .ttm-etu-nappi { width: 100%; }
}
@media (max-width: 680px) {
  .ttm-vo2-hero { padding: 32px 0 36px; }
  .ttm-vo2-hero h1 { font-size: 32px; }
  .ttm-vo2-ingressi { font-size: 16px; }
  .ttm-vo2-haku { padding: 12px; border-radius: 14px; }
  .ttm-vo2-luotto { font-size: 13px; gap: 6px 14px; }
  .ttm-vo2-toimittajat li { height: 64px; padding: 10px 14px; }
  .ttm-vo2-toimittajat img { max-height: 34px; }
  .ttm-vo2-ryhmat { grid-template-columns: 1fr; gap: 10px; }
  .ttm-vo2-ryhma { display: grid; grid-template-columns: auto 1fr; column-gap: 14px; padding: 16px; }
  .ttm-vo2-ryhma svg { grid-row: span 3; margin: 0 !important; }
  .ttm-vo2-ryhma--wp { grid-column: auto; display: flex; }
  .ttm-vo2-merkit { padding-top: 4px; }
}

/* Tunnetut merkit: enemmän logoja, automaattinen ruudukko */
.ttm-vo-merkit__lista { grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important; gap: 12px; }
.ttm-vo-merkit__lista li { height: 84px; }
.ttm-vo-merkit__lista img { max-height: 40px; }

/* Carapaks-nosto */
.ttm-vo2-cara { padding-top: 0; }
.ttm-vo2-cara__kortti { display: grid; grid-template-columns: 220px 1fr auto; gap: 32px; align-items: center; padding: 32px 36px; background: #fff; border: 1px solid #edf0f3; border-radius: var(--r-iso); box-shadow: var(--varjo-hover); border-left: 5px solid #e3262d; }
.ttm-vo2-cara__logo { width: 100%; height: auto; display: block; }
.ttm-vo2-cara__teksti h2 { margin: 0 0 8px; font-family: var(--otsikko) !important; font-style: italic; font-weight: 800; font-size: 26px; color: var(--teksti); }
.ttm-vo2-cara__teksti p { margin: 0 !important; color: #3d4652; }
.ttm-vo2-cara__napit { display: flex; flex-direction: column; gap: 10px; }
@media (max-width: 1024px) { .ttm-vo2-cara__kortti { grid-template-columns: 180px 1fr; } .ttm-vo2-cara__napit { grid-column: 1 / -1; flex-direction: row; flex-wrap: wrap; } }
@media (max-width: 680px) {
  .ttm-vo2-cara__kortti { grid-template-columns: 1fr; gap: 16px; padding: 22px 20px; }
  .ttm-vo2-cara__logo { max-width: 180px; }
  .ttm-vo2-cara__napit { flex-direction: column; }
  .ttm-vo2-cara__napit .ttm-etu-nappi { width: 100%; }
  .ttm-vo-merkit__lista { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .ttm-vo-merkit__lista li { height: 68px; }
}
.ttm-vo-merkit__lista img.ttm-vo-sekoita { mix-blend-mode: multiply; max-height: 48px; }

/* ===== Varaosat Euroopasta Forssaan (kartta) ===== */
.ttm-kartta { background: var(--tumma); color: #e6e8eb; }
.ttm-kartta .ttm-etu-otsikko { color: #fff; }
.ttm-kartta__ruudukko-asettelu { display: grid; grid-template-columns: .85fr 1.15fr; gap: 48px; align-items: center; }
.ttm-kartta__teksti p { color: #c3c9d0; }
.ttm-kartta__luvut { list-style: none; margin: 22px 0; padding: 0; display: flex; gap: 32px; }
.ttm-kartta__luvut li { margin: 0; display: flex; flex-direction: column; }
.ttm-kartta__luvut b { font-family: var(--otsikko) !important; font-style: italic; font-weight: 800; font-size: 40px; line-height: 1; color: var(--puna); }
.ttm-kartta__luvut span { font-family: var(--otsikko) !important; font-weight: 600; font-size: 14px; color: #9aa3ad; }
.ttm-kartta__lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.ttm-kartta__lista li { margin: 0; }
.ttm-kartta__lista button { width: 100%; min-height: 48px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 2px; padding: 8px 14px; background: #181b20; border: 1px solid #2a2f37; border-radius: 10px; color: #fff; cursor: pointer; text-align: left; font: inherit; transition: border-color .15s, background .15s; }
.ttm-kartta__lista button b { font-family: var(--otsikko) !important; font-weight: 700; font-size: 15px; }
.ttm-kartta__lista button span { font-size: 13px; color: #9aa3ad; }
.ttm-kartta__lista button:hover, .ttm-kartta__lista button.on, .ttm-kartta__lista button:focus-visible { border-color: var(--puna); background: #1f1416; outline: none; }
.ttm-kartta__kortti { margin: 0; background: #121519; border: 1px solid #23272e; border-radius: var(--r-iso); padding: 10px; overflow: hidden; }
.ttm-etu .ttm-kartta__svg { width: 100%; height: auto; display: block; stroke: none; fill: none; }
.ttm-kartta__ruudukko circle { fill: #232831; }
.ttm-kartta__reitti { fill: none; stroke: #3a414b; stroke-width: 2; transition: stroke .2s, stroke-width .2s; }
.ttm-kartta__paketti { fill: none; stroke: var(--puna); stroke-width: 3.5; stroke-linecap: round; stroke-dasharray: 10 600; animation: ttm-paketti 3.8s linear infinite; }
@keyframes ttm-paketti { from { stroke-dashoffset: 610; } to { stroke-dashoffset: 0; } }
.ttm-kartta__tukkuri circle { fill: #fff; stroke: var(--tumma); stroke-width: 3; transition: r .2s; }
.ttm-kartta__tukkuri text, .ttm-kartta__forssa text { fill: #c9ced4; font-family: "TTM Saira", sans-serif; font-weight: 600; font-size: 17px; }
.ttm-kartta__forssa circle { fill: var(--puna); }
.ttm-kartta__forssa text { fill: #fff; font-weight: 800; font-style: italic; font-size: 22px; }
.ttm-kartta__pulssi { fill: var(--puna); opacity: .45; transform-origin: center; transform-box: fill-box; animation: ttm-pulssi 2s ease-out infinite; }
@keyframes ttm-pulssi { from { transform: scale(1); opacity: .5; } to { transform: scale(3); opacity: 0; } }
/* Korostus: valittu tukkuri */
.ttm-kartta.valittu .ttm-kartta__reitti, .ttm-kartta.valittu .ttm-kartta__paketti, .ttm-kartta.valittu .ttm-kartta__tukkuri { opacity: .22; transition: opacity .2s; }
.ttm-kartta.valittu .on { opacity: 1 !important; }
.ttm-kartta.valittu .ttm-kartta__reitti.on { stroke: var(--puna); stroke-width: 3; }
.ttm-kartta.valittu .ttm-kartta__tukkuri.on text { fill: #fff; }
@media (max-width: 860px) { .ttm-kartta__ruudukko-asettelu { grid-template-columns: 1fr; gap: 24px; } .ttm-kartta__kortti { order: -1; } }
@media (max-width: 680px) { .ttm-kartta__luvut { gap: 22px; } .ttm-kartta__luvut b { font-size: 32px; } .ttm-kartta__tukkuri text { font-size: 22px; } .ttm-kartta__forssa text { font-size: 28px; } }
@media (prefers-reduced-motion: reduce) { .ttm-kartta__paketti, .ttm-kartta__pulssi { animation: none; } .ttm-kartta__paketti { display: none; } }

/* Kartta: hehku ja näkyvämmät paketit */
.ttm-kartta__paketti { stroke-width: 5; stroke-dasharray: 14 600; filter: drop-shadow(0 0 6px rgba(229,27,36,.9)); }
.ttm-kartta__reitti { stroke: #444b56; }
.ttm-kartta__forssa circle:not(.ttm-kartta__pulssi) { filter: drop-shadow(0 0 10px rgba(229,27,36,.9)); }
.ttm-kartta__kortti { background: radial-gradient(circle at 78% 30%, rgba(229,27,36,.14), transparent 55%), #121519; }

/* ===== Varaosat-yläosan hakulaatikko: punainen hehku ja latausanimaatio ===== */
.ttm-vo2-haku { position: relative; border-color: rgba(229,27,36,.35); box-shadow: 0 0 0 1px rgba(229,27,36,.12), 0 18px 50px rgba(229,27,36,.18), 0 8px 24px rgba(15,17,20,.08); }
.ttm-vo2-haku::before { content: ""; position: absolute; inset: -2px; border-radius: 18px; padding: 2px; background: linear-gradient(120deg, transparent 20%, rgba(229,27,36,.85) 45%, transparent 70%); background-size: 300% 100%; -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; animation: ttm-reuna 2.4s ease-in-out .6s 1 both; opacity: 0; }
@keyframes ttm-reuna { 0% { opacity: 0; background-position: 100% 0; } 15% { opacity: 1; } 85% { opacity: 1; } 100% { opacity: 0; background-position: 0 0; } }
.ttm-vo2-hero h1, .ttm-vo2-ingressi, .ttm-vo2-haku, .ttm-vo2-luotto, .ttm-vo2-toimittajat li { animation: ttm-nousu .6s cubic-bezier(.2,.7,.2,1) both; }
.ttm-vo2-ingressi { animation-delay: .08s; }
.ttm-vo2-haku { animation-delay: .16s; }
.ttm-vo2-luotto { animation-delay: .28s; }
.ttm-vo2-toimittajat li:nth-child(1) { animation-delay: .2s; } .ttm-vo2-toimittajat li:nth-child(2) { animation-delay: .26s; }
.ttm-vo2-toimittajat li:nth-child(3) { animation-delay: .32s; } .ttm-vo2-toimittajat li:nth-child(4) { animation-delay: .38s; }
.ttm-vo2-toimittajat li:nth-child(5) { animation-delay: .44s; } .ttm-vo2-toimittajat li:nth-child(6) { animation-delay: .5s; }
.ttm-vo2-toimittajat li:nth-child(7) { animation-delay: .56s; }
@keyframes ttm-nousu { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.ttm-vo2-haku:focus-within { box-shadow: 0 0 0 3px rgba(229,27,36,.25), 0 22px 60px rgba(229,27,36,.25); }
@media (prefers-reduced-motion: reduce) { .ttm-vo2-haku::before, .ttm-vo2-hero h1, .ttm-vo2-ingressi, .ttm-vo2-haku, .ttm-vo2-luotto, .ttm-vo2-toimittajat li { animation: none; opacity: 1; } }
.ttm-vo2-huom { max-width: 420px; margin-left: auto !important; margin-right: auto !important; line-height: 1.5; } .ttm-vo2-huom b { color: var(--teksti); font-family: var(--otsikko) !important; font-weight: 700; }
.ttm-kartta__maa { fill: #1a1e24; stroke: #313843; stroke-width: 1; stroke-linejoin: round; }
.ttm-kartta__maa--tukkuri { fill: #22272f; stroke: #454d59; }
.ttm-kartta__ruudukko { opacity: .5; }

/* Erikoisosat: WP PRO Components ja Carapaks rinnakkain */
.ttm-vo2-erikois { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-bottom: 56px; }
.ttm-vo2-erikois__kortti { display: flex; flex-direction: column; gap: 8px; padding: 30px 32px; border-radius: var(--r-iso); text-decoration: none !important; min-height: 230px; transition: transform .2s ease, box-shadow .2s ease; }
.ttm-vo2-erikois__kortti img { height: 34px; width: auto; align-self: flex-start; margin-bottom: 10px; }
.ttm-vo2-erikois__kortti h3 { margin: 0; font-family: var(--otsikko) !important; font-style: italic; font-weight: 800; font-size: 26px; }
.ttm-vo2-erikois__kortti p { margin: 0 !important; font-size: 15px; line-height: 1.55; }
.ttm-vo2-erikois__kortti--wp { background: var(--tumma); color: #fff !important; box-shadow: var(--varjo-hover); }
.ttm-vo2-erikois__kortti--wp h3 { color: #fff; }
.ttm-vo2-erikois__kortti--wp p { color: #c9ced4; }
.ttm-vo2-erikois__kortti--wp:hover { transform: translateY(-3px); }
.ttm-vo2-erikois__kortti--cara { background: #fff; border: 1px solid #edf0f3; box-shadow: var(--varjo-hover); color: var(--teksti); }
.ttm-vo2-erikois__kortti--cara h3 { color: var(--teksti); }
.ttm-vo2-erikois__kortti--cara p { color: #3d4652; }
.ttm-vo2-erikois__kortti--cara img { height: 38px; }
.ttm-vo2-erikois__napit { margin-top: auto; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 20px; padding-top: 14px; }
.ttm-vo2-erikois__linkki { margin-top: auto; padding-top: 14px; font-family: var(--otsikko) !important; font-weight: 700; font-size: 16px; color: var(--puna) !important; text-decoration: none !important; }
.ttm-vo2-erikois__napit .ttm-vo2-erikois__linkki { margin-top: 0; padding-top: 0; }
.ttm-vo2-erikois__kortti--wp .ttm-vo2-erikois__linkki { color: #ff8a8f !important; }
.ttm-vo2-erikois__toissijainen { font-family: var(--otsikko) !important; font-weight: 600; font-size: 14px; color: #59606b !important; }
.ttm-vo2-ryhmat-otsikko { margin-top: 8px; }
@media (max-width: 860px) { .ttm-vo2-erikois { grid-template-columns: 1fr; margin-bottom: 40px; } .ttm-vo2-erikois__kortti { min-height: 0; padding: 24px; } }
.ttm-vo2-ryhma--muu { background: #f6f7f9; border: 1.5px dashed #c9ced4; box-shadow: none; } .ttm-vo2-ryhma--muu .ttm-vo2-merkit { color: var(--puna); }
.ttm-vo-wp__kuva { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 40%; border-radius: var(--r-iso); box-shadow: var(--varjo-hover); display: block; }
.ttm-vo-wp__ruudukko { grid-template-columns: 320px 1fr; }
@media (max-width: 860px) { .ttm-vo-wp__ruudukko { grid-template-columns: 1fr; } .ttm-vo-wp__kuva { aspect-ratio: 4 / 3; max-width: 520px; } }
.ttm-vo2-cone { color: #ff3b44; font-weight: 700; white-space: nowrap; }
.ttm-vo-wp__musta { background: var(--tumma); border-radius: var(--r-iso); aspect-ratio: 4 / 3; display: flex; align-items: center; justify-content: center; padding: 40px; box-shadow: var(--varjo-hover); }
.ttm-vo-wp__musta img { width: 100%; max-width: 220px; height: auto; display: block; }
@media (max-width: 860px) { .ttm-vo-wp__musta { max-width: 420px; aspect-ratio: 16 / 9; } }
.ttm-vo2-erikois__kortti--wp .ttm-vo2-erikois__toissijainen { color: #c9ced4 !important; }

/* Teeman button[type=submit] -väri (sininen) ei saa ohittaa punaista nappia */
.ttm-etu button.ttm-etu-nappi--puna { background: var(--puna) !important; color: #fff !important; border-color: transparent !important; }
.ttm-etu button.ttm-etu-nappi--puna:hover, .ttm-etu button.ttm-etu-nappi--puna:focus-visible { background: #c8141c !important; }

/* ===== Yhteystiedot-sivu (wordpress/yhteystiedot/sisalto.html) ===== */
.ttm-yht-kortti { font-style: normal; background: var(--tumma); color: #fff; border-radius: var(--r-iso); padding: 28px 30px; box-shadow: var(--varjo-hover); border-top: 4px solid var(--puna); }
.ttm-yht-kortti__nimi { font-family: var(--otsikko) !important; font-style: italic; font-weight: 800; font-size: 26px; line-height: 1.1; margin: 0 0 16px !important; }
.ttm-yht-kortti dl { margin: 0; display: grid; gap: 14px; }
.ttm-yht-kortti dt { font-family: var(--otsikko) !important; font-weight: 600; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: rgba(255,255,255,.55); }
.ttm-yht-kortti dd { margin: 2px 0 0; font-size: 17px; font-weight: 600; line-height: 1.4; }
.ttm-yht-kortti a { color: #fff !important; text-decoration: none; }
.ttm-yht-kortti a:hover { text-decoration: underline; }
.ttm-yht-kortti__kartta { display: inline-block; margin-top: 20px; font-family: var(--otsikko) !important; font-weight: 700; color: #fff !important; border-bottom: 2px solid var(--puna); }
.ttm-yht-osio { background: var(--pohja); }
.ttm-yht-ruudukko { display: grid; grid-template-columns: 1.35fr .9fr; gap: 40px; align-items: start; }
.ttm-yht-lomake { background: #fff; border-radius: var(--r-iso); padding: 34px 36px; box-shadow: var(--varjo); }
.ttm-yht-lomake .ttm-etu-otsikko { margin-bottom: 10px; }
.ttm-yht-lomake__kentat { margin-top: 18px; min-height: 640px; }
.ttm-yht-ohjeet { display: grid; gap: 14px; }
.ttm-yht-ohje { display: grid; gap: 6px; background: #fff; border-radius: var(--r-kortti); padding: 20px 22px; box-shadow: var(--varjo); color: var(--teksti) !important; text-decoration: none !important; font-size: 15px; line-height: 1.5; transition: box-shadow .2s ease, transform .2s ease; }
a.ttm-yht-ohje:hover { box-shadow: var(--varjo-hover); transform: translateY(-2px); }
.ttm-yht-ohje__otsikko { font-family: var(--otsikko) !important; font-style: italic; font-weight: 800; font-size: 20px; line-height: 1.15; }
.ttm-yht-ohje__linkki { font-family: var(--otsikko) !important; font-weight: 700; color: var(--puna); }
.ttm-yht-ohje--korostus { border-left: 4px solid var(--puna); }
@media (max-width: 860px) {
  .ttm-yht-ruudukko { grid-template-columns: 1fr; gap: 20px; }
  .ttm-yht-lomake { padding: 24px 18px; }
  .ttm-yht-kortti { padding: 22px 20px; }
}
.ttm-etu-alapalkki.ttm-etu-alapalkki--3 { grid-template-columns: 1.2fr 1fr 1fr; }
@media (prefers-reduced-motion: reduce) { a.ttm-yht-ohje:hover { transform: none; } }

/* ===== Huoltolomake-sivu (wordpress/huoltolomake/sisalto.html) ===== */
.ttm-hl-vara { background: #fff; border-left: 4px solid var(--puna); border-radius: var(--r-kortti); padding: 16px 20px; box-shadow: var(--varjo); margin: 4px 0 22px; max-width: 560px; }
.ttm-hl-vara p { margin: 0 !important; font-size: 15px; line-height: 1.55; color: #3d4652; }
.ttm-hl-vara .ttm-hl-vara__otsikko { font-family: var(--otsikko) !important; font-style: italic; font-weight: 800; font-size: 19px; color: var(--teksti); margin-bottom: 4px !important; }
.ttm-hl-vaiheet ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; counter-reset: vaihe; }
.ttm-hl-vaiheet li { counter-increment: vaihe; display: grid; grid-template-columns: 34px 1fr; column-gap: 12px; margin: 0; }
.ttm-hl-vaiheet li::before { content: counter(vaihe); grid-row: span 2; width: 30px; height: 30px; border-radius: 50%; background: var(--puna); color: #fff; font-family: var(--otsikko); font-weight: 800; display: flex; align-items: center; justify-content: center; font-size: 15px; }
.ttm-hl-vaiheet b { font-family: var(--otsikko) !important; font-weight: 700; font-size: 17px; line-height: 1.3; }
.ttm-hl-vaiheet span { font-size: 15px; line-height: 1.5; color: rgba(255,255,255,.72); }

/* IvyForms-lomakkeet uuden ilmeen sivuilla: punainen Lähetä-nappi ja siisti kiitosviesti
   (IvyFormsin oletus on violetti ja sen säännöt ovat !important, siksi korkea tarkkuus) */
html body .ttm-etu button.ivyforms-button-action.ivyforms-button-action { background: var(--puna) !important; background-color: var(--puna) !important; border-color: var(--puna) !important; color: #fff !important; border-radius: var(--r-nappi) !important; text-transform: none !important; font-weight: 700 !important; min-height: 48px; padding: 0 22px !important; }
html body .ttm-etu button.ivyforms-button-action.ivyforms-button-action:hover { background: #c8141c !important; background-color: #c8141c !important; border-color: #c8141c !important; }
html body .ttm-etu .ivyforms-frontend div[class*="confirmation"][class*="confirmation"], html body .ttm-etu .ivyforms-frontend div[class*="success"][class*="success"] { background: #f4f6f8 !important; background-color: #f4f6f8 !important; border: 0 !important; border-left: 4px solid var(--puna) !important; border-radius: var(--r-kortti) !important; color: var(--teksti) !important; text-align: left !important; font-size: 16px !important; font-weight: 400 !important; }

/* ===== Varaa-sivu (wordpress/varaa/sisalto.html): yläosa uudessa ilmeessä, Amelia ennallaan ===== */
.ttm-varaa-hero { padding: 48px 0 40px; margin-bottom: 28px; }
.ttm-varaa-hero .ttm-vaiheet { margin-top: 4px; font-family: var(--otsikko) !important; font-size: 15px; }
.ttm-etu .ttm-varaa-hero .ttm-vaiheet b { background: var(--puna); width: 24px; height: 24px; font-size: 13px; }
.ttm-etu .ttm-varaa-hero .ttm-vapaat { margin: 0; max-width: 360px; justify-self: end; padding: 14px 18px 12px; border: 0; border-radius: var(--r-iso); background: #fff; box-shadow: var(--varjo-hover); border-top: 4px solid var(--puna); }
/* "Seuraava vapaa aika:" pieneksi otsikoksi, päivämäärä isolla omalle rivilleen (skripti varaa.js piirtää rakenteen) */
.ttm-etu .ttm-varaa-hero .ttm-vapaat-otsikko { display: block; position: relative; padding-left: 16px; font-family: var(--otsikko) !important; font-weight: 600; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--harmaa); }
.ttm-etu .ttm-varaa-hero .ttm-vapaat-otsikko::before { position: absolute; left: 0; top: 5px; width: 9px; height: 9px; box-shadow: 0 0 0 4px rgba(29,129,72,.15); }
.ttm-etu .ttm-varaa-hero .ttm-vapaat-aika { display: block; margin: 6px 0 0 -16px; font-family: var(--otsikko) !important; font-style: italic; font-weight: 800; font-size: clamp(20px, 2vw, 24px); line-height: 1.15; letter-spacing: -.3px; text-transform: none; color: var(--teksti); }
.ttm-etu .ttm-varaa-hero .ttm-vapaat-huom { margin: 6px 0 0 !important; font-size: 13px; color: var(--harmaa); }
.ttm-etu .ttm-varaa-hero .ttm-vapaat li { font-size: 15px; }
@media (max-width: 860px) { .ttm-varaa-hero { padding: 28px 0 28px; margin-bottom: 18px; } .ttm-etu .ttm-varaa-hero .ttm-vapaat { justify-self: stretch; max-width: none; } }

/* ===== Palvelut ja Iskarihuolto: kesän 2026 sisältö ja rakenne, uuden ilmeen typografia ja pyöristykset
   (sivujen omat tyylit ovat sisällön <style>-lohkossa, nämä ohittavat vain ilmeen) ===== */
.ttm-etu :is(.ttm-services-page, .ttm-iskari-v4) :is(h1, h2, h3, .ttm-iskari-price, .ttm-services-photo-card strong, blockquote) { font-family: var(--otsikko) !important; text-transform: none !important; }
.ttm-etu :is(.ttm-services-page, .ttm-iskari-v4) :is(h1, h2) { font-style: italic; font-weight: 800 !important; letter-spacing: -.3px !important; }
.ttm-etu :is(.ttm-services-page, .ttm-iskari-v4) h3 { font-weight: 700 !important; letter-spacing: 0 !important; }
.ttm-etu :is(.ttm-services-hero, .ttm-iskari-hero) h1 { font-size: clamp(32px, 4.6vw, 56px) !important; line-height: 1.04 !important; }
.ttm-etu :is(.ttm-services-page, .ttm-iskari-v4) h2 { font-size: clamp(24px, 2.8vw, 36px) !important; line-height: 1.1 !important; }
.ttm-etu .ttm-iskari-v4 :is(.ttm-iskari-proof-card, .ttm-iskari-cta-strip) h2 { font-size: clamp(19px, 1.9vw, 24px) !important; }
.ttm-etu .ttm-services-page :is(.ttm-service-card, .ttm-dyno-card, .ttm-service-card-body) h3 { font-size: clamp(19px, 1.8vw, 23px) !important; line-height: 1.15 !important; }
.ttm-etu .ttm-iskari-v4 .ttm-iskari-symptom-card h3 { font-size: 18px !important; }
.ttm-etu .ttm-iskari-v4 .ttm-iskari-price { font-style: italic; font-weight: 800; }
.ttm-etu :is(.ttm-services-page, .ttm-iskari-v4) :is(.ttm-services-kicker, .ttm-iskari-kicker, .ttm-services-section-head > span) { font-family: var(--otsikko) !important; font-weight: 700; }
/* Napit ja nostot samaan muotoon kuin muilla sivuilla */
.ttm-etu :is(.ttm-services-btn, .ttm-iskari-btn, .ttm-services-chips a) { border-radius: var(--r-nappi) !important; font-family: var(--otsikko) !important; font-weight: 700 !important; text-transform: none !important; letter-spacing: 0 !important; font-size: 14px !important; }
.ttm-etu :is(.ttm-services-intro-main, .ttm-services-intro-card, .ttm-services-photo-card, .ttm-services-custom-box, .ttm-services-cta-box, .ttm-iskari-proof-card, .ttm-iskari-social-proof__inner, .ttm-iskari-cta-strip__inner, .ttm-iskari-price-card, .ttm-iskari-service-card, .ttm-iskari-interval-card, .ttm-iskari-process, .ttm-iskari-feature-card) { border-radius: var(--r-iso) !important; }
.ttm-etu :is(.ttm-service-card, .ttm-dyno-card, .ttm-services-custom-image, .ttm-services-custom-list div, .ttm-services-step, .ttm-iskari-target-card, .ttm-iskari-symptom-card, .ttm-iskari-benefit-card, .ttm-iskari-shipping-note, .ttm-iskari-process-grid div, .ttm-iskari-compare div, .ttm-iskari-review-card, .ttm-iskari-faq details) { border-radius: var(--r-kortti) !important; }

/* ===== Tekstisivut (wordpress/sivut/: dyno, tietosuojaseloste, AT-laskuri, oppaat) ===== */
.ttm-teksti-hero { padding: 56px 0 40px; }
.ttm-teksti { max-width: 820px; margin: 0 auto; padding: 40px 24px 80px; font-size: 17px; line-height: 1.65; color: var(--teksti); }
.ttm-teksti.ttm-teksti--levea { max-width: 1180px; }
.ttm-teksti :is(h2, h3, h4) { font-family: var(--otsikko) !important; color: var(--teksti); line-height: 1.2; margin: 32px 0 10px; }
.ttm-teksti h2 { font-style: italic; font-weight: 800; font-size: clamp(22px, 2.4vw, 28px); }
.ttm-teksti :is(h3, h4) { font-weight: 700; font-size: 19px !important; }
.ttm-teksti :is(h2, h3, h4) strong { font-weight: inherit; }
.ttm-teksti hr { border: 0; border-top: 1px solid #e3e7ec; margin: 28px 0; opacity: 1; }
.ttm-teksti a { color: var(--puna); font-weight: 600; }
.ttm-teksti ul { padding-left: 22px; }
.ttm-teksti--tyokalu > * { background: #fff; border-radius: var(--r-iso); box-shadow: var(--varjo); padding: 24px; }
.ttm-dynohje { display: grid; grid-template-columns: repeat(2, 1fr); gap: 18px; }
.ttm-dynohje-kortti { background: #fff; border-radius: var(--r-kortti); box-shadow: var(--varjo); padding: 24px 26px; border-top: 4px solid var(--puna); }
.ttm-teksti .ttm-dynohje-kortti h2 { display: flex; align-items: center; gap: 12px; margin: 0 0 12px; font-size: 22px; }
.ttm-dynohje-kortti h2 span { flex: none; width: 32px; height: 32px; border-radius: 50%; background: var(--puna); color: #fff; font-style: normal; font-size: 16px; display: flex; align-items: center; justify-content: center; }
.ttm-dynohje-kortti ul { margin: 0; padding-left: 20px; font-size: 16px; line-height: 1.55; }
.ttm-dynohje-kortti li { margin: 0 0 6px; }
.ttm-dynohje-huom { margin: 26px 0 18px !important; font-size: 16px; color: var(--harmaa); max-width: 720px; }
@media (max-width: 860px) {
  .ttm-teksti-hero { padding: 30px 0 26px; }
  .ttm-teksti { padding: 24px 18px 60px; font-size: 16px; }
  .ttm-dynohje { grid-template-columns: 1fr; }
}

/* ===== Timo Mäki (2307): oma sisältö ja tyylit, uuden ilmeen typografia ja pyöristykset. SAG-laskuri (3963) pidetään kesän ilmeessä (Aleksi 7.10.2026). ===== */
.ttm-etu .ttm-about-page :is(h1, h2, h3) { font-family: var(--otsikko) !important; text-transform: none !important; }
.ttm-etu .ttm-about-page :is(h1, h2) { font-style: italic; font-weight: 800 !important; letter-spacing: -.3px !important; }
.ttm-etu .ttm-about-page h3 { font-weight: 700 !important; letter-spacing: 0 !important; }
.ttm-etu .ttm-about-hero h1 { font-size: clamp(32px, 4.6vw, 56px) !important; line-height: 1.04 !important; }
.ttm-etu .ttm-about-page h2 { font-size: clamp(24px, 2.8vw, 36px) !important; line-height: 1.1 !important; }
.ttm-etu .ttm-about-page .ttm-kicker { font-family: var(--otsikko) !important; font-weight: 700; }
.ttm-etu .ttm-about-page .ttm-btn { border-radius: var(--r-nappi) !important; font-family: var(--otsikko) !important; font-weight: 700 !important; text-transform: none !important; letter-spacing: 0 !important; font-size: 14px !important; }
.ttm-etu :is(.ttm-about-hero, .ttm-about-cta) { border-radius: var(--r-iso) !important; }
.ttm-etu :is(.ttm-about-card, .ttm-about-wide-card, .ttm-media-card, .ttm-about-highlight) { border-radius: var(--r-kortti) !important; }
/* SAG-laskurin säätöohjeen vaiheet omille riveilleen (rivinvaihdot tulevat skriptistä) */
.ttm-sag-page :is(#rearAction, #frontAction) { white-space: pre-line; }

/* ===== EN-sivut (2772 home, 2313 services, 2850 contact): uuden ilmeen typografia ja pyöristykset, ei värillisiä reunakorostuksia (7.10.2026) ===== */
.ttm-etu :is(.ttm-home-en-v1, .ttm-services-en-v1, .ttm-contact-en-v1) :is(h1, h2, h3, summary) { font-family: var(--otsikko) !important; text-transform: none !important; }
.ttm-etu :is(.ttm-home-en-v1, .ttm-services-en-v1, .ttm-contact-en-v1) :is(h1, h2) { font-style: italic; font-weight: 800 !important; letter-spacing: -.3px !important; }
.ttm-etu :is(.ttm-home-en-v1, .ttm-services-en-v1, .ttm-contact-en-v1) h3 { font-weight: 700 !important; letter-spacing: 0 !important; }
.ttm-etu :is(.ttm-home-hero, .ttm-services-hero, .ttm-contact-hero) h1 { font-size: clamp(34px, 5vw, 62px) !important; line-height: 1.02 !important; }
.ttm-etu :is(.ttm-home-en-v1, .ttm-services-en-v1, .ttm-contact-en-v1) h2 { font-size: clamp(24px, 2.8vw, 36px) !important; line-height: 1.1 !important; }
.ttm-etu :is(.ttm-home-kicker, .ttm-services-kicker, .ttm-contact-kicker, .ttm-home-route-card strong, .ttm-services-route-card strong, .ttm-home-pillar-card strong, .ttm-home-guide-card__content strong, .ttm-contact-card strong, .ttm-contact-service-card strong, .ttm-home-signature strong) { font-family: var(--otsikko) !important; text-transform: none !important; letter-spacing: 0 !important; }
.ttm-etu :is(.ttm-home-route-card strong, .ttm-services-route-card strong, .ttm-home-pillar-card strong, .ttm-home-guide-card__content strong, .ttm-contact-card strong, .ttm-contact-service-card strong) { font-weight: 700 !important; font-size: 18px !important; }
.ttm-etu :is(.ttm-home-btn, .ttm-services-btn, .ttm-contact-btn) { border-radius: var(--r-nappi) !important; font-family: var(--otsikko) !important; font-weight: 700 !important; text-transform: none !important; letter-spacing: 0 !important; font-size: 15px !important; }
.ttm-etu :is(.ttm-home-text-link, .ttm-services-text-link, .ttm-contact-text-link) { font-family: var(--otsikko) !important; text-transform: none !important; letter-spacing: 0 !important; font-size: 15px !important; }
.ttm-etu :is(.ttm-home-parts__box, .ttm-services-feature-box, .ttm-contact-info-box, .ttm-contact-copy-box, .ttm-home-process, .ttm-services-process) { border-radius: var(--r-iso) !important; }
.ttm-etu :is(.ttm-home-route-card, .ttm-services-route-card, .ttm-home-pillar-card, .ttm-home-guide-card, .ttm-contact-card, .ttm-contact-service-card, .ttm-home-process-grid div, .ttm-services-process-grid div, .ttm-services-info-grid div, .ttm-services-list-grid div, .ttm-contact-list-grid div, .ttm-services-faq details, .ttm-contact-faq details, .ttm-home-workshop__image, .ttm-contact-workshop__image, .ttm-services-split__image, .ttm-services-parts__image) { border-radius: var(--r-kortti) !important; }
.ttm-etu :is(.ttm-home-pillar-card, .ttm-home-parts__box, .ttm-home-guide-card, .ttm-services-feature-box, .ttm-contact-info-box, .ttm-contact-service-card) { border-top-width: 0 !important; }
.ttm-etu .ttm-home-signature div { border-left: 0 !important; padding-left: 0 !important; }

/* Koko leveys: EN-sivut ja Palvelut käyttävät omia sisäkääreitään (…-wrap), joten .ttm-etu-kääre saa ulottua reunasta reunaan (7.10.2026) */
.entry-content > .ttm-etu:has(> :is(.ttm-home-en-v1, .ttm-services-en-v1, .ttm-contact-en-v1, .ttm-services-page, .ttm-iskari-v4)) { max-width: none !important; width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }

/* ===== EN Book a service (/en/book/) ===== */
.ttm-book h2 { margin-top: 36px; }
.ttm-book h2:first-child { margin-top: 0; }
.ttm-book-vaiheet { counter-reset: v; list-style: none; padding: 0 !important; display: grid; gap: 12px; }
.ttm-book-vaiheet li { counter-increment: v; position: relative; background: #fff; border-radius: var(--r-kortti); box-shadow: var(--varjo); padding: 18px 20px 18px 64px; }
.ttm-book-vaiheet li::before { content: counter(v); position: absolute; left: 20px; top: 16px; width: 30px; height: 30px; border-radius: 50%; background: #15181d; color: #fff; font-family: var(--otsikko); font-weight: 800; display: flex; align-items: center; justify-content: center; }
.ttm-book-napit { display: flex; flex-wrap: wrap; gap: 10px; margin: 22px 0 8px; }
.ttm-teksti a.ttm-book-nappi { display: inline-flex; align-items: center; min-height: 48px; padding: 0 22px; border-radius: var(--r-nappi); border: 1.5px solid #15181d; color: #15181d; font-family: var(--otsikko); font-weight: 700; text-decoration: none; }
.ttm-teksti a.ttm-book-nappi--paa { background: var(--puna); border-color: var(--puna); color: #fff; }
.ttm-book-hinnat { list-style: none; padding: 0 !important; margin: 0; display: grid; gap: 8px; max-width: 460px; }
.ttm-book-hinnat li { display: flex; justify-content: space-between; gap: 12px; padding: 12px 16px; background: #fff; border-radius: var(--r-kortti); box-shadow: var(--varjo); }
.ttm-book-hinnat b { font-family: var(--otsikko); font-style: italic; }
.ttm-book-huom { font-size: 15px; color: var(--harmaa); }
@media (max-width: 560px) { .ttm-book-napit a { flex: 1 1 100%; justify-content: center; } }

/* ===== Google-arvostelut etusivulla (staattinen, ei lisäosaa; 7.10.2026) ===== */
.ttm-arv { padding-top: 24px; }
.ttm-arv__paa { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px 32px; flex-wrap: wrap; margin-bottom: 26px; }
.ttm-arv__paa .ttm-etu-otsikko { margin: 0; }
.ttm-arv__kicker { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 8px !important; font-family: var(--otsikko); font-weight: 700; font-size: 14px; color: var(--harmaa); }
.ttm-arv__kicker svg { width: 18px; height: 18px; }
.ttm-arv__yhteenveto { display: grid; grid-template-columns: auto auto; grid-template-rows: auto auto; column-gap: 14px; align-items: center; padding: 14px 20px; background: #fff; border-radius: var(--r-kortti); box-shadow: var(--varjo); text-decoration: none; color: var(--teksti); transition: box-shadow .2s ease, transform .2s ease; }
.ttm-arv__yhteenveto:hover { box-shadow: var(--varjo-hover); transform: translateY(-2px); }
.ttm-arv__luku { grid-row: span 2; font-family: var(--otsikko); font-style: italic; font-weight: 800; font-size: 44px; line-height: 1; letter-spacing: -1px; }
.ttm-arv__tahdet { color: #f5a623; font-size: 20px; letter-spacing: 2px; line-height: 1; }
.ttm-arv__maara { font-size: 14px; font-weight: 600; color: var(--harmaa); }
.ttm-arv__lista { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.ttm-arv__kortti { display: flex; flex-direction: column; background: #fff; border-radius: var(--r-kortti); box-shadow: var(--varjo); padding: 22px 22px 18px; }
.ttm-arv__k-tahdet { color: #f5a623; font-size: 15px; letter-spacing: 2px; margin-bottom: 10px; }
.ttm-arv__kortti blockquote { margin: 0 0 16px; padding: 0; border: 0; font-size: 16px; line-height: 1.55; color: var(--teksti); font-style: normal; font-weight: 500 !important; flex: 1; }
.ttm-arv__kortti blockquote::before, .ttm-arv__kortti blockquote::after { content: none; }
.ttm-arv__nimi { margin: 0 !important; font-family: var(--otsikko); font-weight: 700; font-size: 15px; color: var(--teksti); }
@media (max-width: 1024px) { .ttm-arv__lista { grid-template-columns: 1fr 1fr; } }
@media (max-width: 680px) {
  .ttm-arv__lista { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 12px; margin: 0 -20px; padding: 4px 20px 16px; scrollbar-width: none; }
  .ttm-arv__lista::-webkit-scrollbar { display: none; }
  .ttm-arv__kortti { flex: 0 0 84%; scroll-snap-align: start; }
  .ttm-arv__yhteenveto { width: 100%; }
}