svg rect, svg path {
    shape-rendering: crispEdges;
}

.site_simplifie, .home { background-color: var(--CG_or); background-image: conic-gradient(var(--CG_orange) 90deg, transparent 90deg 180deg, var(--CG_orange) 180deg 270deg, transparent 270deg); background-size: 30vmin 30vmin;}
.home{ display: flex; flex-direction: column;}

.home header h1 {text-align: center;font-size: 1.66rem;}

.home .choix { display: flex; flex-direction: column; align-items: center; gap: 20px;}
.home .choix .btnHome { padding: 10px 20px; margin: 4px; box-shadow: 0 -4px 0 #1a1a1a, 0 4px 0 #1a1a1a, -4px 0 0 #1a1a1a, 4px 0 0 #1a1a1a; font-family: var(--FontPrincipal); font-size: 1.8rem;text-decoration: none; position: relative;}
.home .choix .btnHomeSec {background-color: var(--CG_beige); color: #1a1a1a;}
.home .choix .btnHomeSec:hover { color: var(--CG_beige); background-color: var(--CG_vertSapin);}
.home .choix .btnHomePrincipal { background-color: var(--CG_vertFonce); color: var(--CG_or);}
.home .choix .btnHomePrincipal:hover {color: var(--CG_beige);background-color: var(--CG_vertSapin); cursor: not-allowed;}

.home .site-branding { display: flex; flex-direction: row; justify-content: center;}
.home .site-branding img { max-width: 70vw; min-width: 250px; width: 60vw;}

.home #blocEcran, .site_simplifie .blocContenu { margin: 5vmin; box-shadow: 0 -4px 0 #1a1a1a, 0 4px 0 #1a1a1a, -4px 0 0 #1a1a1a, 4px 0 0 #1a1a1a;padding: 5vmin;padding-bottom: 2vmin; background-color: var(--CG_jaune);
    position: relative; height: 100%; display: flex; flex-direction: column;justify-content: space-between;}

.home #blocEcran .blocEspace {height: 100%;display: flex; flex-direction: column; justify-content: space-evenly;}
.home #blocEcran .blocEspace main{ position: relative;}
.home #blocEcran footer { background-color: none;}

.home main #Chknewsletter { display: none;}
.home form.ckeck { display: none;}

#BtnDialogInscription {margin-left: 25px;position: absolute; top: 0%; transform: translateY(-50%);font-family: var(--FontPrincipal);background-color: var(--CG_orange); padding: 5px; padding-left: 1rem;
    box-shadow: 0 -4px 0 0.5px #1a1a1a, 0 4px 0 0.5px #1a1a1a, -4px 0 0 0.5px #1a1a1a, 4px 0 0 0.5px #1a1a1a; cursor: pointer; width: 300px; color: var(--contour); border: unset;}

#BtnDialogInscription::before { content: ""; position: absolute; width: 1.2rem; height: calc(100% - 10px); left:10px; background: url(./src/icones/enveloppe.svg) no-repeat left center;color: var(--CG_beige);}
#BtnDialogInscription::after { content: ""; position: absolute; bottom: -12px; left:20px; width: 4px; height: 4px; background-color: var(--CG_orange); color: var(--contour);
    box-shadow:
    8px -8px 0 0.5px ,
    4px -8px 0 0.5px var(--CG_orange), 
    0px -8px 0 0.5px var(--CG_orange),
    -4px -8px 0 0.5px var(--CG_orange),
    -8px -8px 0 0.5px var(--CG_orange),
    -12px -8px 0 0.5px ,
    8px -4px 0 0.5px ,
    4px -4px 0 0.5px var(--CG_orange), 
    0px -4px 0 0.5px var(--CG_orange),
    -4px -4px 0 0.5px var(--CG_orange),
    -8px -4px 0 0.5px var(--CG_orange),
    -12px -4px 0 0.5px ,
    4px 0 0 0.5px ,
    0px 0 0 0.5px var(--CG_orange),
    -4px 0 0 0.5px var(--CG_orange),
    -8px 0 0 0.5px var(--CG_orange),
    -12px 0 0 0.5px var(--CG_orange),
    -16px 0 0 0.5px ,
    0 4px 0 0.5px ,
    -4px 4px 0 0.5px var(--CG_orange),
    -8px 4px 0 0.5px var(--CG_orange),
    -12px 4px 0 0.5px var(--CG_orange),
    -16px 4px 0 0.5px var(--CG_orange),
    -20px 4px 0 0.5px ,
    -4px 8px 0 0.5px ,
    -8px 8px 0 0.5px ,
    -12px 8px 0 0.5px ,
    -16px 8px 0 0.5px ,
    -20px 8px 0 0.5px ;
}

