/*
Theme Name:   berryalus-krisken
Description:  Theme enfant Asgra par Krisken
Author:       Krisken
Author URI:   https://www.krisken.fr
Template:     astra
Version:      1.0.0
*/
html{
	width: 100vw;
}
body{
	overflow-x: hidden;
}

#page{
	border: 0;
	max-width: 100vw;
}

/* GENERIQUE */
:root :where(.is-layout-flex){gap: 0;}
.ast-container{
	max-width: 100%;
	padding: 0;
}
.ast-plain-container.ast-no-sidebar #primary{
	margin-top: 0;
	margin-bottom: 0;
}
.entry-content{
	max-width: 1420px;
	padding: 0 20px;
	margin: 0 auto;
}
h1,
header.entry-header .entry-title{
	color: #fff;
	font-size: 44px;
	display: inline-block;
}
h1.entry-title:after,
h1.wp-block-post-title:before{
	content: '';
	display: block;
	width: 40px;
	height: 0;
	border-bottom: 1px solid #fff;
	margin: 20px 0;
}
h1.entry-title:before,
h1.wp-block-post-title:after{
	content: url(img/block-red.svg);
	display: inline-block;
	float: right;
	width: 12px;
	position: relative;
	right: -10px;
}
h1.wp-block-post-title:before{
	position: absolute;
	bottom: -40px;
}
h1.wp-block-post-title:after{float: none;}
.entry-content .h2{
	font-size: 2.2rem;
	font-weight: 900;
	font-family: 'Exo', sans-serif;
	line-height: 1em;
}
h2 strong{
	color: #ED1C24;
}
.h3{
	font-size: 24px;
	font-weight: 900;
	font-family: 'Exo', sans-serif;
	line-height: 1.2em;
}

/* COULEURS */
.blue{background-color: #132F55;}
.red{color: #ED1C24;}
.large-boxed{
	max-width: 94%;
	margin: 80px auto;
}

/* HEADER */
header#masthead{
	width: 100%;
	height: 290px;
	background-color: #132F55;
}
.ast-main-header-wrap.fixed{
	position: fixed;
	z-index: 99;
	width: 100%;
	max-width: 100vw;
	top: 0;
	background: #fff;
}

/* BAR TOP */
header#masthead .ast-above-header-wrap em{font-style: normal;}
#barre-contact strong:before{
	content: url(img/block-red.svg);
	display: inline-block;
	width: 12px;
	margin-left: -22px;
	margin-right: 10px;
}
.ast-site-identity{padding: 10px !important;}

/* MENU PRINCIPAL */
header#masthead .main-header-bar{background: transparent;}
nav#primary-site-navigation-desktop{overflow: hidden; background: #fff;}
	ul.main-header-menu li.home{display: none;}
	ul.main-header-menu li.home a.menu-link{
		display: block;
		width: 50px;
		height: 50px;
		overflow: hidden;
		text-indent: -200em;
		background: url(http://berryalu-solutions.fr/wp-content/uploads/2025/04/favicon.svg) no-repeat center/100%;
	}
	.ast-main-header-wrap.fixed li.home{display: flex;}
	
	ul.main-header-menu li.service{background-color: #ED1C24;}
	ul.main-header-menu li.service a.menu-link{
		color: #FFF;
		display: block;
		line-height: 1;
		align-content: center;
	}
	ul.main-header-menu li.service a.menu-link i{
		display: block;
		font-weight: normal;
		font-style: normal;
		font-size: 16px;
		text-transform: capitalize;
	}
	ul.main-header-menu a.menu-link:before{height: 2px !important;}

/* ACCUEIL */
#main article header.entry-header{
	width: 100%;
	height: calc(100vh - 290px);
	min-height: 560px;
	background-color: #132F55;
	color: #fff;
	overflow: hidden;
	display: flex;
	justify-content: space-between;
}
#main article header.entry-header .block-home-txt{
	flex-basis: 50%;
	max-width: 540px;
	margin: 0 auto;
	padding: 20px 40px;
}
#main article header.entry-header figure img{
	max-height: 100%;
	width: auto;
}

