/* SALOPINO | BLOGI 2026-11-05: blogin korttien selkeä, responsiivinen esitystapa. */
body.salopino-blog-page{background:#f4f7fb}
.salopino-blog-page main{max-width:1180px;padding-top:48px}
.salopino-blog-page main>h1,.salopino-blog-page main>.lead{max-width:980px}
.salopino-blog-page .salopino-contact-cta{margin:30px 0 38px}
.salopino-blog-page section.grid[aria-label="Artikkelit"]{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:24px;align-items:stretch}
.salopino-blog-page section.grid[aria-label="Artikkelit"] .tile{display:flex;flex-direction:column;padding:28px;border-radius:18px;box-shadow:0 4px 16px rgba(18,38,65,.045);min-width:0;overflow-wrap:anywhere}
.salopino-blog-page section.grid[aria-label="Artikkelit"] .tile h2{font-size:clamp(1.16rem,1.45vw,1.42rem);line-height:1.35;letter-spacing:-.015em;margin-bottom:16px}
.salopino-blog-page section.grid[aria-label="Artikkelit"] .tile h2 a{text-decoration:none;color:#173b61}
.salopino-blog-page section.grid[aria-label="Artikkelit"] .tile h2 a:hover{text-decoration:underline}
.salopino-blog-page section.grid[aria-label="Artikkelit"] .tile p{color:#4c5c70;line-height:1.65;flex:1}
.salopino-blog-page section.grid[aria-label="Artikkelit"] .tile>a:last-child{align-self:flex-start;margin-top:14px;font-weight:700;text-decoration:none}
.salopino-blog-page section.grid[aria-label="Artikkelit"] .tile>a:last-child:hover{text-decoration:underline}
@media(max-width:850px){.salopino-blog-page section.grid[aria-label="Artikkelit"]{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.salopino-blog-page section.grid[aria-label="Artikkelit"]{grid-template-columns:1fr}.salopino-blog-page main{padding:30px 18px 55px}.salopino-blog-page section.grid[aria-label="Artikkelit"] .tile{padding:22px}}
/* SALOPINO | MEISTÄ: videon esikatselu, saavutettavuus ja oikea videon lataushetki. */
.salopino-about-showreel{margin:34px 0 42px;padding:clamp(24px,4vw,46px);border-radius:24px;background:linear-gradient(135deg,#10243a,#173f63);color:#fff;box-shadow:0 15px 34px rgba(15,37,61,.16)}
.salopino-about-showreel-copy{max-width:790px}
.salopino-about-eyebrow{margin:0 0 12px;text-transform:uppercase;letter-spacing:.09em;font-size:.78rem;font-weight:750;color:#b8d6f4}
.salopino-about-showreel h2{color:#fff;font-size:clamp(1.55rem,3vw,2.25rem);margin:0 0 12px}
.salopino-about-showreel-copy>p:last-child{color:#d7e4ef;max-width:780px;margin:0 0 25px}
.salopino-about-play{display:flex;align-items:center;justify-content:center;width:100%;min-height:240px;aspect-ratio:16/7;border:1px solid rgba(255,255,255,.3);border-radius:18px;background:radial-gradient(circle at 65% 25%,rgba(67,135,191,.46),transparent 48%),linear-gradient(135deg,#264f74,#0a1c2e);color:#fff;font:700 clamp(1rem,2.3vw,1.45rem)/1.4 system-ui,sans-serif;cursor:pointer;transition:filter .2s}
.salopino-about-play:hover{filter:brightness(1.15)}.salopino-about-play:focus-visible{outline:3px solid #fff;outline-offset:4px}
.salopino-about-video{display:block;width:100%;max-height:640px;border-radius:16px;background:#050e17}
.salopino-about-showreel [hidden]{display:none!important}
.salopino-about-video-caption{font-size:.86rem;color:#c6d9eb;margin:12px 0 0}
@media(max-width:600px){.salopino-about-play{min-height:180px;aspect-ratio:16/10}.salopino-about-showreel{padding:22px}}