/* ===============================
   shortcode carré svg
   =============================== */

.seak-square-wrapper {
    width: 100%;
    display: flex;
    justify-content: center;
    margin: 80px 0;
}

.seak-square-svg {
    width: 200px;
    height: 200px;
    display: block;
}

.seak-square-path {
    stroke: #000;
    stroke-width: 6px;
    stroke-opacity: 0.15;

    fill: #000;
    fill-opacity: 0;

    stroke-dasharray: 1;
    stroke-dashoffset: 1;

    transition: fill-opacity 0.8s ease;
}

.seak-square-path.filled {
    fill-opacity: 1;
}

.seak-square-number {
    font-family: "Sonny Gothic", sans-serif;
    font-size: 260px;
    font-weight: 600;
    fill: #8DCBCA;

    text-anchor: middle;
    dominant-baseline: middle;
    pointer-events: none;
}

/* Correction optique spécifique */
.seak-square-number[data-number="1"] {
    transform: translateY(0.12em);
}


@media (max-width: 767px) {
    .seak-square-svg {
        width: 180px;
        height: 180px;
    }

    .seak-square-number {
        font-size: 180px;
    }

    .seak-square-number[data-number="1"] {
        transform: translateY(0.10em);
    }
}


/* ===============================
   MENU CARRE-7 – OUVERTURE
   =============================== */
/* =====================================================
   [seak_svg_square] — CSS
   ===================================================== */

.seak-square-wrapper {
  width: 100%;
  display: flex;
  justify-content: center;
  margin: 80px 0;
}

.seak-square-svg {
  width: 200px;
  height: 200px;
  display: block;
}

.seak-square-path {
  stroke: #000;
  stroke-width: 6px;
  stroke-opacity: 0.15;

  fill: #000;
  fill-opacity: 0;

  stroke-dasharray: 1;
  stroke-dashoffset: 1;

  transition: fill-opacity 0.8s ease;
}

.seak-square-path.filled {
  fill-opacity: 1;
}

.seak-square-number {
  font-family: "Sonny Gothic", sans-serif;
  font-size: 260px;
  font-weight: 600;
  fill: #8DCBCA;

  text-anchor: middle;
  dominant-baseline: middle;
  pointer-events: none;
}

/* Correction optique spécifique */
.seak-square-number[data-number="1"] {
  transform: translateY(0.12em);
}

@media (max-width: 767px) {
  .seak-square-svg {
    width: 180px;
    height: 180px;
  }

  .seak-square-number {
    font-size: 180px;
  }

  .seak-square-number[data-number="1"] {
    transform: translateY(0.10em);
  }
}

/* =====================================================
   [menu_carre_7] — CSS
   ===================================================== */

.elementor-popup-modal .elementor {
  width: 100%;
}

#menu-carre-7{
  position: relative;
  width: 100%;
  min-height: 100vh;
  overflow: hidden;

  /* PC */
  --menu-right: 20vw;
  --svg-shift-y: -6.8vw;
}

/* Menu au-dessus du SVG */
#menu-carre-7 .menu-container{
  position: relative;
  z-index: 5;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-right: var(--menu-right);
}

#menu-carre-7 .menu{
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: right;
}

#menu-carre-7 .menu li{
  margin: 0 0 5vw 0;
  font-size: 6vw;
  text-transform: uppercase;
  font-family: 'Sonny Gothic Ultra', sans-serif;
  font-weight: 900;
}

#menu-carre-7 .menu a{
  color: transparent;
  -webkit-text-stroke: 1px #000;
  text-decoration: none;
  display: block;
  line-height: 0.2;
  position: relative;
  z-index: 6;
}

#menu-carre-7 .menu a.is-active{
  color: #000;
}

/* SVG en fond */
#menu-carre-7 .svg-container{
  position: absolute;
  z-index: 1;
  pointer-events: none;

  left: 17%;
  width: 37%;
  max-width: 100%;

  top: calc(50% + var(--svg-shift-y));
  transform: translateY(-50%);
}

#menu-carre-7 .svg-container svg{
  width: 100%;
  height: auto;
  display: block;
}

