body {
font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";font-size:1.2rem
    }
.overflow-lg-visible{overflow:visible!important}
@media screen and (max-width:1100px){
.overflow-lg-visible{overflow:hidden!important}
}
h1{color:#6b2a74;font-size:60px; text-transform:uppercase;font-family: "chalky", sans-serif;
font-weight: 400;
font-style: normal;}
h2{color:#6b2a74;font-size:40px; text-transform:uppercase;font-family: "chalky", sans-serif;
font-style: normal;}
h3{color:#6b2a74;font-size:30px; text-transform:uppercase;font-family: "chalky", sans-serif;
font-style: normal;}
.separateur{background:url("images/separateur.svg") no-repeat top center;
background-size:contain;}
.hero {
position: relative;
margin-top:250px;
display: flex;
align-items: top;
justify-content: center;
text-align: center;
min-height:1300px!important
}
.hero h1 {
position: relative;
top:-70px;
color: #6b2a74;
transform: rotate(-10deg)!important;
z-index:2;
font-size: clamp(100px, 25vw, 280px);
line-height:1.025;
letter-spacing: 0.01em;
text-transform: uppercase;
pointer-events:none;
font-family: "chalky", sans-serif;
}

.hero h1 .line-1{margin-left:280px}
.hero h1 .line-2{margin-left:-470px;}
@media screen and (max-width:1399px){
.hero h1{top:50px;line-height:1.1}
.hero h1{font-size: clamp(50px, 25vw, 140px);}
.hero h1 .line-1{margin-left:140px}
.hero h1 .line-2{margin-left:-335px}
}
@media screen and (max-width:1100px){
.hero h1 .line-1{margin-left:100px}
.hero h1 .line-2{margin-left:-120px}
}
@media screen and (max-width:402px){
.hero h1 .line-1{margin-left:0}
.hero h1 .line-2{margin-left:0}
.hero {
margin-top:150px;}
}
.navbar.ma-nav {

background:rgba(107,42,116,0.90)
}
.navbar-brand img {
height: 32px;
}
.logo img {
height: 100px;
-webkit-transition: .5s ease-in-out;
-moz-transition: .5s ease-in-out;
-o-transition: .5s ease-in-out;
transition: .5s ease-in-out;
}
header.header-scrolled .logo img {
height:50px;
}

.lang-switch {
color: white;
text-decoration: none;
margin-left: 1rem;
}
.dropdown-menu {
background-color: #0d1b2a;
}
.dropdown-item {
color: white;
}
.bg-white{color: black}
.accordion-button:not(.collapsed) {
color: white;
background-color: rgba(13,27,42,1.00);
}
footer{background:rgba(107,42,116,1)}
footer h1,footer h2,footer h3,footer p,footer .copyright{color:white}
footer a img,.accordion-button:not(.collapsed)::after{filter: brightness(0) invert(1);}
.list-group.list-group-flush {background:transparent!important}
.pb-text-content{align-self:stretch;min-height:300px}
.pb-text-content [type=button]:not(:disabled){height:38px}
.post-box .post-img{padding:150px}
.post-box .post-img img{top:0; left:0; bottom:0;right:0;  width:100%;height:250px; object-fit:cover}
.rounded-max{border-radius:100%}
.of-cover-container{padding-top:250px;position:relative}
.max-height-thumbnail{max-height:100%}
@media screen and (max-width:992px){
.lang-select{position:relative;left:calc(100% - 130px);right:0;top:25px}
}
.of-cover{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover}
.heroText{top:20%;left:0;right:0;width:100%}
.lang-switch {
  position: relative;
  display: inline-block;
  font: 500 14px/1.2 system-ui, sans-serif;
  border: 1px solid #ccc;
  border-radius: 6px;
  background: #fff;
color:black
}
.btn-alice{
color: #fff;
background:url("images/btn.svg") no-repeat top center;
background-size:cover;
width: 100%
}
.btn-alice:hover{
color: #fff;
opacity: .75
}
/* Summary stylisé comme un bouton/select */
.lang-switch > summary {
  list-style: none;              /* enlève le triangle natif */
  padding: 8px 32px 8px 12px;
  cursor: pointer;
  user-select: none;
  border-radius: 6px;
}
.lang-switch > summary::-webkit-details-marker { display: none; }

/* Petite flèche custom */
.lang-switch > summary::after {
  content: "▾";
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  pointer-events: none;
  color: #666;
}

