/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team & Unaniime studio
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* ===========================
   01. HTML
=========================== */

html {
	font-size: clamp(8.5px, 1.2vw + 7px, 12px);
    overflow-x : clip; 
	scroll-behavior: smooth;
	scroll-padding-top: 120px;
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation: none !important; transition: none !important; }
}

/* Coupe le scroll horizontal sur mobile sans flinguer les menus off-canvas */
@media (max-width: 767px) {
  html, body { overflow-x: clip; } /* clip > hidden pour éviter certains bugs iOS */
  .elementor-section,
  .elementor-container { overflow-x: clip; }
}

/* Sécurise les médias */
img, video, iframe { max-width: 100%; height: auto; }

/* Si tu utilises 100vw quelque part, remplace par 100%.
   En attendant, on neutralise les largeurs excessives : */
*[style*="100vw"] { width: 100% !important; }

/* ===========================
   02. Couleurs
=========================== */

:root {
    --lime-color: 227, 255, 66;
    --main-color: 14, 14, 17;
    --grey-color: 55, 55, 57;
	--light-color: 244, 244, 245;
	--lavander-color: 198, 202, 237;
}

::selection {
    color: rgba(var(--main-color),1);
    background-color: rgba(var(--lime-color),.6);
}

/* ===========================
   03. Liens
=========================== */

.link a{
  color: rgba(var(--lime-color), 1);
  text-decoration: none;
  position: relative;
  transition: color 0.3s ease, opacity 0.3s ease;
}

.link a::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: -2px;
  width: 100%;
  height: 3px;
  background-color: rgba(var(--lime-color), 1);
  transition: opacity 0.3s ease, transform 0.3s ease;
  transform-origin: left;
  transform: scaleX(1);
}

.link a:hover {
  opacity: 0.65;
}

.link a:hover::after {
  opacity: 0.65;
  transform: scaleX(1.1);
}

.link-footer a{
  color: rgba(var(--main-color), 1) !important;
  text-decoration: non;
  transition: color 0.3s ease, opacity 0.3s ease;
  position: relative;
  padding-bottom: 2px !important; 
}

.link-footer a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background: currentColor;
  transform: scaleX(1);
  transform-origin: left;
  transition: transform 0.4s ease;
}

.link-footer a:hover::after {
  transform: scaleX(0);
  transform-origin: right;
}

.s-link a::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 1px;
  width: 100%;
  height: 1px;
}

/* ===========================
   04. Boutons
=========================== */

.btn a{
	transition: transform 0.2s, box-shadow 0.2s, background 0.2s;
}

.btn a:hover{
	transform: translateY(1px);
	box-shadow: 0 0 4px rgba(var(--lime-color),.3);
}

.btn-b a{
	color : rgba(var(--light-color),1) !important;
	background: rgba(var(--main-color),1) !important;
}

.btn-b a:hover{
	background: rgba(var(--main-color),0.6) !important;
}

.btn-with-arrow a{
	padding: 6px 32px 6px 6px !important;
	align-items: center;
	transition: transform 0.2s, box-shadow 0.2s, background 0.2s, color 0.2s ease;
}

.btn-with-arrow span{
align-items: center;
}

.btn-with-arrow a:hover {
	transform: translateY(1px);
	box-shadow: 0 0 4px rgba(var(--lime-color), 0.3);
}

.elementor-button-icon svg{
	width: 36px !important;
}

.btn-with-arrow .elementor-button-icon {
	transition: transform 0.3s ease;
}

.btn-with-arrow:hover .elementor-button-icon {
	transform: translateX(4px);
}

.icon-inline {
  vertical-align: middle;
  display: inline-block;
  margin: 0 0.25em;
}


.tag a{
  display: inline-block;
  padding: 8px 16px;
  border-radius: 64px;
  color: rgba(var(--main-color), 1);
  background-color: rgba(var(--light-color), 1);
  width: auto;
  max-width: max-content !important;
  white-space: nowrap;
	margin: 4px 2px;
}

.tag a:hover{
	transform: translateY(1px);
	box-shadow: 0 0 4px rgba(var(--light-color),.3) !important;
	background-color: rgba(var(--light-color), 0.65);
}

.tag-article a{
	padding: 4px 8px;
}

/* ===========================
   05. Divers
=========================== */

ul {
  margin-bottom: 1rem !important;
}

.icon-article{
	display: inline-block;
	padding: 0;
	width: auto;
	max-width: max-content !important;
	white-space: nowrap;
}

.icon-article:hover{
	transform: translateY(1px);
	opacity: 0.65;
	box-shadow: 0 0 4px rgba(var(--light-color),.3);
	background-color: rgba(var(--light-color), 0.1);
}

.e-hotspot__button svg {
	fill: rgba(var(--lavander-color), 1) !important;
	transition: fill .3s ease;
}

.e-hotspot__button svg.is-hover {
	fill: rgba(var(--lime-color), 1) !important;
}

.e-hotspot--icon[tabindex]:focus-visible,
.zone-contour[tabindex]:focus-visible {
  outline: 2px solid rgba(var(--lime-color),1) !important;
  outline-offset: 2px;
}

.hover-svg svg circle{
	fill: rgba(var(--lime-color), 1) !important;
	transition: fill .3s ease;
}

.hover-svg svg circle:hover{
	fill: rgba(var(--lavander-color), 1) !important;
}

.zone-contour{
	border: 2px solid rgba(var(--lavander-color),1) !important;
	border-radius: 20px;
}

.zone-contour.is-hover{
	border: 2px solid rgba(var(--lime-color),1) !important;
	transition: border-color .3s ease;
}

.zone-title { 
  color: rgba(var(--lavander-color),1) !important;
  transition: color .3s ease;
}

.zone-title a {
  color: inherit;
  text-decoration: none;
  transition: color .3s ease;
}

.zone-title.is-hover,
.zone-title.is-hover a {
  color: rgba(var(--lime-color),1) !important;
}

.icon-svg svg{
	fill: none !important;
	transition: fill .3s ease;
}

.icon-svg svg circle, .icon-svg svg path{
	stroke: rgba(var(--lavander-color),1) !important;
	transition: stroke .3s ease;
}
