/* Poppins font */

/*  Titres et accroches */
@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins/Poppins-Black.ttf') format("truetype");
    font-weight: 900;
}

@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins/Poppins-Bold.ttf') format("truetype");
    font-weight: 700;
}

/* Sous-titres */
@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins/Poppins-SemiBold.ttf') format("truetype");
    font-weight: 600;
}

@font-face {
    font-family: 'Poppins';
    src: url('../fonts/Poppins/Poppins-Medium.ttf') format("truetype");
    font-weight: 500;
}

/* Open Sans */

/* Texte courant */
@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/Open_Sans/static/OpenSans-Regular.ttf') format("truetype");
    font-weight: 400;
}

/* Menu et boutons */
@font-face {
    font-family: 'Open Sans';
    src: url('../fonts/Open_Sans/static/OpenSans-SemiBold.ttf') format("truetype");
    font-weight: 600;
}

/* Bloc code */

@font-face {
    font-family: 'Fire Code';
    src: url('../fonts/Fira_Code/static/FiraCode-Regular.ttf') format("truetype");
    font-weight: 400;
}

@font-face {
    font-family: 'Fire Code';
    src: url('../fonts/Fira_Code/static/FiraCode-Medium.ttf') format("truetype");
    font-weight: 500;
}

/* Pacifico */

@font-face {
    font-family: 'Pacifico';
    src: url('../fonts/Pacifico/Pacifico-Regular.ttf') format('truetype');
}

/* Échelle : H1 3 rem / H2 2 rem / H3 1.5 rem / Corps 1 rem, interlignage 1,6 */

/* 
• Boutons : fond #FF5E50, texte blanc (hover #FFA238, ombre légère).
• Liens : #17B3AA, souligné au hover.
• Navigation : fond blanc, actif souligné #004F62.
• Sections : alternance #F9F9F9 / #FFFFFF, séparateur #004F62.
• Formulaires : bordure #17B3AA, focus #FF5E50, coins 4 px.

verbes d’action, impératifs doux pour CTA.
 */
:root {
    /* Palette I2TECS selon charte */
    --vert-tropical: #1E9C75;
    --turquoise-numerique: #17B3AA;
    --ocean-profond: #004F62;
    --corail-vif: #FF5E50;
    --orange-solaire: #FFA238;
    --neutre-anthracite: #333333;
    --fond-principal: #F9F9F9;

    /* Adaptation des variables existantes */
    --primary-color: var(--turquoise-numerique);
    --secondary-color: var(--ocean-profond);

    /* Polices I2TECS  selon charte*/
    --font-title: 'Poppins';
    /* Titres et accroches */
    --font-text: 'Poppins' !important;
    /* Texte courant */
    --font-menu: 'Open Sans';
    /* menu */
    --font-btn: 'Open Sans';
    /* Buttons */
    --font-bloc-code: 'Fire Code';
    /* Bloc code */
}

h1,
h2,
h3,
.font-title {
    font-family: var(--font-title);
}

.text-white {
    color: var(--fond-principal) !important;
}

.text-primary {
    color: var(--vert-tropical);
}

.text-secondary {
    color: var(--corail-vif);
}

.bg-primary {
    background-color: var(--vert-tropical) !important;
}

.bg-secondary {
    background-color: var(--corail-vif) !important;
}

.btn-primary:hover {
    background-color: var(--orange-solaire) !important;
}


* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    outline: none;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-text);
    background-color: var(--font-principal);
    overflow-x: hidden !important;

}

.principal-container {
    position: relative;
}

.navbar {
    top: 0;
    z-index: 2;
    background-color: var(--fond-principal);
    box-shadow: 7px 5px 15px -4px rgba(0, 0, 0, 0.75);
    -webkit-box-shadow: 7px 5px 15px -4px rgba(0, 0, 0, 0.75);
    -moz-box-shadow: 7px 5px 15px -4px rgba(0, 0, 0, 0.75);
}

.nav-items>ul>li {
    list-style: none;
    margin: 10px;
    padding: 10px 20px;
}

.nav-items>ul>li>a,
.nav-button a {
    font-family: var(--font-title);
    color: var(--secondary-color);
}

.nav-items>ul>li::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 0.17rem;
    background-color: var(--primary-color);
    left: 0;
    bottom: 0;
    transform-origin: 0% 100%;
    transform: scaleX(0);
    transition: transform 0.3s ease;
}

.nav-items>ul>li:hover::after {
    transform: scaleX(1);
}

.nav-logo a,
.nav-button a {
    color: var(--secondary-color);
    list-style: none;
}

.nav-logo {
    font-size: 32px;
}

.nav-button {
    background-color: var(--corail-vif);
    /* border-radius: 10px; */
}

.nav-button:hover a {
    color: var(--secondary-color);
}

.nav-button a {
    padding: 10px 20px;
    color: var(--secondary-color);
    z-index: 1;
}

#hamburger-menu,
#mobile-menu {
    display: none;
}

/* Global style */


.text-center {
    text-align: center;
}

.flex-center {
    display: flex;
    align-items: center;
    justify-content: center;
}

.text-success {
    color: var(--vert-tropical) !important;
}

.brand-font {
    font-family: 'Pacifico';
}

.word-break {
    word-break: break-all;
    word-wrap: break-word;
}

.go-up-btn {
    position: fixed;
    bottom: 30px;
    right: 25px;
    z-index: 999;
    background: var(--corail-vif, #198754);
    color: white;
    border-radius: 50%;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.3rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.go-up-btn:hover {
    background: #145c3a;
    transform: scale(1.1);
}