/* PAGES */
body.page:not(.home) header#header-page h2{
	font-weight: normal;
	font-size: 1.6em;
}
body.page:not(.home) header#header-page .wp-block-cover,
body.page:not(.home) header#header-page figure{
	aspect-ratio: 1/1 !important;
	overflow: hidden;
}
body.page:not(.home) header#header-page .wp-block-cover:before{
	content: '//';
	position: absolute;
	z-index: 9;
	top: 25px;
	right: 20px;
	display: block;
	width: 40px;
	height: 40px;
	text-align: center;
	line-height: 40px;
	font-size: 40px;
	font-weight: lighter;
}
	/* petite boite ancre nommmee header des pages */
	.header-ancre-content{
		position: absolute;
		right: 0;
		width: 180px;
		height: 160px;
	}
	.header-ancre-content:after{
		content: '';
    display: block;
    width: 0;
    height: 160px;
    border-left: 1px solid #fff;
    position: absolute;
		right: 0;
		top: -20px;
	}
	.header-ancre-content a:hover{color: #ed1c24 !important;}

p.preh2{
	margin-bottom: 0;
	text-transform: uppercase;
}
p.preh2:before{
	content: '';
	display: inline-block;
	width: 30px;
	margin-right: 10px;
	height: 0;
	position: relative;
	top: -5px;
	border-bottom: 1px solid #333333;
	text-transform: uppercase;
}
p.has-ast-global-color-4-color.preh2:before{border-bottom-color: #fff;}
p.preh2:after{
	content: url(img/block-red.svg);
	display: inline-block;
	width: 12px;
	height: 12px;
	margin-left: 10px;
}
ul.wp-block-list{
	margin-left: 0 !important;
	margin-bottom: 20px !important;
	padding-left: 0;
	list-style: none;
}
.entry-content ul li:before,
ul.liste-claire li:before{
	content: url(img/block-blanc.svg);
	display: inline-block;
	width: 12px;
	height: 12px;
	margin-right: 10px;
}
ul.liste-claire li:before{content: url(img/block-noir.svg);}

/* Animation ouverture schema */
.solutions .wp-block-uagb-image--effect-zoomin .wp-block-uagb-image__figure img{
	transform-origin: right bottom;
}
.solutions .wp-block-uagb-image--effect-zoomin .wp-block-uagb-image__figure:hover img{
	transform: scale(2);
}

/* ACCUEIL */
#menu-fixed{
	position: sticky;
	z-index: 950;
  top: calc(50vh - 65px);
	left: 0;
	padding-left: 10px;
	max-width: 250px;
}
#menu-fixed ul{
	list-style: none;
	padding: 0;
	margin: 0 !important;
	position: relative;
}
#menu-fixed ul:before{
	content: '';
	display: none;
	width: 44px;
	height: 110%;
	margin-top: -5%;
	background: #ed1c24;
	position: absolute;
	z-index: -1;
	top: 0;
	left: -10px;
}
#menu-fixed ul li{
	display: inline-flex;
	align-items: center;
}
#menu-fixed ul li:before{
	content: '';
	display: inline-block;
	width: 16px;
	height: 16px;
	border-radius: 8px;
	border: 2px solid #ed1c24;
	background: #fff;
	margin-right: 16px;
}
#menu-fixed ul li.active:before{
	background-color: #ed1c24;
	border-color: #ed1c24;
}
#menu-fixed ul li:hover:before{
	background-color: #132f55;
	border-color: #132f55;
}
#menu-fixed ul li a{
	display: block;
	position: relative;
	left: -300px;
	background: linear-gradient(to right, #132f55CC, #132f55E6);
	transition: all .2s linear;
	outline: 0 !important;
	font-weight: bold;
	font-size: 0.8em;
	color: #FFF;
	padding: 2px 8px;
}
#menu-fixed ul li a:before{
	content: '';
	display : inline-block;
	height : 0;
	width : 0;
	border-top : 7px solid transparent;
	border-right : 12px solid #132f55CC;
	border-bottom : 7px solid transparent;
	position: absolute;
	left: -12px;
	top: 8px;
}
#menu-fixed ul li:hover a{left: 0;}

#services .wp-block-button{
	margin: 0 -10px -10px 0;
	background: #bcccd4;	
}
#services .wp-block-button a:hover{
	background: #ffffff;
	color: #132f55;
}

/* ASIDE INSPIRATIONS */
#inspiration figure figcaption{
	background: #fff;
	color: #000;
	padding: 20px;
	margin-top: 0;
	font-size: 16px;
	line-height: 1.5;
}

body.page{
	background-image: url(img/bg-industriel.svg);
	background-size: 16px;
}

