/* header */

.skip-link {
  position: absolute;
  top: 0;
  left: 0;
  transform: translateY(-100%);
  background: #000;
  color: #fff;
  padding: 10px 16px;
  z-index: 1000;
}

.skip-link:focus {
  transform: translateY(0);
}

a:focus, button:focus {
	outline: 1px solid #000 !important;
}
footer a:focus, footer button:focus {
	outline: 1px solid #fff !important;
}

.single-post h1.wp-block-post-title {
	font-size: clamp(1.8rem, 5vw, 4.5rem);
}

.custom-sub-header {
	font-size:clamp(1.1em, 3vw, 1.7em) !important;
}

.custom-slogan {
	font-size:clamp(0.8em, 3vw, 1.2em) !important;
}

body .site-header nav li {
	font-size:clamp(18px, 1.85vw, 24px) !important;
}

body .gtranslate_wrapper {
	width:auto !important;
}

body .gt_options {
	max-width: 100% !important;
	font-size:16px;
}

header.wp-block-template-part {
	margin-left:5px;
	margin-right:5px;
}

@media screen and (max-width: 600px) {
	body .wp-site-blocks .site-header .wp-block-site-logo {
		margin-bottom:0;
		max-width:100%;
	}
	body .gtranslate_wrapper {
		width:240px !important;
	}
	
}

@media screen and (min-width: 600px) and (max-width: 976px) {
	body .gtranslate_wrapper {
		width:240px !important;
	}
	.wp-block-navigation__responsive-container {
		display: block;
	}
}	
	
@media screen and (max-width: 976px) {
	
	body main {
		margin-top:15px;
	}
	
	body .site-header .wp-block-navigation__responsive-container-open {
		display: block !important;
	}
	
	body .site-header .wp-block-navigation__responsive-container-open svg {
		height:48px !important;
		width:48px !important;
	}
	/*
	body .site-header .wp-block-navigation__responsive-container-open {
		display: block;
	}
	*/
	body .site-header .wp-block-navigation__responsive-container {
		display: none !important;
		padding-bottom:2.5em;
	}
	body .site-header .wp-block-navigation__responsive-container.is-menu-open {
		display: block !important;
	}
	
	body .site-header .wp-block-navigation__container {
		display: none;
	}
	.site-header .site-header-nav {
		order:3;
		width:5%;
		min-width:40px;
	}
	.site-header .site-header-lang-selection {
		min-width:120px;
		order:2;
		flex-grow:3 !important;
		display:flex;
		align-items: center;
		justify-content: flex-end;
	}
	
	.site-header button.wp-block-navigation__responsive-container-close {
		padding:25px 15px;
	}
	
	body .site-header .wp-block-navigation__responsive-container-content {
		align-items: flex-start !important;
	}
	body .site-header ul.wp-block-navigation__container {
		align-items: stretch !important;
		width:90%;
		margin: 0 5%;
	}	
	body .site-header ul.wp-block-navigation__container .wp-block-navigation-item__content {
		font-size:26px !important;
		padding: 0.25em 0.5em !important;
	}
	body .site-header ul.wp-block-navigation__container li.wp-block-navigation-item {
		align-items: stretch !important;
		margin: 5px 0px 10px;
	}	
	body .site-header ul.wp-block-navigation__container li.wp-block-navigation-link, body .site-header ul.wp-block-navigation__container li.wp-block-navigation-submenu a.wp-block-navigation-item__content {
		border-bottom: 1px solid var(--wp--preset--color--vihrea);
	}	
	
	body .site-header ul.wp-block-navigation__container .wp-block-navigation__submenu-container li a.wp-block-navigation-item__content {
		border-bottom:none;
	}
	
	body .site-header ul.wp-block-navigation__container li.wp-block-navigation-item button {
		border-bottom: 1px solid var(--wp--preset--color--vihrea);
		padding: 5px 0px 10px !important;
	}
	body .site-header ul.wp-block-navigation__submenu-container li.wp-block-navigation-link {
		border-bottom: none;
	}
	body .site-header ul.wp-block-navigation__submenu-container {
		text-transform: none;
		font-size:22px;
		font-weight:400;
		line-height:1.2em;
		row-gap: 0 !important;
	}
	
}

