.elementor-kit-6{--e-global-color-primary:#1B2B3E;--e-global-color-secondary:#FFFFFF;--e-global-color-text:#1B2B3E;--e-global-color-accent:#CAEBFF;--e-global-color-bb064fd:#EAF3F5;--e-global-color-dba9e2f:#73B8F0;--e-global-color-04ad67b:#7AA7CB;--e-global-color-ac9ebf6:#D9EEFB;--e-global-color-d293c9b:#FFFFFF;--e-global-color-0432f28:#AEAEAE;--e-global-color-aedfd8d:#2A3A47;--e-global-color-3e583f8:#000000;--e-global-typography-primary-font-family:"Rethink Sans";--e-global-typography-primary-font-size:4.375rem;--e-global-typography-primary-font-weight:400;--e-global-typography-primary-line-height:5rem;--e-global-typography-primary-letter-spacing:-1%;--e-global-typography-secondary-font-family:"Maax Mono";--e-global-typography-secondary-font-size:1.125rem;--e-global-typography-secondary-font-weight:400;--e-global-typography-secondary-line-height:100%;--e-global-typography-secondary-letter-spacing:0%;--e-global-typography-text-font-family:"Rethink Sans";--e-global-typography-text-font-size:1.125rem;--e-global-typography-text-font-weight:400;--e-global-typography-text-text-transform:none;--e-global-typography-text-line-height:1.75rem;--e-global-typography-text-letter-spacing:0%;--e-global-typography-accent-font-family:"Rethink Sans";--e-global-typography-accent-font-size:4.375rem;--e-global-typography-accent-font-weight:400;--e-global-typography-accent-text-transform:none;--e-global-typography-accent-line-height:5rem;--e-global-typography-accent-letter-spacing:-1%;--e-global-typography-6356e9e-font-family:"Rethink Sans";--e-global-typography-6356e9e-font-size:3.125rem;--e-global-typography-6356e9e-font-weight:400;--e-global-typography-6356e9e-line-height:3.75rem;--e-global-typography-6356e9e-letter-spacing:-1%;--e-global-typography-e4dbbd8-font-family:"Rethink Sans";--e-global-typography-e4dbbd8-font-size:clamp(2.25rem, 1.5018rem + 2.3944vw, 4.375rem);--e-global-typography-e4dbbd8-font-weight:400;--e-global-typography-e4dbbd8-line-height:1.15;--e-global-typography-e4dbbd8-letter-spacing:-1%;--e-global-typography-6e5d52b-font-family:"Rethink Sans";--e-global-typography-6e5d52b-font-size:clamp(2.25rem, 1.5018rem + 2.3944vw, 4.375rem);--e-global-typography-6e5d52b-font-weight:400;--e-global-typography-6e5d52b-line-height:1.15;--e-global-typography-6e5d52b-letter-spacing:-1%;--e-global-typography-c76a5bd-font-family:"Rethink Sans";--e-global-typography-c76a5bd-font-size:clamp(1.75rem, 1.2658rem + 1.5493vw, 3.125rem);--e-global-typography-c76a5bd-font-weight:400;--e-global-typography-c76a5bd-line-height:1.2;--e-global-typography-c76a5bd-letter-spacing:-1%;--e-global-typography-f201480-font-family:"Rethink Sans";--e-global-typography-f201480-font-size:clamp(1.5rem, 1.1479rem + 1.1268vw, 2.5rem);--e-global-typography-f201480-font-weight:400;--e-global-typography-f201480-line-height:1.25;--e-global-typography-f201480-letter-spacing:-1%;--e-global-typography-2bee568-font-family:"Rethink Sans";--e-global-typography-2bee568-font-size:clamp(1rem, 0.956rem + 0.1408vw, 1.125rem);--e-global-typography-2bee568-font-weight:400;--e-global-typography-2bee568-line-height:1.5;--e-global-typography-2bee568-letter-spacing:0%;--e-global-typography-fb7549a-font-family:"Maax Mono";--e-global-typography-fb7549a-font-size:clamp(1rem, 0.956rem + 0.1408vw, 1.125rem);--e-global-typography-fb7549a-font-weight:400;--e-global-typography-fb7549a-line-height:1;--e-global-typography-fb7549a-letter-spacing:0%;--e-global-typography-d960805-font-family:"Maax Mono";--e-global-typography-d960805-font-size:0.75rem;--e-global-typography-d960805-font-weight:400;--e-global-typography-d960805-line-height:100%;--e-global-typography-d960805-letter-spacing:0%;background-color:var( --e-global-color-d293c9b );color:var( --e-global-color-text );font-family:var( --e-global-typography-2bee568-font-family ), Sans-serif;font-size:var( --e-global-typography-2bee568-font-size );font-weight:var( --e-global-typography-2bee568-font-weight );line-height:var( --e-global-typography-2bee568-line-height );letter-spacing:var( --e-global-typography-2bee568-letter-spacing );}.elementor-kit-6 a{color:var( --e-global-color-dba9e2f );}.elementor-kit-6 a:hover{color:var( --e-global-color-04ad67b );}.elementor-kit-6 h1{font-family:var( --e-global-typography-e4dbbd8-font-family ), Sans-serif;font-size:var( --e-global-typography-e4dbbd8-font-size );font-weight:var( --e-global-typography-e4dbbd8-font-weight );line-height:var( --e-global-typography-e4dbbd8-line-height );letter-spacing:var( --e-global-typography-e4dbbd8-letter-spacing );}.elementor-kit-6 h2{font-family:var( --e-global-typography-6e5d52b-font-family ), Sans-serif;font-size:var( --e-global-typography-6e5d52b-font-size );font-weight:var( --e-global-typography-6e5d52b-font-weight );line-height:var( --e-global-typography-6e5d52b-line-height );letter-spacing:var( --e-global-typography-6e5d52b-letter-spacing );}.elementor-kit-6 h3{font-family:var( --e-global-typography-c76a5bd-font-family ), Sans-serif;font-size:var( --e-global-typography-c76a5bd-font-size );font-weight:var( --e-global-typography-c76a5bd-font-weight );line-height:var( --e-global-typography-c76a5bd-line-height );letter-spacing:var( --e-global-typography-c76a5bd-letter-spacing );}.elementor-kit-6 h4{font-family:var( --e-global-typography-f201480-font-family ), Sans-serif;font-size:var( --e-global-typography-f201480-font-size );font-weight:var( --e-global-typography-f201480-font-weight );line-height:var( --e-global-typography-f201480-line-height );letter-spacing:var( --e-global-typography-f201480-letter-spacing );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1366px){.elementor-kit-6{--e-global-typography-primary-font-size:50px;--e-global-typography-secondary-font-size:16px;--e-global-typography-text-font-size:16px;--e-global-typography-accent-font-size:40px;--e-global-typography-6356e9e-font-size:30px;font-size:var( --e-global-typography-2bee568-font-size );line-height:var( --e-global-typography-2bee568-line-height );letter-spacing:var( --e-global-typography-2bee568-letter-spacing );}.elementor-kit-6 h1{font-size:var( --e-global-typography-e4dbbd8-font-size );line-height:var( --e-global-typography-e4dbbd8-line-height );letter-spacing:var( --e-global-typography-e4dbbd8-letter-spacing );}.elementor-kit-6 h2{font-size:var( --e-global-typography-6e5d52b-font-size );line-height:var( --e-global-typography-6e5d52b-line-height );letter-spacing:var( --e-global-typography-6e5d52b-letter-spacing );}.elementor-kit-6 h3{font-size:var( --e-global-typography-c76a5bd-font-size );line-height:var( --e-global-typography-c76a5bd-line-height );letter-spacing:var( --e-global-typography-c76a5bd-letter-spacing );}.elementor-kit-6 h4{font-size:var( --e-global-typography-f201480-font-size );line-height:var( --e-global-typography-f201480-line-height );letter-spacing:var( --e-global-typography-f201480-letter-spacing );}}@media(max-width:1024px){.elementor-kit-6{--e-global-typography-primary-font-size:50px;--e-global-typography-secondary-font-size:16px;--e-global-typography-text-font-size:16px;--e-global-typography-accent-font-size:35px;--e-global-typography-6356e9e-font-size:25px;font-size:var( --e-global-typography-2bee568-font-size );line-height:var( --e-global-typography-2bee568-line-height );letter-spacing:var( --e-global-typography-2bee568-letter-spacing );}.elementor-kit-6 h1{font-size:var( --e-global-typography-e4dbbd8-font-size );line-height:var( --e-global-typography-e4dbbd8-line-height );letter-spacing:var( --e-global-typography-e4dbbd8-letter-spacing );}.elementor-kit-6 h2{font-size:var( --e-global-typography-6e5d52b-font-size );line-height:var( --e-global-typography-6e5d52b-line-height );letter-spacing:var( --e-global-typography-6e5d52b-letter-spacing );}.elementor-kit-6 h3{font-size:var( --e-global-typography-c76a5bd-font-size );line-height:var( --e-global-typography-c76a5bd-line-height );letter-spacing:var( --e-global-typography-c76a5bd-letter-spacing );}.elementor-kit-6 h4{font-size:var( --e-global-typography-f201480-font-size );line-height:var( --e-global-typography-f201480-line-height );letter-spacing:var( --e-global-typography-f201480-letter-spacing );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-6{font-size:var( --e-global-typography-2bee568-font-size );line-height:var( --e-global-typography-2bee568-line-height );letter-spacing:var( --e-global-typography-2bee568-letter-spacing );}.elementor-kit-6 h1{font-size:var( --e-global-typography-e4dbbd8-font-size );line-height:var( --e-global-typography-e4dbbd8-line-height );letter-spacing:var( --e-global-typography-e4dbbd8-letter-spacing );}.elementor-kit-6 h2{font-size:var( --e-global-typography-6e5d52b-font-size );line-height:var( --e-global-typography-6e5d52b-line-height );letter-spacing:var( --e-global-typography-6e5d52b-letter-spacing );}.elementor-kit-6 h3{font-size:var( --e-global-typography-c76a5bd-font-size );line-height:var( --e-global-typography-c76a5bd-line-height );letter-spacing:var( --e-global-typography-c76a5bd-letter-spacing );}.elementor-kit-6 h4{font-size:var( --e-global-typography-f201480-font-size );line-height:var( --e-global-typography-f201480-line-height );letter-spacing:var( --e-global-typography-f201480-letter-spacing );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ==========================================================================
   TechVibes – Custom Elementor Stylesheet
   ========================================================================== */


/* ==========================================================================
   1. CONTAINER WIDTHS
   Largeurs max utilisées sur les sections principales.
   ========================================================================== */

.xxl-width { max-width: 1920px; }
.xl-width  { max-width: 1780px; }
.l-width   { max-width: 1477px; }
.m-width   { max-width: 1328px; }
.s-width   { max-width: 1176px; }
.f-width   { max-width: 1640px; }


/* ==========================================================================
   2. PADDING SYSTEM
   Paddings horizontaux synchronisés avec la largeur du container parent.
   Sélecteur :has() — fallback géré via .responsive-padding en dessous de 1366px.
   ========================================================================== */

@media (min-width: 1366px) and (max-width: 1920px) {
    div:has(> .xxl-width) { padding-inline: 0%; }
    div:has(> .xl-width)  { padding-inline: 3%; }
    div:has(> .f-width)   { padding-inline: 7%; }
    div:has(> .l-width)   { padding-inline: 11%; }
    div:has(> .m-width)   { padding-inline: 15%; }
    div:has(> .s-width)   { padding-inline: 19%; }
}

/* Fallback < 1366px : classe à appliquer manuellement sur la section */
@media (max-width: 1365.98px) {
    .responsive-padding {
        padding-inline: 5%;
    }
}


/* ==========================================================================
   3. RESPONSIVE IMAGES
   À appliquer uniquement sur les blocs visuels (hero, banner, card cover).
   Ne pas utiliser en règle globale — casse les ratios des images de contenu.
   ========================================================================== */

@media (max-width: 1024px) {
    .responsive-img img {
        width: 100% !important;
        height: 400px !important;
        object-fit: cover !important;
        object-position: center center !important;
    }
}

@media (max-width: 767px) {
    .responsive-img img {
        height: 300px !important;
    }
}


/* ==========================================================================
   4. HEADER – NAV MENU
   Underline animé au hover + ajustements responsive entre 1367 et 1855px.
   ========================================================================== */

.header-nav-menu a::after {
    content: "";
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 0 !important;
    height: 3px !important;
    background-color: var(--e-global-color-dba9e2f) !important;
    transition: width 0.5s ease !important;
}

.header-nav-menu a:hover::after {
    width: 100% !important;
}

/* Espacement et taille de police selon largeur écran */
@media (min-width: 1367px) and (max-width: 1414.98px) {
    .header-nav-menu { --e-nav-menu-horizontal-menu-item-margin: calc(30px / 2) !important; }
    .header-nav-menu a { font-size: 14px !important; }
    #margin-top { margin-top: 0 !important; }
}

@media (min-width: 1415px) and (max-width: 1549.98px) {
    .header-nav-menu { --e-nav-menu-horizontal-menu-item-margin: calc(40px / 2) !important; }
    .header-nav-menu a { font-size: 14px !important; }
    #margin-top { margin-top: 0 !important; }
}

@media (min-width: 1550px) and (max-width: 1855px) {
    .header-nav-menu { --e-nav-menu-horizontal-menu-item-margin: calc(40px / 2) !important; }
    .header-nav-menu a { font-size: 16px !important; }
    #margin-top { margin-top: 0 !important; }
}


/* ==========================================================================
   4b. MOBILE MENU (Off-Canvas + Nav Menu vertical)
   Markup Elementor Pro : .e-off-canvas__content > nav.elementor-nav-menu--main
   Sous-menus gérés par SmartMenus (état via aria-expanded).
   ========================================================================== */

/* --- Liens principaux : underline animé --- */
.e-off-canvas__content .elementor-nav-menu--main .elementor-item {
    position: relative;
    display: inline-block;
}

.e-off-canvas__content .elementor-nav-menu--main .elementor-item::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background-color: var(--e-global-color-dba9e2f);
    transition: width 0.4s ease;
}

