/*
Theme Name: Tomira
Theme URI: https://tomira.fi
Author: Tomira Palvelut
Description: Kevyt lohkoteema Tomira Palveluiden yksisivuiselle kotisivulle. Tumma, hillitty ilme, paikallaan pysyvä tausta ja rullatessa esiin liukuvat osiot.
Requires at least: 6.4
Tested up to: 6.8
Requires PHP: 7.4
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: tomira
*/

/* ---------- Tausta: pysyy paikallaan, sisältö rullaa päällä ---------- */
html { background: #121517; }
body { background: transparent; }
body::before {
	content: "";
	position: fixed;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background:
		url("assets/images/tausta.svg") center / cover no-repeat,
		radial-gradient(ellipse 60vw 60vh at 80% 18%, #20282b 0%, rgba(18, 21, 23, 0) 70%),
		radial-gradient(ellipse 50vw 60vh at 5% 85%, #1a2123 0%, rgba(18, 21, 23, 0) 70%),
		#121517;
}
.wp-site-blocks { background: transparent; }

/* ---------- Yläpalkki ---------- */
.tm-header { min-height: 80px; }
.tm-header .tm-logo img { width: 36px; height: 36px; display: block; }
.tm-header .tm-logo { margin: 0; }
.tm-sitename { font-family: var(--wp--preset--font-family--space-grotesk); font-size: 24px; letter-spacing: 0.02em; margin: 0; }

/* ---------- Yläosa ---------- */
.tm-hero { padding-top: 72px; padding-bottom: 80px; }
.tm-eyebrow { font-family: var(--wp--preset--font-family--space-grotesk); font-size: 14px; letter-spacing: 0.18em; color: var(--wp--preset--color--accent); margin: 0; }
.tm-h1 { font-size: clamp(40px, 5.2vw, 64px) !important; line-height: 1.04; letter-spacing: -0.02em; max-width: 900px; margin: 0; }
.tm-lead { font-size: 20px; line-height: 1.6; color: var(--wp--preset--color--muted); max-width: 600px; margin: 0; }

/* ---------- Osiot ---------- */
.tm-section { padding-bottom: 80px; }
.tm-section-title { padding-top: 24px; border-top: 1px solid rgba(255, 255, 255, 0.08); font-size: 34px !important; margin: 0; }

.tm-card {
	box-sizing: border-box;
	height: 100%;
	padding: 32px;
	border-radius: 20px;
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.08);
	box-shadow: 0 30px 60px -30px rgba(0, 0, 0, 0.65);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
}
.tm-card h3 { font-size: 26px; margin: 0; }
.tm-card p { font-size: 17px; line-height: 1.65; color: var(--wp--preset--color--muted); margin: 0; }
.tm-icon { margin: 0; }
.tm-icon img { width: 40px; height: 40px; display: block; }
.tm-icon-sm { margin: 0; flex-shrink: 0; }
.tm-icon-sm img { width: 22px; height: 22px; display: block; }

.tm-ref-image { margin: 0; }
.tm-ref-image img {
	width: 100%; height: auto; display: block;
	border-radius: 20px;
	border: 1px solid rgba(255, 255, 255, 0.08);
	box-shadow: 0 30px 60px -30px rgba(0, 0, 0, 0.65);
}
.tm-ref-text h3 { font-size: 30px; line-height: 1.2; margin: 0; }
.tm-ref-text p { font-size: 17px; line-height: 1.65; color: var(--wp--preset--color--muted); margin: 0; }

/* ---------- Yhteystiedot ---------- */
.tm-contact {
	box-sizing: border-box;
	padding: 44px 48px;
	border-radius: 28px;
	background: rgba(255, 255, 255, 0.045);
	border: 1px solid rgba(255, 255, 255, 0.09);
	box-shadow: 0 40px 80px -40px rgba(0, 0, 0, 0.75);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
}
.tm-contact h2 { font-size: 38px !important; line-height: 1.1; margin: 0; }
.tm-contact .tm-muted { font-size: 18px; line-height: 1.6; color: var(--wp--preset--color--muted); margin: 0; }
.tm-company { font-family: var(--wp--preset--font-family--space-grotesk); font-weight: 500; font-size: 24px; margin: 0; }
.tm-person { font-size: 17px; color: var(--wp--preset--color--muted); margin: 0 0 10px; }
.tm-contact-row { min-height: 44px; }
.tm-contact-row p { font-size: 18px; margin: 0; }
.tm-contact-row.is-muted p { color: var(--wp--preset--color--muted); }

/* ---------- Alatunniste ---------- */
.tm-footer { border-top: 1px solid rgba(255, 255, 255, 0.06); padding-top: 22px; padding-bottom: 22px; }
.tm-footer p { font-size: 14px; color: #8c9496; margin: 0; }

/* ---------- Mobiili ---------- */
@media (max-width: 781px) {
	.tm-lead { font-size: 17px; }
	.tm-contact { padding: 32px 28px; }
	.tm-contact h2 { font-size: 30px !important; }
	.tm-ref-text h3 { font-size: 24px; }
	.tm-card h3 { font-size: 22px; }
}

/* Tiiviimmät välit korttien ja yhteystietorivien sisällä */
.tm-card > * + * { margin-block-start: 14px !important; }
.tm-contact-row { gap: 14px !important; }
.tm-person + .tm-contact-row { margin-block-start: 6px !important; }
.tm-contact-row + .tm-contact-row { margin-block-start: 4px !important; }