@media screen and (min-width: 976px) {
	body .site-header .wp-block-navigation-submenu__toggle[aria-expanded="true"]~ul.wp-block-navigation__submenu-container {
		min-width: 240px !important;
		font-weight:400;
		line-height:1.2em;
		margin-top:0.2em;
	}
	body .site-header .wp-block-navigation .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
		white-space: nowrap;
		font-size:23px;
	}
}

/* header */


body .swiper-pagination-bullet {
	width:20px;
	height:20px;
	margin:5px;
}

ul.wp-block-latest-posts li {
	margin-bottom: 60px;
}

ul.wp-block-latest-posts:not(.is-grid) li .wp-block-latest-posts__post-title {
	display:inline-block;
	font-family: var(--wp--preset--font-family--program-narrow);
	font-weight:500;
	font-size:clamp(2.0rem, 4vw, 2.8rem);
	margin-top:0.5em;
}

.wp-block-latest-posts__read-more {
	display:none;
}

.wp-block-latest-posts__featured-image {
	aspect-ratio:16/9;
	overflow:hidden;
	margin-bottom:10px;
}
.wp-block-latest-posts__featured-image a {
	min-width:100%;
}

.wp-block-latest-posts__featured-image img {
	width:100%;
	height:100%;
	object-fit:cover;
	object-position: top;
}

.bottom-nav .wp-block-navigation-item:not(:last-child)::after {
  content: "|";
  margin: 0 0.15rem 0 0.55rem;
  opacity: 0.6;
}

.hero-slide {
  position: relative;
}

.hero-image {
	/*height:100%;*/
	right:0;
	 margin-left: auto;
	 overflow:hidden;
	  aspect-ratio: 16 / 9;
	  height:auto;
}
.hero-image figure {
	position:relative;
	height:100%;
	
	overflow:hidden;
  -webkit-mask-image: url('https://dev426.sunprofile.fi/wp-content/uploads/2026/03/Image-7.png');
  mask-image: url('https://dev426.sunprofile.fi/wp-content/uploads/2026/03/Image-7.png');
    -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;

  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;

  -webkit-mask-position: right center;
  mask-position: right center;

	object-fit: cover;
}

.hero-image figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.hero-slide .hero-text {
  position: absolute;
  top: 0;
  left: 0;

  z-index: 10;

  /* säädä näitä tarpeen mukaan */
  padding: 2.0rem 1rem 1rem;
  max-width: 550px;
}

@media screen and (max-width: 976px) {
	.hero-slide .hero-text {
		position:relative;
	}
}

body .custom-link a {
	text-decoration:none;
}

.wp-block-button__link, .custom-link, ul.wp-block-latest-posts li {
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.wp-block-button__link:hover, .custom-link:hover, ul.wp-block-latest-posts li:hover {
  transform: scale(1.05);
}

/* yhteydenottolomake */
input#hidefield {
	display:none;
}
form .custom-row {
	display:flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-start;
	align-content: flex-start;
	row-gap: 0;
	column-gap: 3%;
}
form .custom-row .custom-form-field {
	width:48%;
}

form .custom-form-field-full {
	width:100%;
}
form .custom-row input, body form .custom-form-field-full textarea {
	width:100%;
	border: 1px solid #001E5F;
	border-radius:5px;
	background-color:#F9F9F9;
	font-size:18px;
	padding:20px 25px;
}

body form button {
	font-family:var(--wp--preset--font-family--program-narrow) !important;
	font-weight:500 !important;
	font-size:23px !important;
}

@media screen and (max-width: 767px) {
	form .custom-row .custom-form-field {
		width:100%;
	}
}

/* yhteydenottolomake */

@media screen and (max-width: 980px) {
    .a2a_floating_style {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
    }
}


