/*
 Theme Name:   Julkunen Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/

.page-header, .sidebar .widget, .site-main > *{ margin-bottom:0px}
:root {/*Maxscreen - 1440, Minscreen - 480*/
	--h1-l: clamp(3.125rem, 1.1875rem + 6.4583vw, 7rem);/*h1 - 112px , 50px , 38px*/
	--h1: clamp(3.125rem, 1.5625rem + 5.2083vw, 6.25rem);/*h1 - 100px , 50px, 38px*/
	--h1-sm: clamp(3.125rem, 2.375rem + 2.5vw, 4.625rem);/*h1-sm - 74px , 50px, 38px*/
	--h2: clamp(2.5rem, 1.75rem + 2.5vw, 4rem);/*h2 - 64px , 34px*/
	--h3: clamp(2.125rem, 1.6875rem + 1.4583vw, 3rem);/*h3 - 48px , 34px*/
	--h4: clamp(1.75rem, 1.5682rem + 0.6061vw, 2rem);/*h4 - 32px , 28px*/
	--h5: clamp(1.5rem, 1.5rem + 0vw, 1.5rem);/*h5 - 24px , 24px*/
	--h6: clamp(1.25rem, 1.25rem + 0vw, 1.25rem);/*h6 - 20px , 20px*/
	
	--breakpoint-sm : 480px;
	--breakpoint-sm-md : 640px;
	--breakpoint-md : 800px;
	--breakpoint-md-lg : 960px;
	--breakpoint-lg : 1140px;
	--breakpoint-lg-xl : 1280px;
	--breakpoint-xl : 1440px;
	--breakpoint-xl-xxl : 1600px;
	--breakpoint-xxl : 1920px;
	--breakpoint-xxxl : 3840px;
	
	--grid-margin: clamp(0.9375rem, 0.4688rem + 1.5625vw, 1.875rem); /*30px -- 15px*/
	--s-200: clamp(6.875rem, 4.0625rem + 9.375vw, 12.5rem); /*200px -- 110px*/
	--s-150: clamp(5rem, 2.8125rem + 7.2917vw, 9.375rem); /*150px -- 80px*/
	--s-120: clamp(4.375rem, 2.8125rem + 5.2083vw, 7.5rem); /*120px -- 70px*/
	--s-100: clamp(4.375rem, 3.4375rem + 3.125vw, 6.25rem); /*100px -- 70px*/
	--s-80: clamp(3.75rem, 3.125rem + 2.0833vw, 5rem); /*80px -- 60px*/
	--s-70: clamp(3.125rem, 2.5rem + 2.0833vw, 4.375rem); /*70px -- 50px*/	
	--s-60: clamp(2.5rem, 1.875rem + 2.0833vw, 3.75rem); /*60px -- 40px*/
	--s-50: clamp(1.875rem, 1.25rem + 2.0833vw, 3.125rem); /*50px -- 30px*/	
	--s-40: clamp(1.875rem, 1.5625rem + 1.0417vw, 2.5rem); /*40px -- 30px*/
	--s-30: clamp(1.25rem, 0.9375rem + 1.0417vw, 1.875rem); /*30px -- 20px*/
	--s-25: clamp(1.25rem, 1.0938rem + 0.5208vw, 1.5625rem); /*25px -- 20px*/
	--s-20: clamp(0.9375rem, 0.7813rem + 0.5208vw, 1.25rem); /*20px -- 15px*/
	--s-15: clamp(0.75rem, 0.6563rem + 0.3125vw, 0.9375rem);/*15px -- 12px*/
	--s-12: clamp(0.625rem, 0.5625rem + 0.2083vw, 0.75rem); /*12px -- 10px*/
	--s-10: 0.625rem;/*10px -- 10px*/
	--s-5: 0.3125rem;/*5px -- 5px*/
	
}
/*CONTACT FORM 7*/
/*form feilds*/
input[type="text"], input[type="email"], input[type="url"], input[type="password"], input[type="search"], input[type="tel"], input[type="number"], textarea{ border-radius:4px; padding:12px var(--s-20); width:100%; font-size:18px; font-weight:500}
input[type="submit"]{font-size:18px; font-weight:500; border-radius:100px; text-align:center; width:100%}
.wpcf7-form-control-wrap{ padding-top:20px; display:block}
.contact-form-btn{ width:100%; padding-top:20px;}
.wpcf7-textarea { height:200px}