/* TABLET */
@media (max-width: 1024px){
  #menu-carre-7{
    --menu-right: 5vw;
    --svg-shift-y: -8.5vw;
  }

  #menu-carre-7 .menu li{
    margin: 0 0 5vw 0;
    font-size: 8.5vw;
  }

  #menu-carre-7 .menu a{
    line-height: 0.5;
  }

  #menu-carre-7 .svg-container{
    left: 50%;
    width: 55%;
    top: calc(50% + var(--svg-shift-y));
    transform: translate(-63%, -50%);
  }
}

/* MOBILE */
@media (max-width: 767px){
  #menu-carre-7{
    --menu-right: 7vw;
    --svg-shift-y: -12vw;
  }

  #menu-carre-7 .menu-container{
    height: 100vh;
    padding-right: var(--menu-right);
    justify-content: flex-end;
  }

  #menu-carre-7 .menu li{
    margin: 0 0 5vw 0;
    font-size: 11vw;
  }

  #menu-carre-7 .menu a{
    line-height: 0.9;
  }

  #menu-carre-7 .svg-container{
    left: 50%;
    width: 70%;
    top: calc(50% + var(--svg-shift-y));
    transform: translate(-70%, -50%);
  }
}

/* iPhone landscape spécifique */
@media only screen and (min-device-width: 375px) and (max-device-width: 812px) and (orientation: landscape){
  #menu-carre-7{
    --menu-right: 5vw;
    --svg-shift-y: -6vw;
  }

  #menu-carre-7 .menu li{
    margin: 0 0 2vw 0 !important;
    font-size: 4vw !important;
  }

  #menu-carre-7 .svg-container{
    left: 40% !important;
    width: 25% !important;
    top: calc(50% + var(--svg-shift-y)) !important;
    transform: translate(-50%, -50%) !important;
  }
}


@-webkit-keyframes c7-draw {
  from { stroke-dashoffset: var(--c7-l, 2000); }
  to   { stroke-dashoffset: 0; }
}
@keyframes c7-draw {
  from { stroke-dashoffset: var(--c7-l, 2000); }
  to   { stroke-dashoffset: 0; }
}

@media (prefers-reduced-motion: reduce){
  #menu-carre-7 path{
    -webkit-animation: none !important;
    animation: none !important;
    stroke-dashoffset: 0 !important;
  }
}

/* =====================================================
   Border radius menu Equipe
   ===================================================== */

.qodef-page-title.qodef--has-image::after {
    border-radius: 20px !important;
}

/* =====================================================
   Team short code
   ===================================================== */

.seak-team-carousel-wrapper{
  position:relative;
  max-width:1400px;
  margin:0 auto;
  display:flex;
  align-items:center;
}

.seak-team-carousel{
  overflow:hidden;
  width:100%;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
}

.seak-team-track{
  display:flex;
  gap:40px;
  will-change:transform;
}

.seak-team-slide{
  flex:0 0 calc(33.333% - 27px);
  text-align:center;
}

/* Image */
.seak-team-image{
  position:relative;
  aspect-ratio:3/4;
  border-radius:24px;
  overflow:hidden;
  background:#000;
}

.seak-team-image-inner{
  position:absolute;
  inset:0;
  background-size:cover;
  background-position:center;
  transition:opacity .35s ease, transform .6s ease;
}

.seak-team-image-inner.hover{ opacity:0; }
.seak-team-slide:hover .seak-team-image-inner.hover{ opacity:1; }
.seak-team-slide:hover .seak-team-image-inner{ transform:scale(1.05); }

/* Texte */
.seak-team-name{
  margin-top:14px;
  margin-bottom:2px;
  font-size:22px;
  font-weight:700;
}

.seak-team-role{
  font-size:15px;
  color:#999;
  line-height:1.2;
}

/* Flèches */
.seak-carousel-arrow{
  width:44px;height:44px;
  border:none;background:none;
  cursor:pointer;position:relative;
}
.seak-carousel-arrow::before{
  content:'';
  width:12px;height:12px;
  border-top:2px solid #000;
  border-right:2px solid #000;
  position:absolute;top:50%;left:50%;
}
.seak-prev::before{transform:translate(-50%,-50%) rotate(-135deg);}
.seak-next::before{transform:translate(-50%,-50%) rotate(45deg);}

@media(max-width:768px){
  .seak-team-slide{ flex:0 0 100%; }
  .seak-carousel-arrow{ display:none; }
}

