/*
Theme Name: SNN Finland
Theme URI: https://snnfinland.fi
Author: SNN Finland
Author URI: https://snnfinland.fi
Description: SNN Finlandin suomenkielinen uutissivuston lohkoteema (Full Site Editing). Etusivun osiot, tärkeät uutiset, mainospaikat ja artikkelipohjat hallitaan WordPressin hallintapaneelista ilman koodin muokkausta.
Version: 1.0.1
Requires at least: 6.6
Tested up to: 6.9
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: snn-finland
Domain Path: /languages
Tags: news, blog, block-patterns, full-site-editing, wide-blocks, accessibility-ready, translation-ready, one-column, two-columns, custom-colors, custom-logo, editor-style
*/

/* ------------------------------------------------------------------
   Perusasetukset
------------------------------------------------------------------ */
html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img { max-width: 100%; height: auto; }
.screen-reader-text {
	border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
	height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important;
}
:where(a, button, input, select, textarea, summary):focus-visible {
	outline: 3px solid var(--wp--preset--color--snn-blue);
	outline-offset: 2px;
}
.skip-link.screen-reader-text:focus {
	clip: auto; clip-path: none; width: auto; height: auto; margin: 0; padding: .75rem 1.25rem;
	background: var(--wp--preset--color--snn-navy); color: #fff; z-index: 100000; left: .5rem; top: .5rem; font-weight: 600;
}
.wp-site-blocks > * { margin-block-start: 0; }
.wp-site-blocks > main, .wp-site-blocks > .snn-layout { margin-block-start: 1.75rem; }
.wp-site-blocks > footer { margin-block-start: 4rem; }
.snn-wrap { max-width: var(--wp--style--global--wide-size, 1240px); margin-inline: auto; padding-inline: 1rem; box-sizing: border-box; width: 100%; }

/* ------------------------------------------------------------------
   Tärkeät uutiset
------------------------------------------------------------------ */
.snn-breaking { background: var(--snn-bn-bg, #c8102e); color: var(--snn-bn-fg, #fff); }
.snn-breaking__inner { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: baseline; padding-block: .6rem; }
.snn-breaking__label { font-weight: 800; letter-spacing: .04em; font-size: .85rem; white-space: nowrap; }
.snn-breaking__text, .snn-breaking a { color: inherit; font-weight: 600; text-decoration: none; }
.snn-breaking a:hover { text-decoration: underline; }

/* ------------------------------------------------------------------
   Yläpalkki, tunnus ja valikko
------------------------------------------------------------------ */
.snn-topbar-row { border-bottom: 1px solid var(--wp--preset--color--snn-line); }
.snn-topbar { font-size: .85rem; color: var(--wp--preset--color--snn-muted); padding-block: .4rem; align-items: center; gap: .5rem 1.5rem; }
.snn-topbar > .snn-date { margin: 0; }
.snn-social { display: flex; flex-wrap: wrap; gap: .25rem 1rem; margin: 0; padding: 0; list-style: none; }
.snn-social a { color: inherit; text-decoration: none; font-weight: 600; }
.snn-social a:hover { color: var(--wp--preset--color--snn-blue); text-decoration: underline; }
.snn-topbar .wp-block-search { margin-left: auto; }
.snn-topbar .wp-block-search__button { background: transparent; color: var(--wp--preset--color--snn-navy); padding: .35rem .5rem; }
.snn-masthead { padding-block: 1.25rem; min-height: var(--wp--custom--snn--header-height); gap: 1rem; align-items: center; }
.snn-masthead .wp-block-site-title { margin: 0; line-height: 1; }
.snn-masthead .wp-block-site-tagline { margin: 0; color: var(--wp--preset--color--snn-muted); font-size: .95rem; }
.snn-masthead .wp-block-site-logo img { height: auto; max-height: 64px; width: auto; }
.snn-nav-row { border-top: 3px solid var(--wp--preset--color--snn-navy); border-bottom: 1px solid var(--wp--preset--color--snn-line); }
.snn-nav-row .wp-block-navigation { font-weight: 600; font-size: .98rem; padding-block: .15rem; }
.snn-nav-row .wp-block-navigation a { padding-block: .6rem; }
.snn-nav-row .wp-block-navigation .wp-block-navigation-item__content:hover { color: var(--wp--preset--color--snn-red); text-decoration: none; }
.snn-nav-row .wp-block-navigation .current-menu-item > a,
.snn-nav-row .wp-block-navigation [aria-current="page"] { box-shadow: inset 0 -3px 0 var(--wp--preset--color--snn-red); }
.wp-block-navigation__responsive-container-open, .wp-block-navigation__responsive-container-close { min-width: 44px; min-height: 44px; }

/* ------------------------------------------------------------------
   Mainokset
------------------------------------------------------------------ */
.snn-ad { margin: 1.5rem auto; text-align: center; max-width: 100%; overflow: hidden; }
.snn-ad__label { display: block; font-size: .7rem; color: var(--wp--preset--color--snn-muted); margin-bottom: .25rem; }
.snn-ad--sidebar { margin-block: 0 1.5rem; }

/* ------------------------------------------------------------------
   Etusivun osiot
------------------------------------------------------------------ */
.snn-home { display: grid; gap: 2.75rem; }
.snn-section__head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; border-top: 3px solid var(--wp--preset--color--snn-navy); padding-top: .6rem; margin-bottom: 1.1rem; }
.snn-section__title { margin: 0; font-size: 1.5rem; }
.snn-section__title a { color: inherit; text-decoration: none; }
.snn-section__title a:hover { color: var(--wp--preset--color--snn-blue); }
.snn-section__more { font-size: .9rem; font-weight: 600; white-space: nowrap; }

.snn-grid { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 235px), 1fr)); }
.snn-list { display: grid; gap: 1.25rem; }
.snn-list .snn-card { flex-direction: row; gap: 1rem; border-bottom: 1px solid var(--wp--preset--color--snn-line); padding-bottom: 1.25rem; }
.snn-list .snn-card__media { flex: 0 0 34%; max-width: 260px; }
.snn-lead { display: grid; gap: 1.5rem; grid-template-columns: 1fr; }
@media (min-width: 860px) { .snn-lead { grid-template-columns: 1.4fr 1fr; } }

