/* VORETT — finitions ciblées du 30 octobre 2026.
   Préserve les textes, la structure et les interactions existantes. */
:root { --vorett-vert: #23382D; --vorett-brun: #49382B; }

/* Un seul repère horizontal dans les honoraires. */
#accueil .honoraires-layout,
#accueil .honoraires-table { border-top: 0 !important; }

/* Les titres de situation et le premier module d'honoraires ne portent
   pas un second filet : la section fournit déjà son repère transversal. */
main[id^="metier-"] .interior-situations .interior-case,
main[id^="metier-"] .interior-fees .interior-offers {
  border-top: 0 !important;
}

/* Formulaire : libellés discrets sans empattements, valeurs en sérif. */
#accueil .contact-v10 fieldset legend,
#accueil .contact-v10 label:not(:has(input[type="radio"])) {
  font-family: 'Avenir Next', 'Helvetica Neue', Arial, sans-serif !important;
  font-size: 10.5px !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
}
#accueil .contact-v10 input:not([type="radio"]):not([type="checkbox"]),
#accueil .contact-v10 textarea,
#accueil .contact-v10 select,
#accueil .contact-v11-section .v11-letter-right input[type="email"] {
  font-family: 'GFS Baskerville', 'Baskerville', 'EB Garamond', Georgia, serif !important;
  font-size: 15.5px !important;
  font-weight: 400 !important;
  font-style: normal !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
#accueil .contact-v10 input::placeholder,
#accueil .contact-v10 textarea::placeholder,
#accueil .contact-v11-section .v11-letter-right input[type="email"]::placeholder {
  font-family: 'GFS Baskerville', 'Baskerville', 'EB Garamond', Georgia, serif !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  font-style: italic !important;
  color: #998D81 !important;
  opacity: 1 !important;
}
#accueil .contact-v10 select:invalid {
  font-style: italic !important;
  color: #998D81 !important;
}
#accueil .contact-v10 select:valid {
  font-style: normal !important;
}
#accueil .contact-v11-section .v11-news-consent {
  font-family: 'GFS Baskerville', 'Baskerville', 'EB Garamond', Georgia, serif !important;
  font-size: 14px !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

/* Les choix de profil restent ronds, mais à une échelle plus fine. */
#accueil .v10-pills { gap: 11px 21px !important; }
#accueil .v10-pills label span {
  font-size: 14.5px !important;
  line-height: 1.4 !important;
  gap: 8px !important;
}
#accueil .v10-pills label span::before {
  width: 12px !important;
  height: 12px !important;
}
#accueil .v10-pills input:checked + span::before {
  border-width: 3.5px !important;
}
@media (max-width:780px) {
  #accueil .v10-pills label span { font-size: 14px !important; }
}

/* Focus : un seul filet vert, jamais un contour doublé. */
#accueil .contact-v10 input:not([type="radio"]):not([type="checkbox"]):focus,
#accueil .contact-v10 select:focus,
#accueil .contact-v10 textarea:focus,
#accueil .contact-v11-section .v11-letter-right input[type="email"]:focus {
  border: 1px solid var(--vorett-vert) !important;
  outline: 0 !important;
  box-shadow: none !important;
}
#accueil .contact-v11-section .v11-news-consent input[type="checkbox"] {
  accent-color: var(--vorett-vert) !important;
}

/* Les trois appels à l'action : brun au repos, vert forêt au survol. */
#accueil #metiers .plaquette-button,
#accueil .contact-v10 button.v10-submit,
#accueil .contact-v11-section .v11-letter-right button {
  background: var(--vorett-brun) !important;
  border-color: var(--vorett-brun) !important;
  color: #F6F1E7 !important;
}
#accueil #metiers .plaquette-button:hover,
#accueil #metiers .plaquette-button:focus-visible,
#accueil .contact-v10 button.v10-submit:hover,
#accueil .contact-v10 button.v10-submit:focus-visible,
#accueil .contact-v11-section .v11-letter-right button:hover,
#accueil .contact-v11-section .v11-letter-right button:focus-visible {
  background: var(--vorett-vert) !important;
  border-color: var(--vorett-vert) !important;
  color: #F6F1E7 !important;
}

/* Même interaction sur les six fiches métiers. */
main[id^="metier-"] a.interior-cta,
main[id^="metier-"] button.interior-cta {
  background: var(--vorett-brun) !important;
  border-color: var(--vorett-brun) !important;
  color: #F6F1E7 !important;
}
main[id^="metier-"] a.interior-cta:hover,
main[id^="metier-"] a.interior-cta:focus-visible,
main[id^="metier-"] a.interior-cta:active,
main[id^="metier-"] button.interior-cta:hover,
main[id^="metier-"] button.interior-cta:focus-visible,
main[id^="metier-"] button.interior-cta:active {
  background: var(--vorett-vert) !important;
  border-color: var(--vorett-vert) !important;
  color: #F6F1E7 !important;
}