.wpcf7-list-item-label a{ text-decoration:underline}
.wpcf7-form .wpcf7-checkbox label {
  position: relative;
  cursor: pointer;
}
.wpcf7-form .wpcf7-acceptance .wpcf7-list-item{ margin-left:0px}
.wpcf7-form .wpcf7-acceptance input[type=checkbox] {
	position: relative;
  visibility: hidden;
	width: 0px;
  height: 0px;
}

.wpcf7-form .wpcf7-acceptance input[type=checkbox] + span {
/*   border: 3px solid red;  */
	padding-left: 36px;
	position:relative;
}

.wpcf7-form .wpcf7-acceptance input[type=checkbox] + span:before {
  display: block;
  position: absolute;
  content: '';
  border-radius: 4px;
 height: 24px;
  width: 24px;
  top: 0px;
  border: 1px solid var(--text-white);
	background-color:var(--text-white)
}

.wpcf7-form .wpcf7-acceptance input[type=checkbox] + span:after {
    display: block;
    position: absolute;
    content: '';
    height: 7px;
  width: 13px;
  top: 6px;
  left: 5px;
  visibility: hidden;
  font-size: 16px;
  border-width: 0px 0px 2px 2px;
  border-color: var(--text-white);
  border-style: solid;
  transform: rotate(-45deg);
	z-index:1
}

.wpcf7-form .wpcf7-acceptance input[type=checkbox]:checked + span:before {
    background: transparent;
	background-color: var(--btn-blue);
/*     border-color: red; */
}

.wpcf7-form .wpcf7-acceptance input[type=checkbox]:checked + span:after {
/*    background: #222; */
   visibility: visible;
}



/* --------------------------
   GLOBAL SCROLL ANIMATIONS
   -------------------------- */

/* Start hidden */
[data-animate] {
    opacity: 0;
    /*transform: translateY(20px);*/
    transition: all 0.5s ease-out;
}

/* When visible */
.animate-visible {
    opacity: 1;
    /*transform: translateY(0);*/
}

/* Slide Left */
[data-animate="slide-left"] {
    transform: translateX(-50%) skewX(-15deg);
	transition: all 1s ease-out;
	clip-path: inset(0 100% 0 0);
	
}
.animate-visible[data-animate="slide-left"] {
    transform: translateX(0) skewX(0deg);
	clip-path: inset(0 0 0 0);
	
}

/* Slide Left big */
[data-animate="slide-left-big"] {
    transform: translateX(-50%);
	transition: all 1s ease-out;

	
}
.animate-visible[data-animate="slide-left-big"] {
    transform: translateX(0);
	
}

/* Slide Right */
[data-animate="slide-right"] {
    transform: translateX(50%);
	transition: all 1s ease-out;
}
.animate-visible[data-animate="slide-right"] {
    transform: translateX(0);
}

/* Slide Up */
[data-animate="slide-up"] {
    transform: translateY(40px);
	opacity: 0;
}
.animate-visible[data-animate="slide-up"] {
    transform: translateY(0);
	opacity: 1;
}

/* Slide Down */
[data-animate="slide-down"]{
    margin-top:-40px;
    opacity:0;
    transition:all .8s ease;
}

.animate-visible[data-animate="slide-down"]{
    margin-top:0;
    opacity:1;
}

/* Slide Up Text */
[data-animate="slide-up-text"] {
    transform: rotate(-90deg) translate3d(-80px,0px,0px) !important;
	opacity: 0;
}
.animate-visible[data-animate="slide-up-text"] {
    transform: rotate(-90deg) translate3d(0px,0px,0px) !important;
	opacity: 1;
}

/* Slide Down Text */
[data-animate="slide-down-text"] {
    transform: rotate(90deg) translate3d(calc(100% - 80px),0px,0px) !important;
	opacity: 0;
}
.animate-visible[data-animate="slide-down-text"] {
    transform: rotate(90deg) translate3d(100%,0px,0px) !important;
	opacity: 1;
}

