/* V44 — correction ciblée de l’en-tête de la page d’accueil.
   Ce fichier surcharge uniquement l’en-tête afin d’éviter tout impact sur le reste de la page. */

.topbar { overflow: visible !important; }

.topbar .header-inner {
  width: min(100% - 36px, 1680px) !important;
  max-width: none !important;
  margin-inline: auto !important;
  display: grid !important;
  grid-template-columns: minmax(360px, auto) minmax(0, 1fr) auto !important;
  align-items: center !important;
  column-gap: clamp(16px, 1.6vw, 30px) !important;
  min-height: 112px !important;
  padding-inline: 0 !important;
}

.topbar .brand {
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  white-space: nowrap !important;
}

.topbar .brand-logo {
  width: 82px !important;
  height: 82px !important;
  flex: 0 0 82px !important;
  object-fit: contain !important;
}

.topbar .brand-text {
  min-width: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  line-height: 1.05 !important;
}

.topbar .brand-text strong {
  font-size: clamp(32px, 2.25vw, 40px) !important;
  line-height: 1 !important;
  letter-spacing: .01em !important;
  white-space: nowrap !important;
}

.topbar .brand-text small {
  margin-top: 9px !important;
  font-size: clamp(12px, .85vw, 14px) !important;
  line-height: 1.15 !important;
  letter-spacing: .12em !important;
  white-space: nowrap !important;
}

.topbar .nav {
  min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: clamp(11px, 1.15vw, 22px) !important;
  white-space: nowrap !important;
}

.topbar .nav a {
  font-size: clamp(12px, .82vw, 15px) !important;
  line-height: 1.25 !important;
  padding-inline: 0 !important;
}

.topbar .header-phone {
  justify-self: end !important;
  flex: none !important;
  white-space: nowrap !important;
  font-size: clamp(24px, 1.75vw, 30px) !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  letter-spacing: .01em !important;
}

.topbar .menu-btn { display: none !important; }

/* Fenêtres intermédiaires : on conserve l’identité et le téléphone lisibles,
   et l’on libère la place occupée par le menu complet. */
@media (max-width: 1420px) {
  .topbar .header-inner {
    grid-template-columns: minmax(330px, 1fr) auto auto !important;
    column-gap: 22px !important;
    min-height: 104px !important;
  }
  .topbar .nav { display: none !important; }
  .topbar .menu-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 48px !important;
    height: 48px !important;
    padding: 0 !important;
    font-size: 27px !important;
    line-height: 1 !important;
    justify-self: end !important;
  }
  .topbar .header-phone { font-size: 27px !important; }
  .topbar .brand-text strong { font-size: 36px !important; }
  .topbar .brand-text small { font-size: 13px !important; }
}

@media (max-width: 980px) {
  .topbar .header-inner {
    width: min(100% - 24px, 960px) !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    grid-template-areas:
      "brand menu"
      "phone phone" !important;
    row-gap: 10px !important;
    min-height: 132px !important;
    padding-block: 10px !important;
  }
  .topbar .brand { grid-area: brand !important; }
  .topbar .menu-btn { grid-area: menu !important; }
  .topbar .header-phone {
    grid-area: phone !important;
    justify-self: start !important;
    font-size: 24px !important;
    margin-left: 100px !important;
  }
  .topbar .brand-logo {
    width: 72px !important;
    height: 72px !important;
    flex-basis: 72px !important;
  }
  .topbar .brand-text strong { font-size: 32px !important; }
  .topbar .brand-text small { font-size: 12px !important; }
}

@media (max-width: 620px) {
  .topbar .header-inner {
    width: calc(100% - 20px) !important;
    min-height: 120px !important;
  }
  .topbar .brand { gap: 11px !important; }
  .topbar .brand-logo {
    width: 58px !important;
    height: 58px !important;
    flex-basis: 58px !important;
  }
  .topbar .brand-text strong { font-size: clamp(25px, 7.1vw, 31px) !important; }
  .topbar .brand-text small {
    font-size: 10px !important;
    letter-spacing: .07em !important;
  }
  .topbar .header-phone {
    margin-left: 69px !important;
    font-size: 21px !important;
  }
  .topbar .menu-btn {
    width: 44px !important;
    height: 44px !important;
    font-size: 24px !important;
  }
}


/* V58 — correction du menu hamburger.
   La règle .nav {display:none!important} des largeurs intermédiaires
   empêchait .nav.open de devenir visible après le clic. */