/* Quand c'est ouvert, on enlève le radius en bas */
.lang-switch[open] > summary {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

/* Bloc d’options (les liens) */
.lang-options {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  background: #fff;
  border: 1px solid #ccc;
  border-top: none;
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
  overflow: hidden;
  z-index: 100;
}

.lang-options a {
  display: block;
  padding: 8px 12px;
  color: #333;
  text-decoration: none;
}
.lang-options a:hover {
  background: #f5f5f5;
}

/* Masquer la langue active dans la liste */
.lang-options a.is-active {
  display: none;
}
.min-500{min-height:500px}
.alt-text{background-color:rgba(107,42,116,1);color:#fff;padding:6px 10px}
#achievements .carousel-indicators button{background-color:rgba(107,42,116,1);}

#achievements .carousel-item{height:700px}
#achievements .carousel-item img{height:100%;object-fit:cover}
.modal.lightbox .modal-dialog{max-width:100vw;width:100%;margin:0;height:100%;display:flex;align-items:center;}
.row.grid{min-height:100%!important}
    
/* Wrapper nécessaire */
.grid-item{
  position: relative;
}
#portfolio {
    column-gap: 1.5rem;
    columns: 1;
}

@media (min-width: 992px) {
    #portfolio {
        columns: 2;
    }
}

@media (min-width: 1200px) {
    #portfolio {
        columns: 3;
    }
}

#portfolio .grid-item {
    break-inside: avoid;
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    margin-bottom: 1.5rem;
    display: inline-block;
    width: 100%;
    overflow:hidden!important 
}

#portfolio .grid-item a,
#portfolio .grid-item img {
    display: block;
    width: 100%;
}

#portfolio .grid-item img {
    height: auto;
    transition: transform .4s ease, filter .4s ease;
   
}
#portfolio .card{border:none;overflow:hidden!important;border-radius:0}
.modal.lightbox.fade.show{background: rgba(107,42,116,0.50);}
/* Overlay */
.masonry-overlay{
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
 background: rgba(107,42,116,0.50);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  opacity:0;
  transition: opacity .3s ease;
  padding: 1rem;
  text-align: center;

}

/* Titre */
.masonry-title{
  color: #fff;
  font-size: 1.1rem;
  font-weight: 500;
  letter-spacing: .02em;
  transform: translateY(10px);
  transition: transform .3s ease;
}

/* Hover effects */
.grid-item:hover .masonry-overlay{
opacity: 1;
z-index: 10
}

.grid-item:hover img{
  transform: scale(1.05);
  filter: brightness(.85);
}


.grid-item:hover .masonry-title{
  transform: translateY(0);
}
.carousel-control-next-icon::after {
    content: "";
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M14.5 5.5L8 12l6.5 6.5' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    height:30px;width:30px;
    font-weight: 300;
    line-height: 1;
    transform: rotate(180deg)
}

.carousel-control-prev-icon::after {
    content: "";
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M14.5 5.5L8 12l6.5 6.5' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    height:30px;width:30px;
    font-weight: 300;
    line-height: 1;
}

/* Hover / active */
.carousel-control-next-icon:hover,
.carousel-control-prev-icon:hover,
.btn-close:hover{
  background: rgba(20,20,20,.55);
  transform: translateY(-1px);
  opacity: 1;
}
.carousel-control-next-icon:active,
.carousel-control-prev-icon:active,
.btn-close:active{
  transform: translateY(0);
}

/* Focus clavier accessible */
.carousel-control-next-icon:focus-visible,
.carousel-control-prev-icon:focus-visible,
.btn-close:focus-visible{
  outline: 2px solid rgba(255,255,255,.85);
  outline-offset: 2px;
}
.carousel-control-next-icon,
.carousel-control-prev-icon{width:50px;height:50px}
#achievements .carousel-control-next-icon,
#achievements .carousel-control-prev-icon{
background: rgba(107,42,116,0.50)!important;
} 
.carousel-control-next-icon,
.carousel-control-prev-icon,
.btn-close{
background: rgba(107,42,116,0.15)!important;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border-radius: 50%;
border: 1px solid rgba(255, 255, 255, 0.25);
display: flex;
align-items: center;
justify-content: center;
opacity: 1;
transition: all 0.25s ease;
}
.btn-close svg {
margin-top:10px
}

/* Hover subtil */
.carousel-control-next:hover .carousel-control-next-icon,
.carousel-control-prev:hover .carousel-control-prev-icon,
.btn-close:hover {
    transform: scale(1.08);
    background: rgba(255, 255, 255, 0.25)!important;
}

#portfolio{min-height:700px!important}