.e-off-canvas__content .elementor-nav-menu--main .elementor-item:hover::after,
.e-off-canvas__content .elementor-nav-menu--main .elementor-item.elementor-item-active::after,
.e-off-canvas__content .elementor-nav-menu--main .elementor-item.highlighted::after {
    width: 100%;
}

/* --- Sous-menu : reset des styles desktop en mode vertical (off-canvas) --- */
.elementor-nav-menu--main.elementor-nav-menu--layout-vertical .sub-menu {
    position: static !important;
    width: 100% !important;
    margin: 0 !important;
    padding-left: 1.5rem !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.elementor-nav-menu--main.elementor-nav-menu--layout-vertical .sub-menu .elementor-sub-item {
    display: block !important;
    padding: 10px 0 !important;
    font-size: 16px !important;
    line-height: 1.4 !important;
    white-space: normal !important;
}

/* --- Sous-items : underline discret au hover --- */
.e-off-canvas__content .elementor-nav-menu--main .elementor-sub-item {
    position: relative;
}

.e-off-canvas__content .elementor-nav-menu--main .elementor-sub-item::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 1px;
    background-color: var(--e-global-color-dba9e2f);
    transition: width 0.4s ease;
}

.e-off-canvas__content .elementor-nav-menu--main .elementor-sub-item:hover::after {
    width: 100%;
}