.snn-card { display: flex; flex-direction: column; gap: .55rem; min-width: 0; }
.snn-card__media { display: block; position: relative; background: var(--wp--preset--color--snn-soft); aspect-ratio: 16 / 9; overflow: hidden; }
.snn-card__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.snn-card__body { display: flex; flex-direction: column; gap: .35rem; min-width: 0; }
.snn-kicker, .wp-block-post-terms.snn-kicker a { font-size: .8rem; font-weight: 700; color: var(--wp--preset--color--snn-red); text-decoration: none; letter-spacing: .02em; }
.snn-kicker:hover, .wp-block-post-terms.snn-kicker a:hover { text-decoration: underline; }
.snn-card__title { margin: 0; font-size: 1.15rem; line-height: 1.25; overflow-wrap: anywhere; }
.snn-card__title a { color: var(--wp--preset--color--snn-navy); text-decoration: none; }
.snn-card__title a:hover { color: var(--wp--preset--color--snn-blue); text-decoration: underline; }
.snn-card__excerpt { margin: 0; color: var(--wp--preset--color--snn-muted); font-size: .95rem; line-height: 1.5; }
.snn-card__date { font-size: .8rem; color: var(--wp--preset--color--snn-muted); }
.snn-card--xl .snn-card__title { font-size: clamp(1.6rem, 1.1rem + 2vw, 2.4rem); line-height: 1.15; }
.snn-card--xl .snn-card__excerpt { font-size: 1.05rem; }

.snn-hero { display: grid; gap: 1.75rem 2rem; }
.snn-hero__top { display: grid; gap: 1.75rem 2rem; grid-template-columns: 1fr; }
.snn-hero__side { display: grid; gap: 1.25rem; align-content: start; }
.snn-hero__side .snn-card { flex-direction: row; gap: .9rem; border-bottom: 1px solid var(--wp--preset--color--snn-line); padding-bottom: 1.1rem; }
.snn-hero__side .snn-card:last-child { border-bottom: 0; padding-bottom: 0; }
.snn-hero__side .snn-card__media { flex: 0 0 38%; }
.snn-hero__side .snn-card__title { font-size: 1.05rem; }
.snn-hero__more { border-top: 1px solid var(--wp--preset--color--snn-line); padding-top: 1.5rem; }
@media (min-width: 900px) { .snn-hero__top { grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr); } }

