/* 
for new visuals 2023 
*/

/* Variables
--------------------------------------------- */

:root {	
  --color-background-xdark:#392B78;
  --color-background-dark: #C78FFF;
  --color-background-medium: #FAC2FF;
  --color-background-light: #FEF6FF;
  --color-background-light-grey: #F7F7F7;  
  --color-text:#000029;
  --color-link: #3D267D;
  
  --font-size-h2: 48px;
  --font-size-h3: 40px;
  --font-size-button: 14px;
  --font-size-cover: 48px;
  --font-size-hero: 76px;
  --font-size-p: 20px;
  --font-size-hero-p: 36px;
  
  --line-height-big: 1.35;
  --line-height-small: 1.2;
  
  --margin-front-page-content: 100px;
  --margin-content: 80px;
  
  --content-wide-width: 1510px;

}

@media (max-width: 1509px) {
  :root {
    --content-wide-width: 90vw;
    --margin-front-page-content: 5vw;
  }
}


@media (max-width: 767px) {
  :root {	
    
    --font-size-h2: 32px;
    --font-size-h3: 40px;
    --font-size-button: 14px;
    --font-size-cover: 26px;
    --font-size-hero: 36px;
    --font-size-p: 18px;
    --font-size-hero-p: 24px;
    
    /*--margin-front-page-content: 40px;*/
    --margin-content: 80px;
    --margin-front-page-content: 8vw;
    
    --margin-front-page-content: 5vw;
  }
}

@media (max-width: 599px) {
  :root {	
    --margin-content: 0px;
  }
}


/* typography */

.front-page-section-header h2,
h1, h2, .uk-article .uk-article-title {
  font-family: 'BeaufortProLight', serif;
  font-weight: 300;
}