#BtnDialogInscription:hover{ background-color: var(--CG_vertSapin); color: var(--CG_beige);}
#BtnDialogInscription:hover::before { background: url(./src/icones/enveloppe_blc.svg) no-repeat left center; color: var(--CG_beige);}
#BtnDialogInscription:hover::after { background-color: var(--CG_vertSapin);
    box-shadow:
    8px -8px 0 0.5px ,
    4px -8px 0 0.5px var(--CG_vertSapin), 
    0px -8px 0 0.5px var(--CG_vertSapin),
    -4px -8px 0 0.5px var(--CG_vertSapin),
    -8px -8px 0 0.5px var(--CG_vertSapin),
    -12px -8px 0 0.5px ,
    8px -4px 0 0.5px ,
    4px -4px 0 0.5px var(--CG_vertSapin), 
    0px -4px 0 0.5px var(--CG_vertSapin),
    -4px -4px 0 0.5px var(--CG_vertSapin),
    -8px -4px 0 0.5px var(--CG_vertSapin),
    -12px -4px 0 0.5px ,
    4px 0 0 0.5px ,
    0px 0 0 0.5px var(--CG_vertSapin),
    -4px 0 0 0.5px var(--CG_vertSapin),
    -8px 0 0 0.5px var(--CG_vertSapin),
    -12px 0 0 0.5px var(--CG_vertSapin),
    -16px 0 0 0.5px ,
    0 4px 0 0.5px ,
    -4px 4px 0 0.5px var(--CG_vertSapin),
    -8px 4px 0 0.5px var(--CG_vertSapin),
    -12px 4px 0 0.5px var(--CG_vertSapin),
    -16px 4px 0 0.5px var(--CG_vertSapin),
    -20px 4px 0 0.5px ,
    -4px 8px 0 0.5px ,
    -8px 8px 0 0.5px ,
    -12px 8px 0 0.5px ,
    -16px 8px 0 0.5px ,
    -20px 8px 0 0.5px ;
}

#ModalInscription.Modal,
#ModalContact.Modal {width: 60vw; max-height: 90vh;background: var(--CG_beige); box-shadow: 0 -4px 0 var(--CG_noir), 0 4px 0 var(--CG_noir), -4px 0 0 var(--CG_noir), 4px 0 0 var(--CG_noir);font-family: var(--FontPrincipal); justify-content: center; flex-direction: column; border: unset;}
#ModalContact::backdrop {
  background: rgba(0, 0, 0, 0.6);
}
#ModalContact::-webkit-backdrop {
  background: rgba(0, 0, 0, 0.6);
}

#ModalInscription.Modal h2,
#ModalContact.Modal h2 { margin-top: 0; font-size: 1.5rem; margin-bottom: 20px; text-align: center; color: var(--CG_vertFonce);}

.Modal .blocClose { display: flex; flex-direction: row-reverse;}
.Modal .sib-detail {color: var(--CG_vertSapin);margin: 10px 0;}
.Modal .sib-area { margin-bottom: 22px;}
.Modal .blocClose button { background: unset; border: unset; border-radius: unset; color: var(--CG_noir); cursor: pointer; font-family: var(--FontPrincipal); font-size: 1.2rem;}