.snn-numbered { counter-reset: n; display: grid; gap: .9rem; margin: 0; padding: 0; list-style: none; }
.snn-numbered li { counter-increment: n; display: flex; gap: .8rem; align-items: baseline; border-bottom: 1px solid var(--wp--preset--color--snn-line); padding-bottom: .8rem; }
.snn-numbered li::before { content: counter(n); font-family: var(--wp--preset--font-family--snn-serif); font-size: 1.6rem; font-weight: 700; color: var(--wp--preset--color--snn-red); min-width: 1.6rem; }
.snn-numbered a { color: var(--wp--preset--color--snn-navy); font-weight: 600; text-decoration: none; line-height: 1.3; }
.snn-numbered a:hover { color: var(--wp--preset--color--snn-blue); text-decoration: underline; }

.snn-newsletter { background: var(--wp--preset--color--snn-soft); border-top: 3px solid var(--wp--preset--color--snn-blue); padding: 1.5rem; }
.snn-newsletter h2 { margin-top: 0; font-size: 1.4rem; }

/* ------------------------------------------------------------------
   Arkisto, haku ja sivupalkki
------------------------------------------------------------------ */
.snn-layout { max-width: var(--wp--style--global--wide-size, 1240px); margin-inline: auto; padding-inline: 1rem; box-sizing: border-box; width: 100%; display: grid; gap: 2.5rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 980px) { .snn-has-sidebar .snn-layout { grid-template-columns: minmax(0, 1fr) 320px; } }
.snn-archive-head { border-bottom: 3px solid var(--wp--preset--color--snn-navy); margin-bottom: 1.5rem; padding-bottom: .75rem; }
.snn-archive-head h1 { margin: 0; }
.snn-archive-head .wp-block-term-description, .snn-archive-head .snn-archive-count { color: var(--wp--preset--color--snn-muted); margin: .5rem 0 0; }
.snn-archive-query .wp-block-post-template { gap: 1.75rem 1.5rem; }
.snn-archive-query .wp-block-post-template > li { display: flex; flex-direction: column; gap: .45rem; margin: 0; }
.snn-archive-query .wp-block-post-template .wp-block-post-title { margin: 0; font-size: 1.15rem; }
.snn-archive-query .wp-block-post-template .wp-block-post-title a { color: var(--wp--preset--color--snn-navy); text-decoration: none; }
.snn-archive-query .wp-block-post-template .wp-block-post-title a:hover { color: var(--wp--preset--color--snn-blue); text-decoration: underline; }
.snn-archive-query .wp-block-post-excerpt { margin: 0; font-size: .95rem; }
.snn-archive-query .wp-block-post-date { font-size: .8rem; color: var(--wp--preset--color--snn-muted); }
.snn-archive-query .wp-block-post-featured-image { margin: 0; }
@media (min-width: 700px) {
	body:not(.paged) .snn-archive-query .wp-block-post-template.is-layout-grid > li:first-child { grid-column: 1 / -1; display: grid; grid-template-columns: 1.5fr 1fr; gap: .5rem 1.5rem; align-items: start; }
	body:not(.paged) .snn-archive-query .wp-block-post-template.is-layout-grid > li:first-child .wp-block-post-featured-image { grid-row: 1 / span 4; }
	body:not(.paged) .snn-archive-query .wp-block-post-template.is-layout-grid > li:first-child .wp-block-post-title { font-size: 2rem; line-height: 1.15; }
}
.wp-block-query-pagination { margin-top: 2.5rem; gap: .5rem; font-weight: 600; }
.wp-block-query-pagination .page-numbers, .wp-block-query-pagination a { padding: .45rem .8rem; border: 1px solid var(--wp--preset--color--snn-line); text-decoration: none; min-width: 44px; min-height: 44px; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; }
.wp-block-query-pagination .page-numbers.current { background: var(--wp--preset--color--snn-navy); color: #fff; border-color: var(--wp--preset--color--snn-navy); }
.snn-related-cats { margin-top: 2.5rem; border-top: 1px solid var(--wp--preset--color--snn-line); padding-top: 1rem; }
.snn-related-cats ul { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; padding: 0; margin: .5rem 0 0; }
.snn-related-cats a { display: inline-block; padding: .35rem .8rem; border: 1px solid var(--wp--preset--color--snn-line); border-radius: 999px; text-decoration: none; font-size: .9rem; font-weight: 600; }
.snn-sidebar { display: grid; gap: 2rem; align-content: start; }
.snn-sidebar h2 { font-size: 1.2rem; border-top: 3px solid var(--wp--preset--color--snn-navy); padding-top: .5rem; margin: 0 0 .8rem; }
.snn-side-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .8rem; }
.snn-side-list li { border-bottom: 1px solid var(--wp--preset--color--snn-line); padding-bottom: .8rem; }
.snn-side-list a { color: var(--wp--preset--color--snn-navy); font-weight: 600; font-size: .95rem; text-decoration: none; line-height: 1.3; display: block; }
.snn-side-list a:hover { color: var(--wp--preset--color--snn-blue); text-decoration: underline; }
.snn-side-list time { display: block; font-size: .8rem; color: var(--wp--preset--color--snn-muted); margin-top: .2rem; }