/* Fade In */
[data-animate="fade-in"] {
    transform: none;
}
.animate-visible[data-animate="fade-in"] {
    opacity: 1;
}

/* line grow Initial state */
[data-animate="line-left"],
[data-animate="line-right"] {
    transform: scaleX(0);
    transition: transform 0.8s ease;
}

/* Grow from left → right */
[data-animate="line-right"] {
    transform-origin: left center;
}

/* Grow from right → left */
[data-animate="line-left"] {
    transform-origin: right center;
}

/* Visible state */
.animate-visible[data-animate="line-left"],
.animate-visible[data-animate="line-right"] {
    transform: scaleX(1);
}

/*Curtain up*/
.curtain-up {
    transform: translateY(0);
    opacity: 1;
    transition: transform 1s ease-in-out, opacity 1s ease-in-out;
}

/* Animate away */
.curtain-up.animate-visible[data-animate="fade-in"] {
    transform: translateY(-100%);
    opacity: 0;
	
}



/* Delay options */
.delay-bg { transition-delay: .5s; }
.delay-1 { transition-delay: .7s; }
.delay-2 { transition-delay: .9s; }
.delay-3 { transition-delay: 1s; }
.delay-4 { transition-delay: 2s; }
.delay-5 { transition-delay: 2.6s; }
.delay-6 { transition-delay: 4.8s; }

.delay2-0 { transition-delay: 5.5s; }
.delay2-bg { transition-delay: 11.5s; }

.delay2-1 { transition-delay: 12s; }
.delay2-2 { transition-delay: 13s; }
.delay2-3 { transition-delay: 14.5s; }
.delay2-4 { transition-delay: 15s; }

#main-content-section .delay2-1 { transition-delay: .5s; }
#main-content-section .delay2-2 { transition-delay: 1.5s; }
#main-content-section .delay2-3 { transition-delay: 3s; }
#main-content-section .delay2-4, .return-visit .delay2-4 { transition-delay: 3.5s; }

.wp-block-video{ height:100%}
.wp-block-video video {
 width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* --------------------------
   GLOBAL SCROLL ANIMATIONS END
   -------------------------- */

.entry-header, .site-content {
  word-wrap: normal;
}

/*BUTTON LINE ANIMATION ON HOVER*/
.button-line:before, .button-line:after, #menu-footer-menu a.gb-menu-link:before, #menu-footer-menu a.gb-menu-link:after, #menu-main-menu a.gb-menu-link:before, #menu-main-menu a.gb-menu-link:after, .wp-block-categories-list li a:before, .wp-block-categories-list li a:after{
	content:'';
	width:0;
	height:1px;
	background:currentcolor;
	position:absolute;
	left:0px;
	 transition: width .4s ease-out;
		
}
.button-line:before, #menu-footer-menu a.gb-menu-link:before, #menu-main-menu a.gb-menu-link:before, .wp-block-categories-list li a:before{
	top:0px;
}
.button-line:after, #menu-footer-menu a.gb-menu-link:after, #menu-main-menu a.gb-menu-link:after, .wp-block-categories-list li a:after{
	bottom:0px;
}
.button-line:hover:before,
.button-line:focus:before,
.button-line:hover:after,
.button-line:focus:after,
#menu-footer-menu a.gb-menu-link:hover:before,
#menu-footer-menu a.gb-menu-link:focus:before,
#menu-footer-menu a.gb-menu-link:hover:after,
#menu-footer-menu a.gb-menu-link:focus:after,
#menu-footer-menu .current-menu-item a.gb-menu-link:before, #menu-footer-menu .current-menu-item a.gb-menu-link:after,
#menu-main-menu a.gb-menu-link:hover:before,
#menu-main-menu a.gb-menu-link:focus:before,
#menu-main-menu a.gb-menu-link:hover:after,
#menu-main-menu a.gb-menu-link:focus:after,
#menu-main-menu .current-menu-item a.gb-menu-link:before, #menu-main-menu .current-menu-item a.gb-menu-link:after,
.wp-block-categories-list li a:hover:before, .wp-block-categories-list li a:focus:before,
.wp-block-categories-list li a:hover:after, .wp-block-categories-list li a:focus:after,
.wp-block-categories-list li.current-cat a:before, .wp-block-categories-list li.current-cat a:after
{
  width:100%
}