#ModalInscription.Modal input[type="text"],
#ModalInscription.Modal input[type="email"],
#ModalContact.Modal input[type="text"],
#ModalContact.Modal input[type="email"],
#ModalContact.Modal textarea  {
    width: 100%; background-color: var(--CG_jaune); outline: none;margin-top: 15px;box-sizing: border-box; box-shadow: 0 -4px 0 var(--CG_noir), 0 4px 0 var(--CG_noir), -4px 0 0 var(--CG_noir), 4px 0 0 var(--CG_noir); padding: 10px;}

#ModalInscription.Modal input:focus,
#ModalContact.Modal input:focus {border-color: #f59e0b;}

#ModalInscription.Modal input[type="submit"],
#ModalInscription.Modal button[type="submit"],
#ModalContact.Modal input[type="submit"],
#ModalContact.Modal button[type="submit"] {
    width: 100%; background-color: var(--CG_vertSapin); color: #111;border: none; padding: 15px; font-weight: bold; cursor: pointer; font-family: inherit;font-size: 1.1rem;margin-top: 5px;}

@keyframes float-centered {
  0% { transform: translateY(-50%); }
  50% { transform: translateY(calc(-50% - 6px)); }
  100% { transform: translateY(-50%); }
}

.ModalContact .wpcf7-response-output,
.ModalInscription .wpcf7-response-output {
    position: sticky;
    top: 0;
    z-index: 10;
    margin: 0 0 1rem 0;
    background: var(--CG_noir);
    border: 2px solid var(--CG_or);
    color: var(--CG_or);
    padding: 0.75rem 1rem;
    font-family: 'Press Start 2P', monospace;
    font-size: 0.7rem;
}

.ModalInscription .wpcf7-spinner,
.ModalContact .wpcf7-spinner {
    display: inline-block;
    width: 12px;
    height: 12px;
    background: var(--CG_or);
    animation: pixel-pulse 0.6s steps(2) infinite;
    image-rendering: pixelated;
}
.ModalInscription .wpcf7-spinner::before, 
.ModalContact .wpcf7-spinner::before  {
    content: none;
}


@keyframes pixel-pulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.4; transform: scale(0.7); }
}

#BtnDialogInscription { animation: float-centered 3s ease-in-out infinite;}

/*---------------------------------------------------------------------------- */
/*-------------------------   Portfolio   ----------------------------------- */
/*---------------------------------------------------------------------------- */
.site_simplifie main {
    column-count: 2;
    column-gap: 2rem;
    width: 100%;
    margin-bottom: 10px;
}

.site_simplifie .windows_portfolio {
    break-inside: avoid;
    margin-bottom: 2rem;
    box-shadow: 0 -4px 0 var(--CG_noir), 0 4px 0 var(--CG_noir), -4px 0 0 var(--CG_noir), 4px 0 0 var(--CG_noir);
}

.site_simplifie .windows_portfolio ul {
    margin-left: 0;
    margin-bottom: 0;
}

.site_simplifie .windows_portfolio ul ul {
    margin-bottom: 12px;
}

.site_simplifie .windows_portfolio ul ul li {
    font-size: 0.9rem;
    padding: 2.5px 0;
}

.site_simplifie .windows_portfolio h2 {
    background-color: var(--CG_orange);
    border-bottom: 4px var(--CG_noir) solid;
    padding: 5px;
    margin: 0;
}

.site_simplifie .windows_portfolio > div {
    background-color: var(--CG_beige);
    padding: 20px;
}

.site_simplifie .windows_portfolio {
    cursor: grab;
    transition: transform 0.1s ease;
}

.site_simplifie .windows_portfolio:active {
    cursor: grabbing;
}

.site_simplifie .windows_portfolio.dragging {
    opacity: 0.2;
    transform: scale(0.98);
}

.site_simplifie  .windows_portfolio_id > .windows_portfolio_content {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;
}

.site_simplifie  .windows_portfolio_id > .windows_portfolio_content > .windows_portfolio_photo {
    width: 40%;
}

.site_simplifie  .windows_portfolio_id > .windows_portfolio_content > .windows_portfolio_texte {
    width: 50%;
    padding: 10px;
}