@media (max-width: 1420px) {
  .topbar .header-inner {
    position: relative !important;
  }

  .topbar .nav.open {
    display: flex !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    z-index: 1000 !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    padding: 12px 20px 18px !important;
    background: #061a2f !important;
    border-top: 1px solid rgba(255,255,255,.08) !important;
    box-shadow: 0 14px 28px rgba(0,0,0,.24) !important;
    white-space: normal !important;
  }

  .topbar .nav.open a {
    display: block !important;
    width: 100% !important;
    padding: 13px 6px !important;
    border-bottom: 1px solid rgba(255,255,255,.08) !important;
    font-size: 14px !important;
    line-height: 1.3 !important;
    text-align: left !important;
  }

  .topbar .nav.open a:last-child {
    border-bottom: 0 !important;
  }

  .topbar .menu-btn {
    cursor: pointer !important;
    position: relative !important;
    z-index: 1001 !important;
  }
}

@media (max-width: 620px) {
  .topbar .nav.open {
    padding-inline: 12px !important;
  }
  .topbar .nav.open a {
    font-size: 13px !important;
    padding-block: 12px !important;
  }
}


/* V204 — correction ciblée du menu desktop
   Objectif : empêcher tout chevauchement CONTACT / téléphone. */
@media (min-width: 1501px) {
  .topbar .header-inner {
    grid-template-columns: minmax(330px, auto) minmax(0, 1fr) auto !important;
    column-gap: clamp(14px, 1.05vw, 22px) !important;
  }

  .topbar .nav {
    justify-content: flex-end !important;
    gap: clamp(8px, .72vw, 14px) !important;
  }

  .topbar .nav a {
    font-size: clamp(11.5px, .72vw, 14px) !important;
  }

  .topbar .nav .nav-rdv-cta {
    padding-left: 14px !important;
    padding-right: 14px !important;
  }

  .topbar .nav > a:last-child {
    margin-right: 0 !important;
  }

  .topbar .header-phone {
    margin-left: 14px !important;
    font-size: clamp(23px, 1.55vw, 29px) !important;
  }
}

/* À une largeur où le menu complet devient trop serré, on passe proprement
   au bouton hamburger au lieu de comprimer ou superposer les éléments. */
@media (min-width: 1421px) and (max-width: 1500px) {
  .topbar .header-inner {
    grid-template-columns: minmax(330px, 1fr) auto auto !important;
    column-gap: 22px !important;
    min-height: 104px !important;
  }
  .topbar .nav { display: none !important; }
  .topbar .menu-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 48px !important;
    height: 48px !important;
    padding: 0 !important;
    font-size: 27px !important;
    line-height: 1 !important;
    justify-self: end !important;
  }
  .topbar .header-phone {
    margin-left: 0 !important;
    font-size: 27px !important;
  }
}


/* V207 — en-tête mobile compact et sans chevauchement */
@media (max-width:768px){
  .topbar .header-inner{
    width:calc(100% - 20px)!important;
    min-height:82px!important;
    padding:8px 0!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto auto!important;
    grid-template-areas:"brand phone menu"!important;
    column-gap:9px!important;
    row-gap:0!important;
  }
  .topbar .brand{grid-area:brand!important;gap:9px!important;min-width:0!important;}
  .topbar .brand-logo{width:54px!important;height:54px!important;flex:0 0 54px!important;}
  .topbar .brand-text{min-width:0!important;}
  .topbar .brand-text strong{font-size:clamp(22px,6.3vw,28px)!important;line-height:1!important;}
  .topbar .brand-text small{
    margin-top:5px!important;
    font-size:8px!important;
    line-height:1.15!important;
    letter-spacing:.055em!important;
    white-space:normal!important;
  }
  .topbar .header-phone{
    grid-area:phone!important;
    justify-self:end!important;
    align-self:center!important;
    margin:0!important;
    padding:0!important;
    width:40px!important;
    height:40px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    font-size:20px!important;
    line-height:1!important;
  }
  .topbar .header-phone span{display:none!important;}
  .topbar .menu-btn{
    grid-area:menu!important;
    width:42px!important;
    height:42px!important;
    font-size:23px!important;
    justify-self:end!important;
  }
  .topbar .nav.open{
    top:100%!important;
    left:-10px!important;
    right:-10px!important;
    max-height:calc(100vh - 82px)!important;
    overflow-y:auto!important;
    padding:8px 14px 14px!important;
  }
  .topbar .nav.open a{font-size:13px!important;padding:12px 5px!important;}
  .topbar .nav.open .nav-rdv-cta{
    margin:8px 0 4px!important;
    padding:13px 10px!important;
    text-align:center!important;
    justify-content:center!important;
    background:#d7a23d!important;
    color:#fff!important;
    border-bottom:0!important;
  }
}
@media(max-width:370px){
  .topbar .header-inner{width:calc(100% - 14px)!important;column-gap:6px!important;}
  .topbar .brand-logo{width:48px!important;height:48px!important;flex-basis:48px!important;}
  .topbar .brand-text strong{font-size:21px!important;}
  .topbar .brand-text small{font-size:7px!important;}
  .topbar .header-phone{width:36px!important;height:36px!important;font-size:18px!important;}
  .topbar .menu-btn{width:38px!important;height:38px!important;font-size:21px!important;}
}
/* ==========================================================
   V208 — Harmonisation mobile globale
   Objectif : reproduire sur toutes les pages le header mobile
   validé sur l'accueil et neutraliser les variantes historiques.
   Périmètre : <= 768 px uniquement.
   ========================================================== */