h3 {
  font-family: 'NB-Akademie', sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 15px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.blog-article h2,
h3, .h3,
.uk-article h2.uk-article-title,
.uk-article h2.load-more-h2,
.person-title,
p,
.person-p, li {
  line-height: var(--line-height-big);
}

b, strong {
  font-weight: 400;
}

.page .front-page-section-works h2.uk-article-title,
.uk-article-title strong {
  font-weight: 300;
}

.blog .uk-article h2.uk-article-title strong {
  font-weight: 500;
}

.heading-caps.meta-categories {
  color: var(--color-text);
}


body {
  background-color: var(--color-background-light-grey);
}

body, h1, h2, .uk-article .uk-article-title,
.uk-navbar .lang-item.current-lang > a, .tm-site-branding, .tm-site-branding a, .uk-navbar-nav > li > a {
  color: var(--color-text);
}

.kaskas-background-white {
  background-color: #fff;
}

.kaskas-background-dark {
  background-color: var(--color-background-dark);
}

.kaskas-background-medium {
  background-color: var(--color-background-medium);
}

.kaskas-background-light {
  background-color: var(--color-background-light);
}

.kaskas-background-light-grey {
  background-color: var(--color-background-light-grey);
}

.tm-hero-container {
  background-color: var(--color-background-dark);
}

.uk-container {
  max-width: 100%;
  padding: 0;
}

/*
.kaskas-form input[type="submit"], .uk-button {
  padding: calc(1em + 2px) calc(5em + 2px);
  border: solid 1px #fff;
  border-radius: 0;
  background-color: transparent;
  color: #fff;
}
*/

.kaskas-form input[type="submit"], .uk-button,
.wp-block-button__link {
  color: var(--color-text) !important;
  background-color: transparent !important;
  box-shadow: inset 0 -8px 0 0 var(--color-background-dark);
  -webkit-transition: ease-out 0.4s;
  -moz-transition: ease-out 0.4s;
  transition: ease-out 0.4s;
  border: 0;
  padding: calc(3em + 2px) calc(5em + 2px);
  border-radius: 0px !important;
}

.kaskas-form input[type="submit"]:hover, .uk-button:hover,
.wp-block-button.is-style-fill a:hover {
  color: var(--color-text) !important;
  background-color: transparent !important;
}

.kaskas-form input[type="submit"]:hover, .uk-button:hover,
.wp-block-button__link:hover {
  box-shadow: inset 0 -100px 0 0 var(--color-background-dark);
  text-decoration: none !important;
}

.kaskas-form {
  overflow: auto;
}

.kaskas-form .wpcf7-acceptance > span {
  margin-left: 0; 
}

.kaskas-form .wpcf7-acceptance label {
  font-family: "NB-Akademie", sans-serif;
  font-weight: 300;
  text-transform: none;
  letter-spacing: 0;
}

.wpcf7 .wpcf7-submit:disabled {
  cursor: not-allowed;
  /*color: #888 !important;*/
}

.wpcf7 form.sent .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output {
  border-color: var(--color-background-dark);
  font-size: var(--font-size-p);
  padding: 1em;
}



@media (max-width: 767px) {
  .kaskas-form input[type="submit"], .uk-button,
  .wp-block-button__link {
    box-shadow: inset 0 -100px 0 0 var(--color-background-dark);
    text-decoration: none !important;
    max-width: 100%;
  }
  .wp-block-buttons.is-content-justification-center {
    justify-content: flex-start;
    margin-left: calc( (100% - ( var(--content-wide-width) - 2 * var(--margin-front-page-content))) / 2 );
  }
}

.wp-block-buttons {
  margin-top: 1em;
}

.wp-block-media-text {
  margin-left: 0;
  margin-right: 0;
}

.wp-block-cover, .wp-block-cover-image {
  justify-content: flex-start;
}

.wp-block-cover.aligncenter {
  justify-content: center;
}

.wp-block-cover__inner-container {
  max-width: 930px;
}

.front-page-section .front-page-section-footer a:hover, p a:hover, a:hover, .first-blog-post h1 a:hover, .no-hover-decoration:hover {
  color: inherit;
  text-decoration: underline !important;
}

p a, a {
  text-underline-offset: 0.3em;
  /*text-decoration-thickness: 0.07em;*/
}

p a:hover,
p a {
  color: var(--color-link);
  text-underline-offset: 0.3em;
  /*text-decoration-thickness: 0.07em;*/
}

.single .tm-article-image, article .wp-block-image {
  width: 100%;
  margin-top: 0;
  margin-bottom: 0;
  margin-left: 0;
}

.kaskas-wide-grid,
.blog #infinite-scroll,
.tm-article-content > .wp-block-media-text,
.tm-article-content > .wp-block-columns,
.footer-kaskas,
.kaskas-2023-front-page-padding,
.wp-block-cover,
.front-page-section-asiakkaat,
.front-page-section-numerot,
.front-page-section-works {
  /*
   padding: var(--margin-front-page-content) calc( (100% - var(--content-wide-width) + 2 * var(--margin-front-page-content)) / 2 );
   */
   padding: var(--margin-front-page-content) calc( (100% - ( var(--content-wide-width) - 2 * var(--margin-front-page-content))) / 2 );
 }
 
 .front-page-section-numerot {
   padding-bottom: 0;
 }
 
.front-page-section-diashow.uk-block {
  padding: 0 calc( (100% - var(--content-wide-width)) / 2 ) var(--margin-front-page-content);
}

.case-template-default .post-header-content,
.case-template-default .tm-article-content,
.post-template-default .related-posts,
.post-template-default .socialmedia,
.post-template-default .post-header-content,
.post-template-default .tm-article-content,
.page-template-default .tm-article-content {
  padding: 0 calc( (100% - var(--content-wide-width)) / 2 );
}

.page-template-default .tm-article-content {
  padding-bottom: var(--margin-front-page-content);
}

@media (max-width: 1509px) {
  .front-page-section-diashow.uk-block {
    padding: 0 0 var(--margin-front-page-content);
  }
}
  
.front-page-section-diashow-inner {
  overflow: hidden;
  
}

.wp-block-columns .has-background > div {
  padding: 0 1em;
}


/*
.wp-block-columns .wp-block-column.has-background {
  order: 2;
}
*/


@media (max-width: 781px) {
  .wp-block-columns .wp-block-column.has-background {
    order: 2;
  }
}


.wp-block-cover p.has-large-font-size {
  font-size: var(--font-size-cover) !important;
}

.wp-block-media-text .wp-block-media-text__content {
  /*padding: 0 0 0 var(--margin-content);*/
  padding: 0
}

.wp-block-media-text + .wp-block-columns {
  margin-top: 0;
}

.tm-main.uk-block {
  padding-bottom: 0;
}

a.blog-read-more {
  border-bottom: none !important;
  text-decoration: none;
  text-transform: none;
  letter-spacing: normal;
  font-size: 20px;
  font-weight: 400;
  margin-top: 1em;
  display: block;
}

a.blog-read-more::after {
  content: '';
  background-image: url('assets/images/2023/read_more_arrow.svg');
  width: 23px;
  height: 15px;
  display: inline-block;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin-left: 0.25em;
}

.wp-block-columns .wp-block-image {
  max-width: 50vw;
}

.wp-block-column:not(:first-child) {
  margin-left: 0;
}

.wp-block-media-text,
:where(.wp-block-columns.is-layout-flex) {
  gap: 4vw;
}

.kaskas-kivijalka p, .blog-article p, .wp-block-media-text__content p:not(.kaskas-category) {
  font-family: revert;
  font-weight: 300;
  font-size: var(--font-size-p);
  line-height: var(--line-height-big);
}

.post-template-default .tm-main,
.page-template-default .tm-article-content {
  padding-top: var(--margin-front-page-content);
}

.kaskas-offcanvas p {
  letter-spacing: 0;
  line-height: 1.5;
}

.floating-font {
  font-size: revert !important;
}

/* header */

.uk-container {
  }

.tm-hero-inner-container {
 
 
  width: 100%;
  max-width: calc(1510px + 2 * 35px);

  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  align-content: center;
  gap: 0;
  padding: 0;
  /*padding: 0 calc( (100% - ( var(--content-wide-width) - 2 * var(--margin-front-page-content))) / 2 );*/
}

.tm-hero-inner-container h1,
.home .tm-hero-inner-container p {
  font-family: 'BeaufortProLight', serif;
  font-weight: 300;
  font-size: var(--font-size-hero);
  line-height: var(--line-height-small);
}

body:not(.home) .tm-hero-inner-container p {
  margin-top: 1em;
  font-size: var(--font-size-hero-p);
}

.tm-hero-inner-container .lottie-container,
.tm-hero-inner-container h1,
.tm-hero-inner-container p {
  margin: 0 calc( (100% - ( var(--content-wide-width) - 2 * var(--margin-front-page-content))) / 2 );
}

.tm-hero-inner-container h1, .tm-hero-inner-container p {
  max-width: 1100px;
}

.home .tm-hero-inner-container p,
.page-id-7546 .tm-hero-inner-container p {
  font-size: var(--font-size-h2);
}

.tm-main > .tm-hero.uk-container {
  margin-bottom: 0;
}

.uk-article .post-header-content {
  margin-top: 0;
}

header.page-header-menu-bar {
  padding: 1em var(--margin-front-page-content);
  transition: all  300ms ease-out;
}

html[data-scroll="1"] header.page-header-menu-bar {
  padding: 0em var(--margin-front-page-content);
  transition: all 300ms ease-out;
}

header.page-header-menu-bar > div {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

header.page-header-menu-bar > div.uk-container::before, .uk-container::after {
  content: none;
}

.page-header-menu-bar {
  transition: background-color 300ms ease-out;
  background-color: var(--color-background-light);
}

html[data-scroll="1"] .page-header-menu-bar {
  background-color: var(--color-background-light);
  transition: background-color 300ms ease-out;
}

/* a maalarinteippi fix */
.tm-site > .tm-header {
  margin-top: -24px;
}

.tm-site-branding > a:first-of-type {
  display: none;
}

.tm-site-branding > a:last-of-type {
  display: block;
  width: 200px;
}

.tm-site-branding > a:last-of-type img {
  max-width: 140px;
  transition: max-width 300ms ease-out;
}

html[data-scroll="1"] .tm-site-branding > a:last-of-type img {
  max-width: 100px;
  transition: max-width 300ms ease-out;
}

.kaskas-newsletter-2023 {
  display: block; 
  width: 100px;
}

.kaskas-newsletter-2023 img {
  max-width: 100px;
  margin-bottom: -40px;
  transition: padding-top 300ms ease-out;
}

.lottie-container {
  width: 721px;
  max-width: 100%;
}

html[data-scroll="1"] .kaskas-newsletter-2023 img { 
  padding-top: 1em;
  /*max-width: 80px;*/
  transition: padding-top 300ms ease-out;
}

.uk-navbar-nav > li > a:active, .uk-navbar-nav > li.uk-active > a {
  font-weight: revert;
  color: var(--color-text);
  text-decoration: underline;
}
html .uk-nav.uk-nav-offcanvas > li.uk-active > a {
  background: transparent;
  color: var(--color-text);
}

.uk-navbar-nav > li:hover > a, .uk-navbar-nav > li > a:focus, .uk-navbar-nav > li.uk-open > a,
.uk-navbar-nav > li > a:hover {
  text-decoration: underline;
  color: var(--color-text);
  /* font-weight: 600; */
}

.icon-bar {
  border-top: 1px solid var(--color-text);
  border-bottom: 1px solid var(--color-text);
}

.uk-nav-offcanvas > .uk-open > a, html:not(.uk-touch) .uk-nav-offcanvas > li > a:hover, html:not(.uk-touch) .uk-nav-offcanvas > li > a:focus {
  background: transparent;
  color: revert;
  outline: none;
}

@media (max-width: 959px) {
  .kaskas-newsletter-2023 {
    display: none;
  }
}

@media (max-width: 767px) {
  .tm-site-branding > a:last-of-type img {
    max-width: 100px;
  }
  html[data-scroll="1"] header.page-header-menu-bar {
    padding: 1em var(--margin-front-page-content);
  }
}

@media (max-width: 599px) {
  .tm-main > .tm-hero.uk-container {
    max-height: 511px;
  } 
}

/* footer */

.wp-block-columns,
/*.uk-block,*/
.uk-margin-large-bottom {
  margin-bottom: 0px !important; 
  padding-bottom: 0;
}

.tm-footer {
  background-color: #fff;
  padding: 0;
}

.footer-kaskas {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  color: var(--color-text);
  min-height: 600px;
  position: relative;
}
.footer-kaskas::before {
  content: none; 
}
.footer-kaskas-lower {
  flex-direction: column;
  align-items: flex-start;
  position: relative;
  z-index: 2;
}
.footer-kaskas-lower > div:first-child {
  max-width: 100%;
  margin-bottom: 5em;
}
@media (max-width: 1300px) {
  form.kaskas-newsletter-form {
    margin-top: 5em;
    flex-direction: column;
    align-items: flex-start;
    gap: 1em;
  }
}
@media (min-width: 767px) {
  .footer-kaskas::before {
    content: '';
    background-image: url('assets/images/2023/kaskas_footer_image.svg');
    width: 50%;
    height: 600px;
    background-size: 152%;
    background-repeat: no-repeat;
    background-position: bottom left;
    position: absolute;
    right: calc(-1 * var(--margin-front-page-content));
    top: 0;
  }
}

.kaskas-newsletter-form input[type="email"] {
  border-bottom: solid 1px var(--color-text);
  color: var(--color-text);
}

.kaskas-newsletter-form input::placeholder {
  color: var(--color-text);
}

.footer-kaskas a {
  color: var(--color-text);
  text-decoration: none;
}

.kaskas-footer-details p {
  line-height: var(--line-height-big);  
}

.footer-link-list > li {
  margin-top: 0;
  line-height: var(--line-height-big);  
}

#floating-sidebar ul.footer-link-list  {
  margin-left: 0;  
}

.footer-link-list > li, .footer-kaskas p {
  font-size: var(--font-size-p);
  line-height: 1.35;
}

@media (max-width: 480px) {
  .kaskas-footer-details {
    flex-direction: column;
  }
  .footer-link-list {
    margin-left: 0;
    margin-top: 2em;
  }
  .kaskas-footer-logo {
    margin-top: 1em;
    max-width: 280px;
  }
}

/*

.kaskas-footer-details {
  display: flex;
  justify-content: space-between;
}

.kaskas-footer-details p:first-child {
  margin-top: 0;
}

.footer-kaskas a {
  color: #fff;
  text-decoration: underline;
}

.footer-kaskas-upper {
  display: flex;
  justify-content: space-between;
}
.footer-kaskas-lower {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.footer-kaskas-lower > div:first-child {
  flex-basis: 60%;
  max-width: 600px;
}
.footer-kaskas-lower > div:last-child {
  display: flex;
  justify-content: flex-end;
  flex-basis: 40%;
  gap: var(--content-padding);
}
.footer-kaskas-lower > div:last-child p {
  margin: 0;
}

.kaskas-footer-logo {
  margin-bottom: 2em;
}

.footer-kaskas .kaskas-footer-logo img {
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 320px;
    max-width: 100%;
}

@media screen and (max-width: 900px) {
  .footer-kaskas::before {
    width: 120px;
    height: 120px;
    top: -50px;
  }
  .footer-kaskas-lower {
    flex-wrap: wrap;
  }
}
*/

/* home */

.home .tm-main .uk-container article .tm-article-content, .archive .tm-main .uk-container article .tm-article-content, .blog .tm-main .uk-container article .tm- article-content, .page-template-page-palvelut .tm-main .uk-container article .tm-article-content {
  max-width: 100%;
}

.front-page-section .front-page-section-header + div {
  margin-top: 50px !important;
}

@media (min-width: 767px) {
  .front-page-section-works .uk-width-small-1-2 {
      width: 33.3% !important;
  }
  .front-page-section-works .uk-width-small-1-2:first-child {
      width: 33.3% !important;
  }
}
@media (max-width: 766px) {
  .front-page-section-works .uk-width-small-1-2 {
    width: 100% !important;
  }
  .front-page-section-works .uk-width-small-1-2:first-child {
    width: 100% !important;
  }
}
.front-page-section-works .uk-width-small-1-2 .single-big-picture {
    width: 100% !important;
    padding-top: 58% !important;
}
.front-page-section-works .uk-width-small-1-2:first-child .single-big-picture {
    width: 100% !important;
    padding-top: 58% !important;
}

.heading-caps.meta-categories {
  display: block;
  margin: 1.75em 0 1.25em;
}

.uk-article .meta-categories + .uk-article-title {
  margin: 0;
}

.page .front-page-section-works h2.uk-article-title {
  margin: 0;
}

/* DiaShow */

.front-page-section-diashow {
  padding-top: 0;
  overflow: hidden;
  /*
  margin-left: -12px;
  margin-right: -12px;
  */
}

/*
.front-page-section-diashow li.diashow-dia > article {
  display: block;
  margin-left: -12px;
  margin-right: -12px;
  width: calc(100% + 24px);  
}
*/

.front-page-section-diashow .uk-grid {
  margin-left: 0;
}

.front-page-section-diashow .uk-grid > * {
  padding-left: 0;
}

.diashow-dia .post-header-content {
  position: absolute;
  top: 14%;
  min-height: 36%;
  width: calc(40% - 2 * var(--margin-front-page-content));
  display: flex;
  flex-direction: column;
  justify-content: center;
  background-color: #fff;
  padding: 1.5em var(--margin-front-page-content);
}

.diashow-dia .single-big-picture {
  padding-top: 45%;
}

/*
.uk-article .meta-categories + .uk-article-title {
  margin: 1em 0;
}
*/

.diashow-dia .post-header-content h2 {
  /*
  background-color: #fff;
  height: calc(70% - 2 * var(--margin-front-page-content));
  padding-left: var(--margin-front-page-content);
  margin-top: 0 !important; 
  */
}

.diashow-dia .post-header-content .meta-categories {
  /*
  background-color: #fff;
  padding-left: var(--margin-front-page-content);
  */
}

.uk-slidenav-position .uk-slidenav {
  top: 120px;
}

.uk-slidenav-position .uk-slidenav-previous {
  /*left: 2%;*/
  left: -33%
}

.uk-slidenav-position .uk-slidenav-next {
  /*right: 2%;*/
  right: 33.7%;
}

.uk-slidenav-previous::before, .uk-slidenav-next::before {
  position: absolute;
  color: white;
  bottom: 0;
  top: unset;
  font-size: calc(6vw + 10px);
  padding: 0;
  line-height: 0.7;
  
  content: '';
  background-repeat: none;
  width: 86px;
  height: 37px;
}

.uk-slidenav-previous::before {
  background-image: url('assets/images/2023/prev.png');
}
.uk-slidenav-next::before {
  background-image: url('assets/images/2023/next.png');
}

.front-page-section-diashow h2.uk-article-title,
.front-page-section-works h2.uk-article-title {
  font-family: 'NB-Akademie', sans-serif;
  font-weight: 300;
  font-size: 20px;
}

/*
.uk-slidenav {
  display: none !important;
}
*/

body #cookie-law-info-bar {
  background-color:  var(--color-background-light) !important;
}