/* --- Flèche indicatrice (le <i> natif est vide en DB) --- */
.e-off-canvas__content .elementor-nav-menu--main .sub-arrow,
.elementor-nav-menu--main.elementor-nav-menu--layout-vertical .has-submenu .sub-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 8px;
    width: 14px;
    height: 14px;
    transition: transform 0.3s ease;
}

/* Icône dessinée en CSS (chevron via border) */
.e-off-canvas__content .elementor-nav-menu--main .sub-arrow::before,
.elementor-nav-menu--main.elementor-nav-menu--layout-vertical .has-submenu .sub-arrow::before {
    content: "";
    display: block;
    width: 8px;
    height: 8px;
    margin-top: -2px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(-45deg);
    transition: transform 0.3s ease;
}

/* État ouvert : flèche pointe vers le haut */
.e-off-canvas__content .elementor-nav-menu--main [aria-expanded="true"] > .sub-arrow::before,
.elementor-nav-menu--main.elementor-nav-menu--layout-vertical .has-submenu[aria-expanded="true"] .sub-arrow::before {
    margin-top: 2px;
    transform: rotate(-225deg);
}


/* ==========================================================================
   5. CONTACT FORM
   ========================================================================== */

#contactform .elementor-field:focus {
    outline: none !important;
    box-shadow: none !important;
}