#menu-main-menu .sub-menu a.gb-menu-link:before, #menu-main-menu .sub-menu a.gb-menu-link:after{ display:none}


/*SINGLE LINE ANIMATION ON HOVER*/
.single-line:after{
	content:'';
	width:0;
	height:2px;
	background:currentcolor;
	position:absolute;
	left:0px;
	bottom:0px;
	 transition: width .4s ease-out;		
}
.single-line:hover:after,
.single-line:focus:after{ width:100%}


/*BUTTON BG ANIMATION ON HOVER*/
.button-bgHover::before {
    content: "";
    position: absolute;
    background: var(--btn-hover);
    border-radius: 50%;
	left: 0px;
  top: 0px;
  width: 40px;
  height: 40px;
  margin-top: -20px;
  margin-left: 0px;
  transform-origin: center;
  transform: scale(0);
  transition: transform 0.6s ease-in-out;
	z-index:-1;
}

.button-bgHover:hover::before {
transform: scale(15); 
}


.button-bgHover.big:hover::before {
transform: scale(20); 
}

.button-bgHover.wht::before{ background: rgba(255, 255, 255, 0.2)}
.button-bgHover.wht:hover::before { background: rgba(255, 255, 255, 0.2) }

/*CTA*/
.cta-border:before{ content:''; width:100%; height:100%; border:2px solid currentcolor; border-radius:20px; position:absolute; left:var(--s-25); top:calc(var(--s-25) * -1); z-index:-1 }

/*BLOG PAGE*/
.page-numbers.current{ background-color:var(--btn-blue) !important}
.wp-block-categories-list{ list-style:none; margin:0px; display:flex; gap:var(--s-50); flex-wrap:wrap}
.wp-block-categories-list li a{ position:relative; padding:var(--s-12) 0px; }
/*loop first child big*/
.gb-loop-custom .gb-loop-item:first-child {display: grid;  grid-template-columns: repeat(3,minmax(0,1fr)); grid-column: 1/4;}
.gb-loop-custom .gb-loop-item:first-child img, .gb-loop-custom .gb-loop-item img{width:100%}
.gb-loop-custom .gb-loop-item:first-child .loop-custom-img{grid-column: 2/4; order:1; width:100%}
.gb-loop-custom .gb-loop-item:first-child .loop-content-custom{align-items: flex-start;  grid-column: 1/2;  padding-right: var(--s-80);}


/*BLOG DETAIL PAGE*/
.single-post .comments-area{ display:none}
.box-list{ list-style:none; margin:0px}
.box-list li{ padding-bottom:15px; padding-left:26px; position:relative}
.box-list li:before{ content:''; position:absolute; left:12px; top:11px; width:4px; height:4px; background:currentcolor; border-radius:100%}
blockquote {	border-left: 1px solid var(--text-grey); padding-top:12px; padding-bottom:12px}

/*LOGO MARQUEE SCROLL*/
.c-marquee{    
    --speed: 55s;
    position: relative;
    overflow: hidden;
    width: 100%;
}

.marquee-track{
    display: flex;
    align-items: center;
    width: max-content;
    flex-wrap: nowrap;
    animation:marqueeScroll linear infinite;
}

.c-marquee__item{
    flex: 0 0 auto;
}

.c-marquee__item img{
    display: block;
    max-height: 60px;
    filter: brightness(0) invert(0.4);
}
.dark-bg .c-marquee__item img{  filter: brightness(0) invert(0.6);}

@keyframes marqueeScroll{
    from{
        transform: translateX(0);
    }
    to{
        transform: translateX(-50%);
    }
}

@media(max-width:768px){
    .c-marquee{        
        --speed: 35s;
    }
    .c-marquee__item img{
        max-height: 42px;
    }
}

.radius-box .contact-box:first-child{ border-top-left-radius:16px;}
.radius-box .contact-box:nth-child(3){ border-top-right-radius:16px;}
.radius-box .contact-box:nth-last-child(3){ border-bottom-left-radius:16px;}
.radius-box .contact-box:last-child{ border-bottom-right-radius:16px;}