.site_simplifie  .windows_portfolio_id > .windows_portfolio_content > .windows_portfolio_texte p {
    font-size: 1.2rem;
    font-weight: bold;
}

.site_simplifie  .windows_portfolio_cp p {
    margin : 0;
}

.site_simplifie  .windows_portfolio_cp p.rpg-capacite-nom {
    margin-bottom : 10px;
    font-weight: bold;
}

.layout-icones {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    list-style: none;
    padding: 0;
    margin: 0;
}

.icone-item {
    margin: 0;
    padding: 0;
    width: var(--icone-size);
    height: var(--icone-size);
    overflow: visible;
    width: 6vh;
    max-height: 6vh;
    min-height: 4vh;
}

.icone-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    display: block;
}

.icone-img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
    image-rendering: pixelated;
}

.icone-overlay {
  --shiftX: 0px;
  position: absolute;
  bottom: calc(100% + 0.625rem);
  left: 50%;
  transform: translateX(calc(-50% + var(--shiftX))) translateY(0.25rem);
  min-width: max-content;
  max-width: 10rem;
  background: var(--CG_noir);
  border: 0.125rem solid var(--CG_beige);
  box-shadow: inset 0 0 0 0.0625rem var(--CG_vertFonce);
  padding: 6px 10px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity var(--transition-speed) ease, transform var(--transition-speed) ease;
  z-index: 10;
}

.icone-overlay::after {
  content: '';
  position: absolute;
  top: 100%;
  left: calc(50% - var(--shiftX));
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 0.375rem solid transparent;
  border-right: 0.375rem solid transparent;
  border-top: 0.375rem solid var(--CG_beige);
}

.icone-legend {
    color: var(--CG_beige);
    font-family: 'Press Start 2P', monospace;
    font-size: 0.5625rem;
    text-align: center;
    margin: 0;
    line-height: 1.4;
    white-space: normal;
    max-width: 12rem;
}

.icone-wrapper:hover .icone-overlay,
.icone-wrapper.is-active .icone-overlay {
    opacity: 1;
    visibility: visible;
    transform: translateX(calc(-50% + var(--shiftX))) translateY(0);
}