/* ==========================================================================
   6. CONTACT PAGE – Layout ajustements
   ========================================================================== */

/* Espacement items horizontaux + redimensionnement image décorative */
@media (min-width: 1367px) and (max-width: 1750px) {
    .elementor-997 .elementor-element.elementor-element-7413e83 .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item {
        margin-inline: calc(20px / 2) !important;
    }

    .elementor-997 .elementor-element.elementor-element-6061e7a img {
        width: 75% !important;
        height: 75% !important;
    }
}

/* Largeur des blocs texte / formulaire */
@media (min-width: 1367px) and (max-width: 1500px) {
    .contact-text-container,
    .contact-form-container {
        width: 45%;
    }
}

/* Image "pipe" de transition */
@media (min-width: 1367px) and (max-width: 1770px) {
    #contact-pipe-img img {
        width: 80%;
        height: 80%;
    }
}


/* ==========================================================================
   7. BUTTONS
   3 variantes : .btn-white (fond sombre), .btn-black & .btn-blue (fond clair),
   + #form-btn pour les formulaires.
   Animation : fond qui se déploie de gauche à droite + icône qui translate.
   ========================================================================== */

/* --- Base commune --- */
.btn-white a,
.btn-black a,
.btn-blue a,
#form-btn {
    position: relative;
    z-index: 1;
    overflow: hidden;
    padding: 12px 18px !important;
    border-radius: 90px !important;
    background-color: transparent !important;
    font-family: var(--e-global-typography-primary-font-family), Sans-serif;
    font-size: 1.125rem !important;
    font-weight: 400 !important;
    line-height: 1.75rem !important;
    letter-spacing: 0 !important;
}