/* Navigation : plus de rectangle autour des liens sélectionnés.
   Au clavier, la couleur suffit à signaler le lien actif. */
#accueil .site-header a:focus-visible,
main[id^="metier-"] .site-header a:focus-visible {
  outline: 0 !important;
  box-shadow: none !important;
  color: var(--vorett-vert) !important;
}
#accueil #metiers .plaquette-button:focus-visible,
#accueil .contact-v10 button.v10-submit:focus-visible,
#accueil .contact-v11-section .v11-letter-right button:focus-visible,
main[id^="metier-"] .interior-cta:focus-visible {
  outline: 0 !important;
  box-shadow: none !important;
}

/* Réglage fin de l'échelle desktop : le mobile et les six cartes restent intacts. */
@media (min-width:781px) {
  #accueil .hero h1 {
    font-size: clamp(31px, 2.75vw, 39px) !important;
  }
  #accueil .hero-summary {
    font-size: 17.5px !important;
    line-height: 1.76 !important;
    max-width: 610px !important;
  }
  #accueil #approche .section-intro h2 {
    font-size: clamp(28px, 2.7vw, 36px) !important;
  }
  #accueil .site-header nav a,
  #accueil .site-header nav a.is-current,
  main[id^="metier-"] .site-header nav a,
  main[id^="metier-"] .site-header nav a.is-current {
    font-size: 9px !important;
  }
}

/* La sélection est un accent très sombre, sans vert vif. */
#accueil .v10-pills input:checked + span {
  color: var(--vorett-vert) !important;
}
#accueil .v10-pills input:checked + span::before {
  border-color: var(--vorett-vert) !important;
}
#accueil .v10-pills input:focus-visible + span::before {
  outline-color: var(--vorett-vert) !important;
}
#accueil .contact-v11-section .v11-letter-right input[type=email]:focus-visible,
#accueil .contact-v10 input:not([type=radio]):not([type=checkbox]):focus-visible,
#accueil .contact-v10 select:focus-visible,
#accueil .contact-v10 textarea:focus-visible {
  outline: 0 !important;
  box-shadow: none !important;
  border-color: var(--vorett-vert) !important;
}

/* Contact — retouche minimale validée : bouton affiné, trois accès sans encadré. */
#accueil .contact-v10 button.v10-submit {
  padding: 12px 18px !important;
  font-size: 10px !important;
  line-height: 1.4 !important;
  letter-spacing: .10em !important;
  font-weight: 400 !important;
}
#accueil .contact-v11-section .v10-foot {
  align-items: flex-start !important;
}
#accueil .contact-v11-section .v10-contact-links {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 3px;
}
#accueil .contact-v11-section .v10-contact-links a,
#accueil .contact-v11-section .v10-contact-links a[href^="tel:"] {
  font-family: 'Avenir Next', 'Helvetica Neue', Arial, sans-serif !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
  font-style: normal !important;
  line-height: 1.65 !important;
  letter-spacing: .01em !important;
  color: #655649 !important;
  text-decoration: none;
}
#accueil .contact-v11-section .v10-contact-links a:first-child {
  color: #49382B !important;
}
#accueil .contact-v11-section .v10-contact-links a:hover,
#accueil .contact-v11-section .v10-contact-links a:focus-visible {
  color: var(--vorett-vert) !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}
@media (max-width:780px) {
  #accueil .contact-v10 button.v10-submit {
    width: auto !important;
    max-width: 100% !important;
  }
  #accueil .contact-v11-section .v10-contact-links {
    align-items: flex-start;
    margin-top: 12px;
  }
  #accueil .contact-v11-section .v10-contact-links a,
  #accueil .contact-v11-section .v10-contact-links a[href^="tel:"] {
    font-size: 13px !important;
  }
}

/* VORETT — échelle éditoriale du bureau. Le mobile et la grille des métiers
   restent à leur taille validée ; seules les zones désignées sont affinées. */