/* STICKY ROW */
.sticky-row-container {
  position: -webkit-sticky; /* Safari */
  position: sticky;
  top: 0px; /* Adjust this to set the gap from the top of the screen */
  height: fit-content; /* Ensures it doesn't stretch unnecessarily */
}
/*STICKY CONTAINER*/
.sticky-element {
	position: sticky;
	position: -webkit-sticky;
	top: var(--s-120);
}

/*VERTICAL TEXT*/
.vertical-text {
    writing-mode: vertical-rl;
    text-orientation: mixed;
}

.wh-logo img{ filter:brightness(0) invert(1)}
.home header{ position:absolute;width:100%}


/*BLOG SHARE ICON*/
.blog-share-icons{display: flex;
  justify-content: space-between; width: 100%;
  gap: var(--s-20) var(--s-40); flex-wrap: wrap;}
.blog-share-icons a{display: flex;
  gap: var(--s-12);
  align-items: center;
  font-size: 16px;
  font-weight: 600;}
.blog-share-icon{ margin-bottom:-4px}

@media (max-width:1280px) {
 .gb-loop-custom .gb-loop-item:first-child .loop-content-custom {    padding-right: 0px;  }
}

@media (max-width:1140px) {
	.radius-box .contact-box:nth-child(3){ border-top-right-radius:0px;}
.radius-box .contact-box:nth-last-child(3){ border-bottom-left-radius:0px;}
	.radius-box .contact-box:nth-child(2){ border-top-right-radius:16px;}

}

@media (max-width:960px) {
		.radius-box .contact-box:nth-child(3){ border-top-right-radius:16px;}
.radius-box .contact-box:nth-last-child(3){ border-bottom-left-radius:16px;}
	.radius-box .contact-box:nth-child(2){ border-top-right-radius:0px;}
	.vertical-text {		writing-mode: lr;}
	#menu-main-menu a.gb-menu-link:before, #menu-main-menu a.gb-menu-link:after{ display:none}
}

@media (max-width:767px) {
	
	.gb-loop-custom .gb-loop-item:first-child .loop-custom-img {    grid-column: 1/4;    order: -1;  }
	.gb-loop-custom .gb-loop-item:first-child .loop-content-custom{ grid-column: 1/4;}
	.gb-loop-custom .gb-loop-item {grid-column: 1/4;}
}


@media (max-width:640px) {
.radius-box .contact-box:nth-child(3){ border-top-right-radius:0px;}
.radius-box .contact-box:nth-last-child(3){ border-bottom-left-radius:0px;}
	.radius-box .contact-box:nth-child(2){ border-top-right-radius:16px;}
	/* Slide Up Text */
[data-animate="slide-up-text"] {
    transform: rotate(0) translate3d(-80px,0px,0px) !important;
	opacity: 0;
}
.animate-visible[data-animate="slide-up-text"] {
    transform: rotate(0deg) translate3d(0px,0px,0px) !important;
	opacity: 1;
}

/* Slide Down Text */
[data-animate="slide-down-text"] {
    transform: rotate(0deg) translate3d(calc(100% - 80px),0px,0px) !important;
	opacity: 0;
}
.animate-visible[data-animate="slide-down-text"] {
    transform: rotate(0deg) translate3d(0px,0px,0px) !important;
	opacity: 1;
}
	.blog-share-icons{		justify-content:  flex-start;}
	:root {
	--h1-l: clamp(2.375rem, 0.125rem + 7.5vw, 3.125rem);/*h1 - 112px , 50px , 38px*/
	--h1: clamp(2.375rem, 0.125rem + 7.5vw, 3.125rem);/*h1 - 100px , 50px, 38px*/
	--h1-sm: clamp(2.375rem, 0.125rem + 7.5vw, 3.125rem);/*h1-sm - 74px , 50px 38px*/
	--h2: clamp(2.125rem, 1rem + 3.75vw, 2.5rem);/*h2 - 64px , 40px , 34px*/
	--h3: clamp(1.9375rem, 1.375rem + 1.875vw, 2.125rem);/*h3 - 48px , 34px , 31px*/
	}
}