.btn-white a .elementor-button-icon,
.btn-black a .elementor-button-icon,
.btn-blue a .elementor-button-icon,
#form-btn .elementor-button-icon {
    margin-top: 4px;
    font-size: 33px;
}

/* Effet de remplissage (pseudo-element animé) */
.btn-white a::before,
.btn-black a::before,
.btn-blue a::before,
#form-btn::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    width: 0;
    height: 100%;
    transition: width 0.5s ease;
}

/* Icône qui se déplace au hover */
.btn-white a:hover .elementor-button-icon svg,
.btn-black a:hover .elementor-button-icon svg,
.btn-blue a:hover .elementor-button-icon svg,
#form-btn:hover .elementor-button-icon svg {
    translate: 3px;
    transition: all 0.5s ease;
}

.btn-white a:hover::before,
.btn-black a:hover::before,
.btn-blue a:hover::before,
#form-btn:hover::before {
    width: 100%;
}


/* --- Variante WHITE (sur fond sombre) --- */
.btn-white a {
    border: 1px solid var(--e-global-color-secondary) !important;
    color: var(--e-global-color-secondary) !important;
}
.btn-white a .elementor-button-icon svg path { stroke: var(--e-global-color-secondary) !important; }
.btn-white a::before { background-color: var(--e-global-color-secondary); }
.btn-white a:hover { color: var(--e-global-color-dba9e2f) !important; }
.btn-white a:hover .elementor-button-icon svg path { stroke: var(--e-global-color-dba9e2f) !important; }


/* --- Variante BLACK (sur fond clair, couleurs Elementor) --- */
.btn-black a {
    border: 1px solid var(--e-global-color-3e583f8) !important;
    color: var(--e-global-color-3e583f8) !important;
}
.btn-black a .elementor-button-icon svg path { stroke: var(--e-global-color-3e583f8) !important; }
.btn-black a::before { background-color: var(--e-global-color-secondary); }
.btn-black a:hover { color: var(--e-global-color-3e583f8) !important; }


