:root{
      --bg:#fff7f9;           /* fond très clair */
      --card:#fff;            /* cartes blanches */
      --muted:4A001F;
      --accent1:#ff7a95;      /* corail/rose */
      --accent2:#6ee7b7;      /* vert menthe */
      --accent3:#ffd580;      /* or doux */
      --glass: rgba(0,0,0,0.03);
    }
body{
  background:#fff7fd;
  color:#333;
  font-family:'Poppins', sans-serif;
}
  
  .navbar{background:linear-gradient(90deg, rgba(255,255,255,0.9), rgba(255,255,255,0.95)); box-shadow: 0 2px 8px rgba(11,18,32,0.05);}
    .brand{background: linear-gradient(90deg,var(--accent1),var(--accent2)); -webkit-background-clip:text; background-clip:text; color:transparent; font-weight:800;}
    .nav-link{
    border-radius:20px ;
    font-weight: bold;
       color: #ff0c85;
       transition: all 700ms ease;
      }

      .nav-link:hover{
        color:  white;
        font-weight: bolder;
        background:#f58599;
        border:1px solid #ff0c85;       
      }

      @media (min-width:774px) { .navbar-nav{position:relative; right: 4em;}}
 @media (max-width:767px){ .avatar{height:100%;} ;.nav-avatar-text{display:none;} ; .navitem > .nav-link{text-align:start ; border-radius:none;
    font-weight: bold;
       color: #ff0c85;
        background: none ;
       
       } 

       /* burger */

/* Style de base de l'icône */
.hamburger-icon svg {
  cursor: pointer;
  transition: transform 0.2s ease-in-out;
}

/* Couleur bordeaux pour toutes les lignes */
.hamburger-icon .line {
  fill: #4A001F; /* Ta couleur bordeaux */
  transition: y 0.1s ease-in-out 0.1s, transform 0.1s ease-in-out, opacity 0.1s ease-in-out;
  transform-origin: center;
}

/* --- ÉTAT OUVERT (quand .collapsed est ENLEVÉE par Bootstrap) --- */

/* La ligne du haut descend et tourne */
.navbar-toggler:not(.collapsed) .hamburger-icon .line.top {
  y: 35px; /* Aligne sur la ligne du milieu */
  transform: rotate(45deg);
}

/* La ligne du milieu disparaît */
.navbar-toggler:not(.collapsed) .hamburger-icon .line.middle {
  /* opacity: 0; */
  display: none;
}

/* La ligne du bas monte et tourne dans l'autre sens */
.navbar-toggler:not(.collapsed) .hamburger-icon .line.bottom {
  y: 35px; /* Aligne sur la ligne du milieu */
  transform: rotate(-45deg);
}
/* fin */


   .nav-item > .nav-link:hover{
        color:  var(--muted);
        font-weight: bolder;
        background:none;
        border:none;
      } }
         @media (min-width:360px) and (max-width:407px) {
        
          .hero {
            height: 380px !important;
            /* width: 550px !important; */
            /* margin-left: 35px; */
          }
        } 
         @media (min-width:407px) and (max-width:435px) {
        
          .hero {
            height: 400px !important;
            /* width: 550px !important; */
            /* margin-left: 35px; */
          }
        } 

         @media (min-width:435px) and (max-width:555px) {
        
          .hero {
            height: 420px !important;
          }
        }

          @media (min-width:454px) and (max-width:497px) {
        
          .hero {
            height: 460px !important;
          }
        } 

         @media (min-width:497px) and (max-width:533px) {
        
          .hero {
            height: 490px !important;
          }
        }

          @media (min-width:533px) and (max-width:575px) {
        
          .hero {
            height: 560px !important;
          }
        }

        @media (min-width:576px) and (max-width:890px) {
        body{font-size: 1.1em;}

         #title{
            font-size:1.8em !important;
          }

          .hero {
            opacity: 0.4;
            height: 980px !important;
            width: 100% !important;
            margin: auto;
          }

          section.welcome {
            position: absolute;
            top: 85px;
            right: 40px;
            width: 90%;
            margin: auto;
        }
     }

       @media (min-width:889px) {
        body{font-size: 1.1em;}

         #title{
            font-size:1.8em !important;
          }

          .hero {
            height: 700px !important;
            width: 45% !important;
            margin-left: 35px;
          }

          section.welcome {
            /* font-size: 75%; */
            position: absolute;
            top: 85px;
            right: 40px;
            width: 48%;
        }
     } 
  
.hero{
  background:url('../images/proposCover.jpeg')
           center/cover no-repeat;
  height:320px;
  border-bottom-left-radius:30px;
  border-bottom-right-radius:30px;
  position:relative;
}
.hero::after{
  content:'';
  position:absolute;
  inset:0;
  background: rgba(255, 122, 149, 0.4);
  border-bottom-left-radius:30px;
  border-bottom-right-radius:30px;
}
.hero h1{
  position:absolute;
  bottom:20px;
  left:30px;
  font-size:42px;
  color:white;
  font-weight:800;
  text-shadow:0 4px 8px rgba(0,0,0,0.5);
}

.section-title{
  font-weight:700;
  margin-bottom:12px;
  color:rgba(255, 122, 149, 1);
}
.value-box{
  padding:15px;
  background:white;
  border-radius:12px;
  box-shadow:0 4px 12px rgba(255,0,140,0.12);
}

.brand:hover{background: linear-gradient(90deg,var(--accent1),var(--accent2)); -webkit-background-clip:text; background-clip:text; color:transparent; font-weight:800;}