.rpg-bars-grid {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.rpg-bar-row {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

.rpg-bar-icon {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    image-rendering: pixelated;
}

.rpg-bar-label {
    width: 65%;
    flex-shrink: 0;
    font-size: 1rem;
    font-family: var(--FontPrincipal);
    font-weight: bold;
}

.rpg-bar-track {
    display: flex;
    width: 100%;
    gap: 2px;
    flex: 1;
    background: var(--CG_rouge);
    border: 2px solid var(--CG_rouge);
}

.rpg-bar-segment {
    flex: 1;
    height: 1rem;
    background: var(--CG_jaune);
    border: 1px solid var(--CG_jaune);
}

.rpg-bar-segment.is-filled {
    background: linear-gradient(180deg, var(--CG_or) 0%, var(--CG_or) 60%, var(--CG_orange) 60%, var(--CG_orange) 100%);
    border-color: var(--CG_rouge);
}

.rpg-bar-segment.is-filled:last-of-type {
    background: linear-gradient(180deg, var(--CG_or) 0%, var(--CG_or) 100%);
    border-color: var(--CG_rouge);
}

.rpg-bar-value {
    width: 34%;
    flex-shrink: 0;
    text-align: right;
    font-size: 0.8rem;
    color: var(--CG_rouge);
    font-family: var(--FontPrincipal);
}

.windows_portfolio_qp .rpg-bar-track {
    display: flex;
    margin: 10px 0;
    width: 100%;
    box-sizing: border-box;
    box-shadow: none;
    align-items: stretch;
}

.windows_portfolio_qp .rpg-quete-pourcentage {
    display: block;
    text-align: right;
    font-weight: bold;
    font-size: 0.9rem;
}

.windows_portfolio_qp .rpg-bar-segment {
    position: relative;
    flex: 1;
    height: 1.5rem;
    background: var(--CG_jaune);
    border-left: 1px solid var(--CG_rouge);
    border-right: 1px solid var(--CG_rouge);
    overflow: hidden;
}

.windows_portfolio_qp .rpg-bar-segment.is-filled {
    background: var(--CG_or);
}

.windows_portfolio_qp .rpg-bar-segment.is-filled::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 40%;
    background: var(--CG_orange);
}
.windows_portfolio_sd .windows_portfolio_texte {
    display: flex;
    flex-direction: row;
    gap: 25px;
    justify-content: center;
}

.windows_portfolio_sd .windows_portfolio_texte p {
    margin: 0;
}

.windows_portfolio_ct ul {
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 25px;
}

  .floppy-wrap{
  width: 60px;
  height: 60px;
  }

.floppy{
  width: 1px;
  height: 1px;
  box-shadow:
    4px 0px 0 1.75px var(--CG_noir),
    8px 0px 0 1.75px var(--CG_noir),
    12px 0px 0 1.75px var(--CG_noir),
    16px 0px 0 1.75px var(--CG_noir),
    20px 0px 0 1.75px var(--CG_noir),
    24px 0px 0 1.75px var(--CG_noir),
    28px 0px 0 1.75px var(--CG_noir),
    32px 0px 0 1.75px var(--CG_noir),
    36px 0px 0 1.75px var(--CG_noir),
    40px 0px 0 1.75px var(--CG_noir),
    0px 4px 0 1.75px var(--CG_noir),
    4px 4px 0 1.75px var(--CG_noir),
    8px 4px 0 1.75px var(--CG_noir),
    12px 4px 0 1.75px var(--CG_noir),
    16px 4px 0 1.75px var(--CG_noir),
    20px 4px 0 1.75px var(--CG_noir),
    24px 4px 0 1.75px var(--CG_noir),
    28px 4px 0 1.75px var(--CG_noir),
    32px 4px 0 1.75px var(--CG_noir),
    36px 4px 0 1.75px var(--CG_noir),
    40px 4px 0 1.75px var(--CG_noir),
    44px 4px 0 1.75px var(--CG_noir),
    0px 8px 0 1.75px var(--CG_noir),
    4px 8px 0 1.75px var(--CG_bleuGris),
    8px 8px 0 1.75px var(--CG_bleuGris),
    12px 8px 0 1.75px var(--CG_bleuGris),
    16px 8px 0 1.75px var(--CG_bleuGris),
    20px 8px 0 1.75px var(--CG_bleuGris),
    24px 8px 0 1.75px var(--CG_bleuGris),
    28px 8px 0 1.75px var(--CG_bleuGris),
    32px 8px 0 1.75px var(--CG_bleuGris),
    36px 8px 0 1.75px var(--CG_bleuGris),
    40px 8px 0 1.75px var(--CG_bleuGris),
    44px 8px 0 1.75px var(--CG_noir),
    0px 12px 0 1.75px var(--CG_noir),
    4px 12px 0 1.75px var(--CG_bleuGris),
    8px 12px 0 1.75px var(--CG_bleuGris),
    12px 12px 0 1.75px var(--CG_bleuGris),
    16px 12px 0 1.75px var(--CG_bleuGris),
    24px 12px 0 1.75px var(--CG_bleuGris),
    28px 12px 0 1.75px var(--CG_bleuGris),
    32px 12px 0 1.75px var(--CG_bleuGris),
    36px 12px 0 1.75px var(--CG_bleuGris),
    40px 12px 0 1.75px var(--CG_bleuGris),
    44px 12px 0 1.75px var(--CG_noir),
    0px 16px 0 1.75px var(--CG_noir),
    4px 16px 0 1.75px var(--CG_bleuGris),
    8px 16px 0 1.75px var(--CG_bleuGris),
    12px 16px 0 1.75px var(--CG_bleuGris),
    16px 16px 0 1.75px var(--CG_bleuGris),
    24px 16px 0 1.75px var(--CG_bleuGris),
    28px 16px 0 1.75px var(--CG_bleuGris),
    32px 16px 0 1.75px var(--CG_bleuGris),
    36px 16px 0 1.75px var(--CG_bleuGris),
    40px 16px 0 1.75px var(--CG_bleuGris),
    44px 16px 0 1.75px var(--CG_noir),
    0px 20px 0 1.75px var(--CG_noir),
    4px 20px 0 1.75px var(--CG_noir),
    8px 20px 0 1.75px var(--CG_noir),
    12px 20px 0 1.75px var(--CG_noir),
    16px 20px 0 1.75px var(--CG_noir),
    20px 20px 0 1.75px var(--CG_noir),
    24px 20px 0 1.75px var(--CG_noir),
    28px 20px 0 1.75px var(--CG_noir),
    32px 20px 0 1.75px var(--CG_noir),
    36px 20px 0 1.75px var(--CG_noir),
    40px 20px 0 1.75px var(--CG_noir),
    44px 20px 0 1.75px var(--CG_noir),
    0px 24px 0 1.75px var(--CG_noir),
    44px 24px 0 1.75px var(--CG_noir),
    0px 28px 0 1.75px var(--CG_noir),
    8px 28px 0 1.75px var(--status-color),
    12px 28px 0 1.75px var(--status-color),
    16px 28px 0 1.75px var(--status-color),
    20px 28px 0 1.75px var(--status-color),
    24px 28px 0 1.75px var(--status-color),
    28px 28px 0 1.75px var(--status-color),
    32px 28px 0 1.75px var(--status-color),
    36px 28px 0 1.75px var(--status-color),
    44px 28px 0 1.75px var(--CG_noir),
    0px 32px 0 1.75px var(--CG_noir),
    8px 32px 0 1.75px var(--status-color),
    12px 32px 0 1.75px var(--status-color),
    16px 32px 0 1.75px var(--status-color),
    20px 32px 0 1.75px var(--status-color),
    24px 32px 0 1.75px var(--status-color),
    28px 32px 0 1.75px var(--status-color),
    32px 32px 0 1.75px var(--status-color),
    36px 32px 0 1.75px var(--status-color),
    44px 32px 0 1.75px var(--CG_noir),
    0px 36px 0 1.75px var(--CG_noir),
    8px 36px 0 1.75px var(--status-color),
    12px 36px 0 1.75px var(--status-color),
    16px 36px 0 1.75px var(--status-color),
    20px 36px 0 1.75px var(--status-color),
    24px 36px 0 1.75px var(--status-color),
    28px 36px 0 1.75px var(--status-color),
    32px 36px 0 1.75px var(--status-color),
    36px 36px 0 1.75px var(--status-color),
    44px 36px 0 1.75px var(--CG_noir),
    0px 40px 0 1.75px var(--CG_noir),
    8px 40px 0 1.75px var(--status-color),
    12px 40px 0 1.75px var(--status-color),
    16px 40px 0 1.75px var(--status-color),
    20px 40px 0 1.75px var(--status-color),
    24px 40px 0 1.75px var(--status-color),
    28px 40px 0 1.75px var(--status-color),
    32px 40px 0 1.75px var(--status-color),
    36px 40px 0 1.75px var(--status-color),
    44px 40px 0 1.75px var(--CG_noir),
    0px 44px 0 1.75px var(--CG_noir),
    44px 44px 0 1.75px var(--CG_noir),
    0px 48px 0 1.75px var(--CG_noir),
    40px 48px 0 1.75px var(--CG_noir),
    44px 48px 0 1.75px var(--CG_noir),
    0px 52px 0 1.75px var(--CG_noir),
    4px 52px 0 1.75px var(--CG_noir),
    8px 52px 0 1.75px var(--CG_noir),
    12px 52px 0 1.75px var(--CG_noir),
    16px 52px 0 1.75px var(--CG_noir),
    20px 52px 0 1.75px var(--CG_noir),
    24px 52px 0 1.75px var(--CG_noir),
    28px 52px 0 1.75px var(--CG_noir),
    32px 52px 0 1.75px var(--CG_noir),
    36px 52px 0 1.75px var(--CG_noir),
    40px 52px 0 1.75px var(--CG_noir);
}

  /* --- Statuts : une seule variable à changer --- */
  .status-disponible{ --status-color: var(--CG_vertClair); }
  .status-en_mission{ --status-color: var(--CG_orange); }
  .status-bientot { --status-color: var(--CG_rouge); }

  /* Léger clignotement du label, façon LED d'activité */
  .floppy-wrap.blink .floppy{
    animation: blink 1.6s steps(1, end) infinite;
  }
  @keyframes blink{
    0%, 100% { opacity: 1; }
    50% { opacity: .55; }
  }

  .windows_portfolio_p2 .btnHomePrincipal:hover {
    color: var(--CG_beige);
    background-color: var(--CG_vertSapin);
    cursor: not-allowed;
  }

  .site_simplifie .windows_portfolio_p2 {
    box-shadow: unset;
  }

  .site_simplifie .windows_portfolio_p2 .btnHomePrincipal {
    background-color: var(--CG_vertFonce);
    color: var(--CG_or);
    width: 100%;
    display: block;
    text-align: center;
  }

  .windows_portfolio_p2 .btnHome {
    padding: 10px 20px;
    box-shadow: 0 -4px 0 #1a1a1a, 0 4px 0 #1a1a1a, -4px 0 0 #1a1a1a, 4px 0 0 #1a1a1a;
    font-family: var(--FontPrincipal);
    font-size: 1.8rem;
    text-decoration: none;
    position: relative;
    }

    #ModalContact.Modal h2 {
        background-color: unset;
        border-bottom: unset;
    }