/* ------------------------------------------------------------------
   Artikkeli
------------------------------------------------------------------ */
.snn-breadcrumbs { font-size: .85rem; color: var(--wp--preset--color--snn-muted); margin-bottom: 1rem; }
.snn-breadcrumbs ol { display: flex; flex-wrap: wrap; gap: .25rem .5rem; list-style: none; margin: 0; padding: 0; }
.snn-breadcrumbs li:not(:last-child)::after { content: "›"; margin-left: .5rem; color: var(--wp--preset--color--snn-line); }
.snn-breadcrumbs a { color: inherit; }
.snn-article { max-width: 820px; margin-inline: auto; }
.snn-layout > * { margin-block-start: 0; }
.snn-article-head .wp-block-post-title { margin: .35rem 0 .75rem; font-size: clamp(2rem, 1.4rem + 2.6vw, 3.1rem); }
.snn-subtitle { font-family: var(--wp--preset--font-family--snn-serif); font-size: 1.3rem; line-height: 1.4; color: var(--wp--preset--color--snn-muted); margin: 0 0 1.25rem; }
.snn-meta { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; align-items: center; padding-block: .85rem; border-block: 1px solid var(--wp--preset--color--snn-line); font-size: .9rem; color: var(--wp--preset--color--snn-muted); }
.snn-meta .wp-block-post-author { align-items: center; gap: .6rem; }
.snn-meta .wp-block-post-author__avatar img { border-radius: 50%; display: block; }
.snn-meta .wp-block-post-author__name { font-weight: 700; color: var(--wp--preset--color--snn-navy); }
.snn-meta p { margin: 0; }
.snn-meta time { white-space: nowrap; }
.snn-figure { margin: 1.5rem 0 0; }
.snn-figure .wp-block-post-featured-image { margin: 0; }
.snn-figure .wp-block-post-featured-image img { width: 100%; height: auto; display: block; }
.snn-credit { font-size: .85rem; color: var(--wp--preset--color--snn-muted); margin: .5rem 0 0; }
.snn-credit__by { font-style: italic; }
.snn-article-body { font-family: var(--wp--preset--font-family--snn-serif); font-size: 1.2rem; line-height: 1.75; }
.snn-article-body > * + * { margin-block-start: 1.35em; }
.snn-article-body h2 { font-size: 1.7rem; margin-top: 2em; }
.snn-article-body h3 { font-size: 1.35rem; margin-top: 1.75em; }
.snn-article-body figcaption { font-family: var(--wp--preset--font-family--snn-sans); font-size: .85rem; color: var(--wp--preset--color--snn-muted); }
.snn-article-body a { text-decoration: underline; text-underline-offset: 2px; }
.snn-share { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin-block: 1.5rem; font-size: .9rem; }
.snn-share__title { font-weight: 700; margin-right: .25rem; }
.snn-share a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 .9rem; border: 1px solid var(--wp--preset--color--snn-line); text-decoration: none; font-weight: 600; color: var(--wp--preset--color--snn-navy); }
.snn-share a:hover { background: var(--wp--preset--color--snn-navy); color: #fff; border-color: var(--wp--preset--color--snn-navy); }
.snn-tags { font-size: .9rem; }
.snn-tags a { display: inline-block; margin: 0 .35rem .35rem 0; padding: .2rem .7rem; background: var(--wp--preset--color--snn-soft); text-decoration: none; color: var(--wp--preset--color--snn-navy); }
.snn-tags a:hover { background: var(--wp--preset--color--snn-line); }
.snn-author-box { display: flex; gap: 1rem; background: var(--wp--preset--color--snn-soft); padding: 1.25rem; margin-block: 2rem; }
.snn-author-box img { border-radius: 50%; flex: none; height: 72px; width: 72px; }
.snn-author-box__name { margin: 0; font-weight: 700; font-size: 1.1rem; }
.snn-author-box__name a { text-decoration: none; color: var(--wp--preset--color--snn-navy); }
.snn-author-box p { margin: .25rem 0 0; font-size: .95rem; }
.snn-postnav { display: grid; gap: 1rem; grid-template-columns: 1fr; border-block: 1px solid var(--wp--preset--color--snn-line); padding-block: 1rem; margin-block: 2rem; font-weight: 600; }
@media (min-width: 640px) { .snn-postnav { grid-template-columns: 1fr 1fr; } .snn-postnav > :last-child { text-align: right; } }
.snn-postnav p { margin: 0; }
.snn-related { margin-top: 2.5rem; }
.snn-progress { position: fixed; inset: 0 0 auto 0; height: 4px; z-index: 9999; background: transparent; pointer-events: none; }
.snn-progress span { display: block; height: 100%; width: 0; background: var(--wp--preset--color--snn-red); }
.admin-bar .snn-progress { top: var(--wp-admin--admin-bar--height, 32px); }

/* ------------------------------------------------------------------
   Alaosa, ylös-painike, 404
------------------------------------------------------------------ */
.snn-footer { background: var(--wp--preset--color--snn-navy); color: #e6ebf2; padding-block: 2.5rem 1.5rem; font-size: .95rem; }
.snn-footer a { color: #fff; }
.snn-footer h2, .snn-footer .wp-block-site-title, .snn-footer .wp-block-site-title a { color: #fff; font-size: 1.15rem; }
.snn-footer .wp-block-site-title { font-size: 1.75rem; margin: 0; }
.snn-footer ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .45rem; }
.snn-footer .snn-social { display: flex; }
.snn-footer__cols { display: grid; gap: 2rem; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }
.snn-footer__legal { border-top: 1px solid rgba(255, 255, 255, .2); margin-top: 2rem; padding-top: 1rem; color: #c3cddb; font-size: .85rem; display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; justify-content: space-between; }
.snn-totop { position: fixed; right: 1rem; bottom: 1rem; width: 48px; height: 48px; border: 0; border-radius: 50%; background: var(--wp--preset--color--snn-navy); color: #fff; font-size: 1.3rem; cursor: pointer; z-index: 999; box-shadow: 0 2px 8px rgba(0, 0, 0, .3); }
.snn-totop[hidden] { display: none; }
.snn-notfound { text-align: center; padding-block: 3rem; }
.snn-notfound .wp-block-search { max-width: 520px; margin-inline: auto; }

@media (max-width: 600px) {
	.snn-masthead .wp-block-site-title { font-size: 1.8rem; }
	.snn-list .snn-card__media { flex-basis: 38%; }
	.snn-author-box { flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
@media print {
	.snn-topbar, .snn-nav-row, .snn-sidebar, .snn-share, .snn-totop, .snn-progress, .snn-ad, .snn-breaking { display: none !important; }
}
