/* Claude Design: Olli Junes Sivusto, 12.9.2026. */
.oj-design .oj-hover-1:hover { background: #FFFFFF; }
.oj-design .oj-hover-2:hover { border-color: #B0D4EE; color: #B0D4EE; }
.oj-design .oj-hover-3:hover { border-color: #231F20; }
.oj-design .oj-hover-4:hover { background: #231F20; color: #F1EEEF; }
.oj-design .oj-hover-5:hover { background: #2C2728; }
:root { --deep: #231f20; --lavender: #b0d4ee; --greige: #e3dfe0; --metric: #f1eeef; }
body, h1, h2, h3, h4, button, input, textarea, select, .btn, .site-nav .nav-brand { font-family: 'Manrope', system-ui, sans-serif; }
body { color: var(--deep); background: var(--metric); }
a { text-underline-offset: .2em; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible { outline: 3px solid #36719a; outline-offset: 4px; }
.skip-link { position: fixed; left: 20px; top: -100px; z-index: 1000; padding: 12px 20px; background: white; color: #231f20; }
.skip-link:focus { top: 12px; }
.site-nav-wrap { position: sticky; top: 0; z-index: 50; }
.site-nav { max-width: none; height: auto; min-height: 82px; padding: 18px clamp(20px, 4vw, 56px); gap: 24px; }
.site-nav .nav-links { gap: 22px; }
.site-nav .nav-links a { color: #dedbdd; font-size: 15px; font-weight: 400; }
.site-nav .nav-links a:hover, .site-nav .nav-links a.active { color: #b0d4ee; }
.site-nav .nav-links .nav-call { color: #231f20; background: #b0d4ee; font-weight: 700; padding: 12px 22px; order: 2; }
.site-nav .nav-links .nav-call:hover { background: white; color: #231f20; }
.site-nav .lang-switch { margin-left: 0; padding-left: 0; border: 0; gap: 12px; }
.site-nav .lang-switch a.active { color: #b0d4ee; font-weight: 700; }
.btn { border-radius: 999px; font-weight: 700; border-width: 1px; }
.btn-primary, .btn-lavender { background: #b0d4ee; color: #231f20; }
.btn-primary:hover, .btn-lavender:hover { background: #c5e1f5; color: #231f20; }
.page-header h1, .article-header h1 { font-weight: 300; letter-spacing: -.025em; }
.oj-design { font-family: 'Manrope', system-ui, sans-serif; color: #231f20; background: #f1eeef; }
.oj-design h1, .oj-design h2, .oj-design h3 { color: inherit; }
.oj-design a { text-decoration: none; color: inherit; transition: color .18s, background-color .18s, border-color .18s; }
.oj-design .oj-source-btn { border: 0; line-height: normal; }
.oj-design section { scroll-margin-top: 100px; }
.oj-portrait { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 0; }
.oj-design #about .oj-portrait { height: auto; aspect-ratio: auto; }
.site-footer { background: white; color: #231f20; padding: clamp(48px,6vw,80px) clamp(20px,4vw,56px) 32px; }
.site-footer .footer-grid { max-width: 1180px; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 40px; }
.site-footer .footer-col .brand { color: #231f20; font-size: 20px; }
.site-footer .footer-col h4 { color: #5a5557; font-size: 12.5px; letter-spacing: .14em; text-transform: uppercase; }
.site-footer .footer-col .tagline, .site-footer .footer-col a, .site-footer .footer-bottom { color: #3a3436; }
.site-footer .footer-col a:hover { color: #000; }
.site-footer .footer-bottom { max-width: 1180px; margin-inline: auto; border-color: #ddd7da; text-align: left; }
.site-footer .footer-col li a i { display: none; }
.footer-socials { display: flex; flex-wrap: wrap; gap: 12px 18px; margin-top: 18px; font-size: 14px; }
.article-card, .post-nav a, .blog-card { border-radius: 0; box-shadow: none; border: 1px solid #ded9db; }
.author-box { background: #f1eeef; border-radius: 0; border-color: #ded9db; }
.author-avatar { flex-shrink: 0; }
.author-avatar img { object-fit: cover; border-color: #b0d4ee; }
.author-socials { display: flex; flex-wrap: wrap; gap: 12px 20px; }
.author-socials .author-cta { color: #231f20; border-bottom: 2px solid #b0d4ee; min-height: 44px; display: inline-flex; align-items: center; }
@media (max-width: 1000px) {
 .site-nav { flex-wrap: wrap; }
 .nav-hamburger { display: block; }
 .site-nav .nav-links { display: none; position: static; width: 100%; padding: 16px 0 4px; flex-direction: column; align-items: stretch; background: #231f20; box-shadow: none; }
 .site-nav .nav-links.open { display: flex; }
 .site-nav .nav-links a { padding-block: 10px; min-height: 44px; }
 .site-nav .lang-switch { display: flex; justify-content: flex-start; }
 .site-nav .nav-links .nav-call { align-self: flex-start; }
}
@media (max-width: 700px) {
 .site-footer .footer-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 32px; }
 .site-footer .footer-col:first-child { grid-column: 1/-1; }
 .oj-design .oj-hero > div > div:first-child { flex-direction: column; align-items: stretch !important; }
 .oj-design .oj-hero > div > div:first-child > div { flex-basis: auto !important; width: 100%; }
 .author-box { flex-direction: column; align-items: flex-start; padding: 24px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; } }

.footer-socials i { display: none; }
/* Taivas toimii korostuspintana; vaalean pinnan linkeissä tarvitaan tumma väri. */
.article-body a, .post-nav .label, .post-card .post-meta, .post-card .read-more,
.timeline-year, .media-stat .stat-label, .media-card-show, .media-link,
.form-group label .required, .contact-item a:hover, .post-card h2 a:hover,
.pagination a:hover, .author-article-list li a:hover { color: #355d78; }
.pagination span.current { color: #231f20; }
.author-box .author-info { text-align: left; }