/*---------------------------------------------------------------------------- */
/*-------------------------   Responsive   ----------------------------------- */
/*---------------------------------------------------------------------------- */

@media screen and (width <= 920px) {
    :root { font-size: 14px;}

    .site_simplifie .blocContenu {
        padding: 3vmin;
        margin: 3vmin;
    }

    .site_simplifie .windows_portfolio_id > .windows_portfolio_content > .windows_portfolio_texte {
        width: 100%;
    }

    .site_simplifie .windows_portfolio ul:not([class]) {
        padding-left: 20px;
    }

    .home .site-branding img { max-width: 80vw; min-width: 300px; width: 80vw;}
    .home .choix { gap:5vh;}
    #BtnDialogInscription { transform: unset; top: unset; bottom: 120%;left: unset;
    right: 0;
    margin-left: 0;}
    #BtnDialogInscription::after { left: unset; right: 20px;}
    .flex_column_mobile {display: flex;flex-direction: column;}
    .home .choix .btnHome { text-align: center; }
    footer .site-menu ul { flex-direction: column; align-content: center; padding: 1rem 2rem; text-align: center;}

    .icone-item {
        width: 5vh;
        max-height: 5vh;
        min-height: 3vh;
    }

    .site_simplifie  .windows_portfolio_id > .windows_portfolio_content {
        padding: 20px; 
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: space-around;
    }

    #ModalInscription.Modal, #ModalContact.Modal {
        width: 80vw;
    }

    .rpg-lang-switch {
        font-size: 0.85rem;
        width: 160px;
        height: 38px;
        right: 8px;
        top: 8px;
    }

    .rpg-lang-switch__option {
        padding: 6px 10px;
        gap: 4px;
    }

    .rpg-lang-switch__flag {
        width: 16px;
        height: 16px;
    }

}

@media screen and (width <= 728px) {
    .icone-item {
        width: 4vh;
        max-height: 4vh;
        min-height: 3vh;
    }

    .site_simplifie .rpg-lang-switch {
        position: relative;
        top:0;
        right: 0;
        max-width: 45%;
    }

    .site-header-btn{
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }
}

@media (max-width: 600px) {
    :root { font-size: 12px;}
    .site_simplifie main {
        column-count: 1;
        column-gap: 0;
    }

    .btn-retour-pixel {
        max-width: 45%;
    }
    .rpg-bar-label { width: 100%}
    .rpg-bar-value {text-align: left; width: 25%;}
    #BtnDialogInscription {
        margin-left: 0;
    }
    #ModalInscription.Modal, #ModalContact.Modal {
        width: 86vw;
    }
}