@media (max-width:768px){
  .topbar{min-height:104px!important;height:auto!important;overflow:visible!important;}
  .topbar .container.header-inner,.topbar .header-inner{box-sizing:border-box!important;width:100%!important;max-width:none!important;min-height:104px!important;height:auto!important;margin:0!important;padding:12px 14px!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:9px!important;position:relative!important;}
  .topbar .brand{order:1!important;flex:1 1 auto!important;min-width:0!important;margin:0!important;display:flex!important;align-items:center!important;gap:10px!important;}
  .topbar .brand-logo{width:58px!important;height:58px!important;min-width:58px!important;flex:0 0 58px!important;object-fit:contain!important;}
  .topbar .brand-text{display:block!important;min-width:0!important;overflow:visible!important;}
  .topbar .brand-text strong{display:block!important;margin:0!important;font-size:clamp(24px,7.2vw,31px)!important;line-height:1!important;letter-spacing:-.025em!important;white-space:nowrap!important;}
  .topbar .brand-text small{display:block!important;margin-top:6px!important;font-size:clamp(7.2px,2.25vw,9.5px)!important;line-height:1.15!important;letter-spacing:.035em!important;white-space:nowrap!important;}
  .topbar .menu-btn{order:2!important;flex:0 0 40px!important;width:40px!important;height:40px!important;min-width:40px!important;margin:0!important;padding:0!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;font-size:25px!important;line-height:1!important;}
  .topbar .header-phone{order:3!important;flex:0 0 40px!important;width:40px!important;height:40px!important;min-width:40px!important;margin:0!important;padding:0!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;overflow:hidden!important;white-space:nowrap!important;font-size:0!important;line-height:1!important;text-decoration:none!important;}
  .topbar .header-phone span{display:none!important;}
  .topbar .header-phone::before{content:"☎";display:block;font-size:23px!important;line-height:1!important;}
  .topbar .nav{display:none!important;}
  .topbar .nav.open{display:flex!important;position:absolute!important;left:0!important;right:0!important;top:100%!important;z-index:9998!important;flex-direction:column!important;align-items:stretch!important;gap:0!important;max-height:calc(100vh - 104px)!important;overflow-y:auto!important;padding:10px 16px 16px!important;background:#06172c!important;border-top:1px solid rgba(255,255,255,.09)!important;box-shadow:0 16px 28px rgba(0,0,0,.22)!important;}
  .topbar .nav.open a{display:block!important;width:100%!important;box-sizing:border-box!important;padding:12px 4px!important;border-bottom:1px solid rgba(255,255,255,.08)!important;font-size:13px!important;line-height:1.25!important;text-align:left!important;}
  .topbar .nav.open a:last-child{border-bottom:0!important;}
  .topbar .nav.open .nav-rdv-cta,.topbar .nav.open .nav-cta{margin:8px 0 5px!important;padding:13px 12px!important;text-align:center!important;background:#d7a23d!important;color:#fff!important;border-bottom:0!important;}
  .auction-hero .wrap,.saisie-hero-grid,.saisies-hero-grid,.inner-hero-grid,.domain-hero-grid,.fees52-layout,.rdv67-grid,.rdv67-hero-grid,.contact-hero-v64 .contact-hero-grid,.geo-layout,.cabinet-grid,.article-grid{grid-template-columns:1fr!important;}
  .auction-copy{padding:40px 18px 28px!important;}
  .auction-copy h1{font-size:clamp(42px,12vw,58px)!important;line-height:1.02!important;overflow-wrap:normal!important;}
  .auction-copy .lead{font-size:18px!important;line-height:1.55!important;}
  .auction-copy p{font-size:16px!important;line-height:1.7!important;}
  .auction-media{position:relative!important;width:100%!important;height:280px!important;inset:auto!important;}
  .auction-media:before{background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,.68) 12%,transparent 38%)!important;}
  .info-grid{grid-template-columns:1fr!important;}
  .info{border-right:0!important;border-bottom:1px solid #e2e6eb!important;}
  .info:last-child{border-bottom:0!important;}
  .costs,.auction-links-grid,.auction-docs-grid,.simulator-body,.simulateur-grid,.simulator-grid{grid-template-columns:1fr!important;}
  .steps{grid-template-columns:1fr!important;}
  .step{border-right:0!important;border-bottom:1px solid #e4e7eb!important;}
  .step:last-child{border-bottom:0!important;}
  .simulator,.auction-docs,.auction-links{margin-left:0!important;margin-right:0!important;border-radius:12px!important;}
  .simulator-head,.sim-form,.sim-results,.auction-docs,.auction-links{padding-left:18px!important;padding-right:18px!important;}
  .inner-hero h1,.domain-hero h1,.auction-copy h1,.fees52-hero-copy h1,.rdv67-copy h1,.contact-hero-v64 h1,.resources-intro h1,.resources-intro h2{max-width:100%!important;overflow-wrap:break-word!important;hyphens:auto!important;}
  .breadcrumbs{overflow:hidden!important;}
  .breadcrumbs .container{display:flex!important;align-items:center!important;gap:8px!important;overflow-x:auto!important;white-space:nowrap!important;scrollbar-width:none!important;-webkit-overflow-scrolling:touch!important;}
  .breadcrumbs .container::-webkit-scrollbar{display:none!important;}
  .mobile-contact-bar{display:grid!important;grid-template-columns:1.08fr .92fr!important;left:0!important;right:0!important;bottom:0!important;width:100%!important;min-height:62px!important;z-index:9999!important;}
  .mobile-contact-bar a{min-width:0!important;display:flex!important;align-items:center!important;justify-content:center!important;text-align:center!important;white-space:nowrap!important;font-size:13.5px!important;padding:0 8px!important;}
}
@media (max-width:390px){
  .topbar .container.header-inner,.topbar .header-inner{min-height:96px!important;padding-left:10px!important;padding-right:10px!important;gap:6px!important;}
  .topbar .brand{gap:8px!important;}
  .topbar .brand-logo{width:50px!important;height:50px!important;min-width:50px!important;flex-basis:50px!important;}
  .topbar .brand-text strong{font-size:22px!important;}
  .topbar .brand-text small{font-size:6.8px!important;letter-spacing:.02em!important;}
  .topbar .menu-btn,.topbar .header-phone{width:36px!important;height:36px!important;min-width:36px!important;flex-basis:36px!important;}
  .topbar .menu-btn{font-size:22px!important;}
  .topbar .header-phone::before{font-size:20px!important;}
}



/* ==========================================================
   V209 — Correctif icône téléphone mobile
   Évite le double pictogramme sur les pages dont le HTML
   contient déjà un symbole téléphone avant le numéro.
   ========================================================== */
@media (max-width:768px){
  .topbar .header-phone{
    position:relative!important;
    text-indent:-9999px!important;
    overflow:hidden!important;
    color:transparent!important;
    font-size:0!important;
  }

  .topbar .header-phone *{
    display:none!important;
  }

  .topbar .header-phone::before{
    content:"☎"!important;
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    transform:translate(-50%,-50%)!important;
    display:block!important;
    width:auto!important;
    height:auto!important;
    text-indent:0!important;
    color:#d8a640!important;
    font-size:24px!important;
    line-height:1!important;
    font-family:Arial,Helvetica,sans-serif!important;
  }
}

@media (max-width:390px){
  .topbar .header-phone::before{
    font-size:21px!important;
  }
}