@media (min-width:781px) {
  #accueil .site-header > a.brand,
  main[id^="metier-"] .site-header > a.brand {
    width: 136px !important;
    gap: 11px !important;
    justify-self: center !important;
  }
  #accueil .site-header > a.brand img,
  main[id^="metier-"] .site-header > a.brand img {
    width: 57px !important;
    height: 57px !important;
  }
  #accueil .site-header > a.brand span,
  main[id^="metier-"] .site-header > a.brand span {
    font-size: 18px !important;
  }
  #accueil .hero h1 {
    font-size: clamp(29px, 2.55vw, 35px) !important;
    line-height: 1.37 !important;
  }
  #accueil #approche .approach-lead {
    font-size: 23px !important;
    line-height: 1.47 !important;
  }
  #accueil .new-approach h2 {
    font-size: 24px !important;
    line-height: 1.46 !important;
  }
  #accueil #honoraires a.honoraires-row > span:first-child {
    font-size: 17px !important;
    line-height: 1.36 !important;
  }
  #accueil #honoraires .honoraires-price {
    font-size: 16px !important;
    line-height: 1.36 !important;
  }
}

/* Un clic sur la navigation ne doit jamais dessiner un rectangle autour du mot.
   Le repère au clavier demeure la nuance vert forêt. */
#accueil .site-header nav a:focus,
main[id^="metier-"] .site-header nav a:focus {
  outline: 0 !important;
  outline-offset: 0 !important;
  box-shadow: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  -webkit-tap-highlight-color: transparent !important;
}
#accueil .site-header nav a:focus-visible,
main[id^="metier-"] .site-header nav a:focus-visible {
  color: var(--vorett-vert) !important;
}

/* Le menu burger ne remplace les liens que sur l'accueil mobile.
   Les six métiers et Perspectives conservent leur navigation actuelle. */
#accueil .vorett-mobile-trigger,
#accueil .vorett-mobile-panel {
  display: none;
}
@media (max-width:780px) {
  #accueil .site-header {
    height: 91px !important;
    min-height: 91px !important;
    padding: 9px 19px !important;
    gap: 0 !important;
    grid-template-columns: 1fr 106px 1fr !important;
    align-items: center !important;
  }
  #accueil .site-header > nav.nav-left,
  #accueil .site-header > nav.nav-right {
    display: none !important;
  }
  #accueil .site-header > a.brand {
    grid-column: 2 !important;
    grid-row: 1 !important;
    justify-self: center !important;
    width: 106px !important;
    gap: 8px !important;
  }
  #accueil .site-header > a.brand img {
    width: 48px !important;
    height: 48px !important;
  }
  #accueil .site-header > a.brand span {
    font-size: 12px !important;
    letter-spacing: .34em !important;
  }
  #accueil .vorett-mobile-trigger {
    display: flex !important;
    grid-column: 3 !important;
    grid-row: 1 !important;
    justify-self: end !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    border: 0;
    background: transparent;
    color: #49382B;
    width: 43px;
    height: 43px;
    padding: 11px 8px;
    cursor: pointer;
  }
  #accueil .vorett-mobile-trigger span {
    width: 23px;
    height: 1px;
    display: block;
    background: currentColor;
    transition: transform .18s, opacity .18s;
  }
  #accueil .vorett-mobile-trigger[aria-expanded=true] span:first-child {
    transform: translateY(6px) rotate(45deg);
  }
  #accueil .vorett-mobile-trigger[aria-expanded=true] span:nth-child(2) {
    opacity: 0;
  }
  #accueil .vorett-mobile-trigger[aria-expanded=true] span:last-child {
    transform: translateY(-6px) rotate(-45deg);
  }
  #accueil .vorett-mobile-panel[aria-hidden=false] {
    display: flex !important;
  }
  #accueil .vorett-mobile-panel {
    position: absolute;
    top: calc(100% - 1px);
    right: 15px;
    z-index: 999;
    width: min(250px,calc(100vw - 30px));
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
    background: #F6F1E7;
    border: 1px solid rgba(84,77,67,.19);
    box-shadow: 0 14px 31px rgba(30,27,22,.10);
    padding: 10px 21px;
  }
  #accueil .site-header .vorett-mobile-panel a {
    display: block;
    padding: 14px 0;
    font-family: 'Avenir Next','Helvetica Neue',Arial,sans-serif !important;
    font-size: 10px !important;
    font-weight: 400;
    letter-spacing: .145em !important;
    line-height: 1.5;
    text-transform: uppercase;
    color: #625449;
  }
  #accueil .site-header .vorett-mobile-panel a + a {
    border-top: 1px solid rgba(84,77,67,.12) !important;
  }
  #accueil .site-header .vorett-mobile-panel a:hover,
  #accueil .site-header .vorett-mobile-panel a:focus-visible {
    color: var(--vorett-vert) !important;
  }
  /* Rapprocher la fin des références de l'approche suivante,
     sans supprimer la respiration apportée par le diptyque. */
  #accueil #approche { padding-bottom: 52px !important; }
  #accueil #notre-approche { padding-top: 57px !important; }
  #accueil #metiers,
  #accueil #honoraires,
  #accueil #contact,
  #accueil #notre-approche { scroll-margin-top: 93px !important; }
}