/* FOOTER */
#colophon .site-above-footer-wrap .ast-builder-footer-grid-columns{padding: 0; margin: 0; max-width: none !important;}
#colophon .site-footer-section{margin-bottom: 0 !important;}
#colophon .site-primary-footer-wrap .site-primary-footer-inner-wrap{max-width: 1160px;}
.widget{margin-bottom: 0 !important;}
#footer-contact .wp-block-uagb-marketing-button{
	flex-direction: column;
	align-items: center;
}

/* RESPONSIVE */
@media (max-width: 1200px) {
	#ast-desktop-header .site-header-above-section-center{display: none;}
	#ast-desktop-header .ast-builder-grid-row.ast-grid-center-col-layout{
		grid-template-columns: 1fr 1fr;
	}
	nav#primary-site-navigation-desktop .menu-item > .menu-link{font-size: 16px;}
	#menu-fixed{display: none;}
	
	body.home #main article header.entry-header .block-home-txt,
	body.home #main article header.entry-header .entry-featured-image{
		max-width: none;
		flex-basis: 50%;
	}
}


@media (max-width: 921px){
	header#masthead{height: auto;}
	header#masthead .main-header-bar-navigation.toggle-on{height: calc(100vh - 120px);}
	#ast-mobile-header{
		position: fixed;
		z-index: 99;
		width: 100%;
		max-width: 100vw;
		top: 0;
		background: transparent;
	}
	#masthead .ast-primary-header-bar.main-header-bar,
	#ast-mobile-header .ast-site-identity{padding: 0 !important;}
	#ast-mobile-header img.astra-logo-svg{background: #fff !important;}
	#ast-mobile-header ul#ast-hf-mobile-menu{height: 100%; padding: 5% 0;}
	#ast-mobile-header ul#ast-hf-mobile-menu li a.menu-link{
		font-size: 1.25em;
		font-weight: bold;
		color: #ed1c24;
		padding: 0 20px;
		line-height: 1;
    align-content: center;
	}
	#ast-mobile-header ul#ast-hf-mobile-menu li.current-menu-item > a.menu-link{
		background: #132f55;
		color: #fff;
	}
	
	/* GENERIQUE */
	.h3{font-size: 18px;}
	
	/* ACCUEIL */
	#menu-fixed{display: none;}
	header .custom-logo-link img{max-height: 80px;}
	#main article header.entry-header{padding-top: 90px;}
	header.entry-header .block-home-txt h1{margin-bottom: 0;}
	header.entry-header .block-home-txt p{font-size: 18px !important;}
	
	/* PAGES */
	/* cacher les débordements à cause des animations JS */
	.entry-content .wp-block-group{overflow: hidden;}
}

@media (max-width: 768px){
	/* Stop ANIMATIONS */
	[data-aos][data-aos^=slide][data-aos^=slide]{transform: none !important;}
	
	#ast-mobile-header{height: 80px;}
	#ast-mobile-header .ast-builder-menu-mobile{
		position:fixed;
		height: 100vh;
    top: 0;
	}
	header#masthead #ast-mobile-header .main-header-bar-navigation.toggle-on{height: 100vh;}
	header#masthead #ast-mobile-header ul#ast-hf-mobile-menu{padding-top: 80px;}
	header#masthead #ast-mobile-header ul#ast-hf-mobile-menu li.service a.menu-link{
		background: #ED1C24;
		color:#fff;
	}
	header#masthead #ast-mobile-header ul#ast-hf-mobile-menu li.service a.menu-link:focus{
		background: #132f55;
		color: #fff;
	}
	
	#main article header.entry-header{
		flex-direction: column;
		height: auto;
	}
	
	.grille{
		display: grid !important;
		grid-template-columns: 1fr 1fr !important;
		margin: 0 auto !important;
		padding: 20px !important;
	}
	.grille > .wp-block-uagb-container{
		margin: 0 auto !important;
		min-height: 160px;
	}
	.rwd-collapse > *,
	.entry-content .rwd-collapse > *{
		overflow: hidden;
		max-height: 0;
		transition: max-height 0.25s ease-in;
		margin: 0;
	}
	.rwd-collapse h2.wp-block-heading,
	.rwd-collapse p.preh2,
	.rwd-collapse p.rwd-collapse-btn{max-height: 100%;}
	.rwd-collapse-btn{
		background-color: #bdccd4;
    color: #132f55;
		text-transform: uppercase;
		border: 10px solid #fff;
	}
}