body #cookie_action_close_header {
  background-color: var(--color-background-dark) !important;
  border: 1px solid var(--color-background-dark) !important;
}

body #cookie_action_close_header:hover {
  background-color: var(--color-background-dark) !important;
  border: 1px solid var(--color-background-dark) !important;
}


@media (max-width: 767px) {
  /*.front-page-section-diashow .front-page-section-footer,*/
  .kaskas_dia_arrows {
    display: none; 
  } 
  .uk-slidenav-previous::before, 
  .uk-slidenav-next::before {
    content: none;
  }
  .diashow-dia .post-header-content {
    position: static;
    top: 14%;
    min-height: auto;
    width: auto;
    padding-left: calc( (100% - ( var(--content-wide-width) - 2 * var(--margin-front-page-content))) / 2 );
    padding-right: calc( (100% - ( var(--content-wide-width) - 2 * var(--margin-front-page-content))) / 2 );
    /*padding: 1.5em var(--margin-front-page-content);*/
  }
}

.diashow {
  padding: 0px 0px 35px 0px !important;
  width: 300%  !important;
  /*margin-left: -100%  !important;*/
  margin-left: 0%  !important;
}

/* Palvelut 2024 */

/*
body:not(.logged-in) .tm-primary-menu .uk-open > .uk-dropdown {
  display: none;
}
body:not(.logged-in) .tm-primary-menu .uk-icon-caret-down {
  display: none;
}
body:not(.logged-in) .kaskas-newsletter-2024 {
  display: none;
}
*/
/* mobile menu always hidden */
.tm-primary-offcanvas-menu .sub-menu {
  display: none;
}
.tm-primary-offcanvas-menu .uk-nav-parent-icon > .uk-parent > a::after {
  content: none !important;
}