/* --- Variante BLUE (sur fond clair, valeurs hex) --- */
.btn-blue a {
    border: 1px solid #1B2B3E !important;
    color: #1B2B3E !important;
}
.btn-blue a .elementor-button-icon svg path { stroke: #1B2B3E !important; }
.btn-blue a::before { background-color: #1B2B3E; }
.btn-blue a:hover { color: #ffffff !important; }
.btn-blue a:hover .elementor-button-icon svg path { stroke: #ffffff !important; }


/* --- Variante FORM (boutons soumission formulaire) --- */
#form-btn {
    border: 1px solid var(--e-global-color-04ad67b) !important;
    color: var(--e-global-color-04ad67b) !important;
}
#form-btn .elementor-button-icon svg path { stroke: var(--e-global-color-04ad67b) !important; }
#form-btn::before { background-color: var(--e-global-color-secondary); }


/* --- Responsive boutons --- */
@media (max-width: 1024px) {
    .btn-blue a {
        padding: 10px 16px !important;
        font-size: 1rem !important;
    }
}

@media (max-width: 767px) {
    .btn-white a,
    .btn-black a,
    #form-btn {
        font-size: 1rem !important;
    }
    .btn-blue a {
        padding: 6px 10px !important;
        font-size: 0.875rem !important;
    }
}


/* ==========================================================================
   8. CART STEPS
   Alignement des images dans les widgets image-box du tunnel panier.
   ========================================================================== */

@media (min-width: 768px) {
    .cart-steps .elementor-image-box-img {
        margin-bottom: 0 !important;
    }
}

@media (max-width: 767px) {
    .cart-steps .elementor-image-box-img img {
        margin-inline: auto;
    }
}


/* ==========================================================================
   9. BLUE TINT IMAGE
   Filtre N&B + overlay bleu en mix-blend-mode pour les visuels "ambiance".
   ========================================================================== */

.img-blue-tint {
    position: relative;
    overflow: hidden;
}

.img-blue-tint img {
    display: block;
    width: 100%;
    filter: grayscale(100%) contrast(110%);
}

.img-blue-tint::after {
    content: "";
    position: absolute;
    inset: 0;
    background: #B8D5EC;
    mix-blend-mode: color;
    pointer-events: none;
}


/* ==========================================================================
   10. CARD HOVER REVEAL
   .child-card apparaît au survol de .parent-card (overlay, CTA, infos sup).
   ========================================================================== */

.child-card {
    opacity: 0;
    transition: opacity 0.3s linear;
}

.parent-card:hover .child-card {
    opacity: 1;
}


/* ==========================================================================
   11. PAGE À PROPOS – Layouts responsives
   ========================================================================== */

/* Grille 4 colonnes → 2 colonnes en tablette */
@media (min-width: 767px) and (max-width: 1366px) {
    .four-column > div {
        width: 40%;
    }

    .parent-card {
        width: 45% !important;
    }
}

/* ==========================================================================
   12. BLOCK-WAVE
   ========================================================================== */

.block-wave {
  position: relative;
  /*width: 1477px;*/
  overflow: hidden;
  z-index: 1;
  transition: all 2.5s ease;
}

.block-wave::before,
.block-wave::after {
  content: "";
  position: absolute;
  width: 2200px;  
  height: 2200px; 
  left: 50%;
  transform: translateX(-50%);
  top: 150%;     
  z-index: -1;
  transition: all 6s cubic-bezier(.22,1,.36,1); 
  border-radius: 60% 70% 20% 40%;
  background: #73B8F0;
}

.block-wave::before {
  opacity: .2;
  animation: water 13s ease-in-out infinite alternate;
}

.block-wave::after {
  opacity: .5;
  animation: water 14s ease-in-out infinite alternate;
}

.block-wave:hover {
  background: #73B8F0;
  color: white;
}

.block-wave:hover::before,
.block-wave:hover::after {
  top: -1800px; 
  opacity: 1;
}

@keyframes water {
  0% { transform: translateX(-50%) rotate(0); }
  20% { border-radius: 50% 63% 80% 49%; }
  40% { border-radius: 60% 64% 64% 48%; }
  60% { border-radius: 80% 63% 51% 49%; }
  80% { border-radius: 40% 60% 42% 58%; }
  100% { 
    border-radius: 62% 67% 70% 53%;
    transform: translateX(-50%) rotate(180deg);
  }
}

/* ==========================================================================
   13. Image inside card
   ========================================================================== */

.image-inside-card{
    aspect-ratio: 46 / 43 !important;
}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Maax Mono';
	font-style: normal;
	font-weight: normal;
	font-display: auto;
	src: url('https://tech-o.fr/wp-content/uploads/2026/03/Maax-Mono-Regular.ttf') format('truetype');
}
/* End Custom Fonts CSS */