/* ========================================================================
   NOVTINIS — Fiche commerce premium desktop
   ------------------------------------------------------------------------
   Couche de composition pour ordinateur uniquement.
   Le modèle mobile, les scripts, les scans, les avis et les données métier
   ne sont pas modifiés. Cette feuille harmonise la fiche avec la grille
   Novtinis 1360 px et transforme la colonne de droite en panneau de visite.
   ======================================================================== */

@media (min-width: 981px) {
  :root {
    --nt-listing-max: 1360px;
    --nt-listing-gutter: 32px;
    --nt-listing-gap: 28px;
    --nt-listing-card-radius: 28px;
    --nt-listing-line: #e3ebf5;
    --nt-listing-ink: #10233f;
    --nt-listing-muted: #62748f;
  }

  body.single-listing .listing-single-pro {
    width: 100vw !important;
    min-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    background:
      radial-gradient(circle at 8% 0%, rgba(44, 111, 233, .10), transparent 28rem),
      radial-gradient(circle at 92% 16%, rgba(255, 140, 74, .08), transparent 25rem),
      linear-gradient(180deg, #f8fbff 0%, #f2f6fb 100%) !important;
  }

  body.single-listing .single-v3-page {
    width: min(calc(100vw - (var(--nt-listing-gutter) * 2)), var(--nt-listing-max)) !important;
    max-width: var(--nt-listing-max) !important;
    margin: 0 auto !important;
    padding: 0 0 76px !important;
    background: transparent !important;
    overflow: visible !important;
  }

  /* Le menu de fiche historique est seulement un fallback : le composant
     partagé est la navigation effective dès qu'il est chargé. */
  body.single-listing .nt-listing-desktop-nav {
    display: none !important;
  }

  /* Le composant partagé vit en plein viewport : son inner reprend le même
     axe de 1360 px que les autres pages, tandis que le hero reste dans la
     grille de la fiche. */
  body.single-listing .single-v3-page > .nt-public-desktop-nav {
    width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: 0 !important;
    margin-bottom: 0 !important;
  }

  body.single-listing .single-v3-hero {
    position: relative !important;
    min-height: clamp(450px, 35vw, 520px) !important;
    margin: 0 !important;
    overflow: hidden !important;
    border-radius: 32px !important;
    box-shadow: 0 28px 58px rgba(16, 35, 63, .18) !important;
  }

  body.single-listing .single-v3-slider,
  body.single-listing .single-v3-slider .slider-track,
  body.single-listing .single-v3-slider .slide,
  body.single-listing .single-v3-slider .slide img {
    height: clamp(450px, 35vw, 520px) !important;
  }

  body.single-listing .single-v3-overlay {
    background:
      linear-gradient(90deg, rgba(4, 20, 48, .82) 0%, rgba(4, 20, 48, .48) 52%, rgba(4, 20, 48, .08) 100%),
      linear-gradient(0deg, rgba(4, 20, 48, .76) 0%, rgba(4, 20, 48, .02) 70%) !important;
  }

  body.single-listing .single-v3-topbar {
    top: 28px !important;
    left: 28px !important;
    right: 28px !important;
  }

  body.single-listing .single-v3-back,
  body.single-listing .single-top-icon {
    width: 48px !important;
    height: 48px !important;
    border: 1px solid rgba(255, 255, 255, .72) !important;
    box-shadow: 0 14px 30px rgba(0, 0, 0, .20) !important;
  }

  body.single-listing .single-v3-hero-content {
    left: 44px !important;
    right: 44px !important;
    bottom: 38px !important;
    max-width: 720px !important;
  }

  body.single-listing .single-v3-hero-title {
    max-width: 700px !important;
    font-size: clamp(44px, 4.3vw, 64px) !important;
    line-height: .98 !important;
    letter-spacing: -.055em !important;
  }

  body.single-listing .single-v3-hero-r\61 ting-row {
    margin-top: 18px !important;
  }

  body.single-listing .single-v3-shell {
    margin-top: 0 !important;
    padding: 28px 0 0 !important;
  }

  /* Grille 8/4 : tout le contenu de lecture demeure à gauche, le panneau de
     visite (avantage, horaires, téléphone, itinéraire) accompagne le scroll. */
  body.single-listing .single-v3-head-card {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 372px !important;
    grid-auto-rows: auto !important;
    column-gap: var(--nt-listing-gap) !important;
    row-gap: 20px !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  body.single-listing .single-v3-head-card > .single-v3-meta-line,
  body.single-listing .single-v3-head-card > .single-v3-submeta,
  body.single-listing .single-v3-head-card > .single-v3-actions-scroll-card,
  body.single-listing .single-v3-head-card > .single-client-gallery-card,
  body.single-listing .single-v3-head-card > .single-v3-social-proof-card,
  body.single-listing .single-v3-head-card > .single-v3-recommend-card,
  body.single-listing .single-v3-head-card > .single-v3-panels-card,
  body.single-listing .single-v3-head-card > .single-location-section {
    grid-column: 1 !important;
    min-width: 0 !important;
    margin: 0 !important;
  }

  /* Synthèse de visite : une seule carte claire, sans faire gonfler les
     actions sur toute la page. */
  body.single-listing .single-v3-head-card > .single-v3-meta-line {
    display: flex !important;
    align-items: center !important;
    gap: 9px !important;
    margin: 0 !important;
    padding: 22px 24px 0 !important;
    border: 1px solid var(--nt-listing-line) !important;
    border-bottom: 0 !important;
    border-radius: var(--nt-listing-card-radius) var(--nt-listing-card-radius) 0 0 !important;
    background: #fff !important;
    box-shadow: 0 18px 38px rgba(16, 35, 63, .06) !important;
  }

  body.single-listing .single-v3-head-card > .single-v3-submeta {
    margin: 0 !important;
    padding: 16px 24px !important;
    border-left: 1px solid var(--nt-listing-line) !important;
    border-right: 1px solid var(--nt-listing-line) !important;
    background: #fff !important;
  }

  body.single-listing .single-v3-head-card > .single-v3-actions-scroll-card {
    margin: 0 !important;
    padding: 0 24px 22px !important;
    border: 1px solid var(--nt-listing-line) !important;
    border-top: 0 !important;
    border-radius: 0 0 var(--nt-listing-card-radius) var(--nt-listing-card-radius) !important;
    background: #fff !important;
    box-shadow: 0 18px 38px rgba(16, 35, 63, .06) !important;
  }

  body.single-listing .single-v3-actions-scroll {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    overflow: visible !important;
  }

  body.single-listing .single-action-pill {
    min-height: 44px !important;
    padding: 0 15px !important;
    border-radius: 14px !important;
    font-size: 13px !important;
  }

  body.single-listing .single-desktop-sidebar {
    display: flex !important;
    grid-column: 2 !important;
    grid-row: 1 / span 8 !important;
    align-self: start !important;
    position: sticky !important;
    top: 24px !important;
    flex-direction: column !important;
    gap: 14px !important;
  }

  body.single-listing .single-desktop-sidebar .single-v3-advantages-card,
  body.single-listing .single-desktop-practical-card {
    margin: 0 !important;
    border-radius: 26px !important;
    box-shadow: 0 18px 38px rgba(16, 35, 63, .08) !important;
  }

  body.single-listing .single-desktop-sidebar .single-v3-advantages-card {
    padding: 22px !important;
    border: 1px solid rgba(36, 99, 235, .18) !important;
    background:
      radial-gradient(circle at 100% 0%, rgba(77, 181, 255, .18), transparent 40%),
      linear-gradient(180deg, #fff 0%, #f4f8ff 100%) !important;
  }

  body.single-listing .single-desktop-sidebar .single-v3-advantages-card .single-section-title,
  body.single-listing .single-desktop-practical-card h2 {
    color: var(--nt-listing-ink) !important;
    font-size: 25px !important;
    letter-spacing: -.04em !important;
  }

  body.single-listing .single-desktop-sidebar .single-v3-advantages-card .single-v3-cta {
    min-height: 54px !important;
    border-radius: 16px !important;
  }

  body.single-listing .single-desktop-practical-card {
    padding: 21px !important;
    border: 1px solid var(--nt-listing-line) !important;
    background: #fff !important;
  }

  /* Les sections de lecture n'occupent plus une largeur artificielle. */
  body.single-listing .single-v3-panels-card,
  body.single-listing .single-client-gallery-card,
  body.single-listing .single-v3-recommend-card,
  body.single-listing .single-location-section {
    border: 1px solid var(--nt-listing-line) !important;
    border-radius: var(--nt-listing-card-radius) !important;
    background: #fff !important;
    box-shadow: 0 18px 38px rgba(16, 35, 63, .05) !important;
  }

  body.single-listing .single-v3-panels-card {
    overflow: hidden !important;
  }

  body.single-listing .single-v4-tabs {
    display: flex !important;
    gap: 8px !important;
    padding: 18px 22px 13px !important;
    border-bottom: 1px solid #eef2f7 !important;
    background: linear-gradient(180deg, #fbfdff 0%, #fff 100%) !important;
  }

  body.single-listing .single-v4-tab {
    min-height: 42px !important;
    padding: 0 14px !important;
    border-radius: 14px !important;
    font-size: 13px !important;
  }

  body.single-listing .single-v4-panels-content {
    padding: 22px 24px 26px !important;
  }

  body.single-listing .single-content-title {
    color: var(--nt-listing-ink) !important;
    font-size: 26px !important;
    letter-spacing: -.04em !important;
  }

  /* Galerie : une rangée éditoriale, de grands aperçus et un scroll naturel
     au lieu d'une succession de miniatures comprimées. */
  body.single-listing .single-client-gallery-card {
    padding: 22px 24px !important;
  }

  body.single-listing .single-client-gallery-head {
    margin-bottom: 16px !important;
  }

  body.single-listing .single-client-gallery-head h2 {
    color: var(--nt-listing-ink) !important;
    font-size: 25px !important;
    letter-spacing: -.04em !important;
  }

  body.single-listing .single-client-gallery-strip {
    display: flex !important;
    gap: 12px !important;
    overflow-x: auto !important;
    padding-bottom: 4px !important;
    scroll-snap-type: x mandatory !important;
    scrollbar-width: thin !important;
  }

  body.single-listing .single-client-gallery-item {
    flex: 0 0 clamp(106px, 10vw, 132px) !important;
    height: clamp(106px, 10vw, 132px) !important;
    scroll-snap-align: start !important;
    border-radius: 18px !important;
  }

  /* Contribution : texte d'abord, actions juste à côté, jamais deux barres
     géantes qui traversent une grande zone blanche. */
  body.single-listing .single-v3-recommend-card {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 18px 24px !important;
    padding: 22px 24px !important;
  }

  body.single-listing .single-v3-recommend-copy {
    min-width: 0 !important;
  }

  body.single-listing .single-v3-recommend-title {
    margin: 0 0 6px !important;
    color: var(--nt-listing-ink) !important;
    font-size: 18px !important;
    font-weight: 900 !important;
  }

  body.single-listing .single-v3-recommend-subtext {
    margin: 0 !important;
    color: var(--nt-listing-muted) !important;
    font-size: 13px !important;
  }

  body.single-listing .single-v3-recommend-actions {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
  }

  body.single-listing .single-recommend-btn {
    min-height: 44px !important;
    padding: 0 14px !important;
    border-radius: 14px !important;
    font-size: 12px !important;
    white-space: nowrap !important;
  }

  body.single-listing .single-recommend-btn span {
    margin-left: 4px;
    opacity: .72;
    font-weight: 800;
  }

  /* Localisation : un en-tête opérationnel, une adresse compacte puis une
     carte à la bonne hauteur. Le CTA mobile original est conservé hors desktop. */
  body.single-listing .single-location-section {
    padding: 24px !important;
  }

  body.single-listing .single-location-section__head {
    display: flex !important;
    align-items: start !important;
    justify-content: space-between !important;
    gap: 16px !important;
    margin-bottom: 16px !important;
  }

  body.single-listing .single-location-section__eyebrow {
    display: block !important;
    margin-bottom: 6px !important;
    color: #2563eb !important;
    font-size: 11px !important;
    font-weight: 950 !important;
    letter-spacing: .09em !important;
    text-transform: uppercase !important;
  }

  body.single-listing .single-location-section__head .single-content-title {
    margin: 0 !important;
  }

  body.single-listing .single-location-open-map {
    min-height: 42px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    padding: 0 14px !important;
    border: 1px solid #d9e6f6 !important;
    border-radius: 14px !important;
    background: #f8fbff !important;
    color: #1d63d0 !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
  }

  body.single-listing .single-address-block {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 16px !important;
    min-height: 72px !important;
    margin-bottom: 14px !important;
    padding: 14px 16px !important;
    border: 1px solid #edf2f7 !important;
    border-radius: 18px !important;
    background: #f9fbfd !important;
  }

  body.single-listing .single-address-text {
    color: #34455f !important;
    font-size: 14px !important;
    font-weight: 750 !important;
  }

  body.single-listing .single-address-distance {
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 8px 11px !important;
    border-radius: 999px !important;
    background: #eaf2ff !important;
    color: #1e5fc8 !important;
    font-size: 12px !important;
    font-weight: 900 !important;
  }

  body.single-listing .single-map-box iframe {
    height: 292px !important;
    border-radius: 20px !important;
  }

  body.single-listing .single-map-cta {
    display: none !important;
  }
}

@media (min-width: 981px) and (max-width: 1180px) {
  :root {
    --nt-listing-gutter: 24px;
  }

  body.single-listing .single-v3-head-card {
    grid-template-columns: minmax(0, 1fr) 330px !important;
    column-gap: 22px !important;
  }

  body.single-listing .single-v3-recommend-card {
    grid-template-columns: 1fr !important;
  }

  body.single-listing .single-v3-recommend-actions {
    justify-content: flex-start !important;
  }
}