.smi-sertifikaatit {
	opacity: 0.95;
margin-top: auto;
}
.smi-yritysosio2 {
	display: grid;
	gap: 2.5rem;
}
.smi-palvelupainikkeet {
	max-height: 25rem;
}
/* Palvelupainikkeet täysleveiksi lohkon width-asetuksesta riippumatta.
   WP 7.1 lisää wp-block-button__width-100:n renderöinnissä itsekin, WP 6.9 ei —
   ilman tätä asetuksen nollaantuminen editorissa näkyy vasta tuotannossa. */
.smi-yritysosio2 .wp-block-buttons > .wp-block-button {
	flex-basis: 100%;
	width: 100%;
}
a.wp-block-button__link.has-base-color.has-text-color.has-background {
	background-color: #000 !important;
}

/* Hero-logo (vain etusivulla). !important siellä missä arvo tulee lohkon inline-tyylistä. */
#hero > figure.wp-block-image img {
	width: clamp(15.63rem, calc(11.33vw + 10.19rem), 19.25rem) !important; /* 250px-308px 768px-1280px */
}

@media (max-width: 767px) {
	#hero > figure.wp-block-image {
		margin-top: 5vh !important;
		margin-bottom: 6vh !important;
	}
	#hero > figure.wp-block-image img {
		width: 13.75rem !important;
	}
}

/* Otsikoiden ja ingressien koot. Arvot smi-global-style.css:n :root-lohkossa. */
#hero h1 {
	font-size: var(--smi-fs-hero);
}

#merkintatyot h2,
#merkintamassat h2,
#hotformit h2,
#liikennemerkit h2 {
	font-size: var(--smi-fs-otsikko);
}

#yritys h2 {
	font-size: var(--smi-fs-osio);
}

#hero p,
#merkintatyot p,
#merkintamassat p,
#hotformit p,
#liikennemerkit p {
	font-size: var(--smi-fs-ingressi);
}

/* Palvelut-osiot: kuva aina ennen tekstiä pinotussa järjestyksessä (kuva, teksti, kuva, teksti...).
   merkintatyot/hotformit ovat jo tässä järjestyksessä lähdemarkupissa; merkintamassat/liikennemerkit
   kääntävät saraketjärjestyksen desktopilla vaihtelun vuoksi, joten ne pitää kääntää takaisin. */
@media (max-width: 781px) {
	#merkintamassat > .wp-block-column:first-child,
	#liikennemerkit > .wp-block-column:first-child {
		order: 1;
	}
	#merkintamassat > .wp-block-column:last-child,
	#liikennemerkit > .wp-block-column:last-child {
		order: -1;
	}
}
