/* ========================================
   DESKTOP 01 — HEADER OVER HERO
===================================== */

#mainHeader.premium-header {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  z-index: 5000 !important;
   
  padding: 0 !important;
  background: linear-gradient(
    180deg,
    rgba(4, 10, 17, 0.92) 0%,
    rgba(4, 10, 17, 0.62) 65%,
    rgba(4, 10, 17, 0) 100%
  ) !important;

  box-shadow: none !important;
  border: none !important;
}

.reservation-page #mainHeader.premium-header {
  overflow: hidden !important;
}

.reservation-page #mainHeader .reservation-header-bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
}

.reservation-page #mainHeader
.reservation-header-bg::before {
  content: "";
  position: absolute;
  inset: 0;
  background: transparent !important;
  background-image: none !important;
}

.reservation-page #mainHeader
.reservation-header-bg::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 50%;
  z-index: 2;

  background: linear-gradient(
    90deg,
    #050505 0%,
    #050505 60%,
    rgba(5, 5, 5, 0.96) 72%,
    rgba(5, 5, 5, 0.70) 82%,
    rgba(5, 5, 5, 0.25) 92%,
    rgba(5, 5, 5, 0) 100%
  );
}

.reservation-page #mainHeader .header-inner {
  position: relative;
  z-index: 1;
}



#mainHeader.premium-header .header-inner {
  width: min(92%, 1420px) !important;
  max-width: 1420px !important;
  min-height: 88px !important;
  margin: 0 auto !important;
  padding: 10px 0 !important;
}

/* Remove the separate Réserver link from the desktop header */
#mainHeader.premium-header .header-booking-btn {
  display: none !important;
}

/* =========================================
   DESKTOP 02 — LOGO AND NAVIGATION
========================================= */

#mainHeader .header-inner {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 28px !important;
}

#mainHeader .premium-brand {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex-shrink: 0 !important;
  color: #ffffff !important;
  text-decoration: none !important;
}

#mainHeader .premium-brand-mark {
  width: 56px !important;
  height: 64px !important;
  flex-shrink: 0 !important;
}

#mainHeader .premium-brand-text strong {
  display: block !important;
  color: #ffffff !important;
  font-size: 22px !important;
  line-height: 1.02 !important;
  white-space: nowrap !important;
}

#mainHeader .brand-subtitle {
  display: block !important;
  margin-top: 5px !important;
  color: #d4a62a !important;
  font-size: 11px !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}

/* Hide mobile header controls on desktop */
#mainHeader .header-actions {
  display: none !important;
}

#mainHeader nav {
  margin-left: auto !important;
}

#mainHeader nav ul {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 30px !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

#mainHeader nav a {
  color: #ffffff !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
  text-decoration: none !important;
}

/* =========================================
   DESKTOP — LANGUAGE SWITCHER
   ========================================= */

@media screen and (min-width: 1024px) {

#mainHeader .desktop-language-switcher {
  display: flex !important;
  align-items: center !important;

  gap: 18px !important;

  flex-shrink: 0 !important;

  margin: 0 0 0 -18px !important;
  padding: 0 !important;

  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

#mainHeader .language-option {
  appearance: none !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  gap: 6px !important;

  margin: 0 !important;
  padding: 4px 0 !important;

  color: #ffffff !important;
  background: transparent !important;

  border: none !important;
  outline: none !important;
  box-shadow: none !important;

  font-family: inherit !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1 !important;

  cursor: pointer !important;
  white-space: nowrap !important;
}

  #mainHeader .language-option img {
    display: block !important;

    width: 18px !important;
    height: 13px !important;

    object-fit: cover !important;

    border-radius: 1px !important;
  }

  #mainHeader .language-option:hover {
    color: #d4a62a !important;
  }

  #mainHeader .language-option.is-active {
    color: #d4a62a !important;
    opacity: 1 !important;
  }

   /* INFORMATION PAGE — MENU + LANGUAGES */
.information-page #mainHeader nav {
  margin-left: auto !important;
  margin-right: 18px !important;
}

.information-page #mainHeader .desktop-language-switcher {
  flex-shrink: 0 !important;
  margin-left: 0 !important;
}
   /* INFORMATION PAGE — DARK LEFT /* INFORMATION PAGE — DARK LEFT SIDE OF HEADER */
.information-page #mainHeader.premium-header,
.reservation-page #mainHeader.premium-header {
  background:
    linear-gradient(
      90deg,
      rgba(0, 0, 0, 0.98) 0%,
      rgba(0, 0, 0, 0.98) 34%,
      rgba(0, 0, 0, 0.82) 41%,
      rgba(0, 0, 0, 0) 50%
    ),
    linear-gradient(
      180deg,
      rgba(4, 10, 17, 0.92) 0%,
      rgba(4, 10, 17, 0.62) 65%,
      rgba(4, 10, 17, 0) 100%
    ) !important;
}
}
/* =========================================
   DESKTOP 03 — HERO TITLE
========================================= */

@media screen and (min-width: 1024px) {
  #accueil .hero-premium-inner {
    grid-template-columns: 58% 42% !important;
  }

  #accueil .hero-left {
    max-width: 760px !important;
  }

  #accueil .hero-left h1 {
    max-width: none !important;
    font-size: clamp(40px, 3.5vw, 52px) !important;
    line-height: 1.04 !important;
    letter-spacing: -1.5px !important;
    white-space: nowrap !important;
  }

  #accueil .hero-left h1 span {
    display: block !important;
    width: fit-content !important;
    color: #e0ad32 !important;
    padding-bottom: 5px !important;
    border-bottom: 4px solid #e0ad32 !important;
  }

  #accueil .gold-line {
    display: none !important;
  }
}

/* =========================================
   DESKTOP 04 — GOOGLE RATING
========================================= */

@media screen and (min-width: 1024px) {
  #accueil .google-rating {







    z-index: 20 !important;





    color: #ffffff !important;
    background: rgba(7, 12, 19, 0.65) !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    border-radius: 10px !important;




  }

  #accueil .rating-stars {
    color: #d4a62a !important;
  }
}

/* =========================================
   DESKTOP 04 FIX — RATING ABOVE TITLE
========================================= */

@media screen and (min-width: 1024px) {
  #accueil .hero-left {
    padding-top: 92px !important;
  }

  #accueil .google-rating {
    position: static !important;
    top: auto !important;
    left: auto !important;

    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;

    width: max-content !important;
    margin: 0 0 20px 0 !important;
    padding: 8px 14px !important;

    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }
}

/* =========================================
   DESKTOP 05 — NAV ACTIVE + LOCATION BADGE
========================================= */

@media screen and (min-width: 1024px) {

  /* Remove the gold rectangle behind the active menu */
  /* Home + Reservation: no gold background normally */
body:not(.information-page) #mainHeader nav li,
body:not(.information-page) #mainHeader nav a,
body:not(.information-page) #mainHeader nav a.active,
body:not(.information-page) #mainHeader nav li.active a,
body:not(.information-page) #mainHeader nav a[aria-current="page"] {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

/* Gold background ONLY while mouse is hovering */
/* Home hover + Reservation hover, except Reservation ACCUEIL */
body:not(.information-page):not(.reservation-page) #mainHeader nav a:hover,
.reservation-page #mainHeader nav a:hover:not([href="index.html#accueil"]) {
  color: #b8860b !important;
  background: rgba(201, 149, 16, 0.12) !important;
}

/* Reservation ACCUEIL stays gold, with no hover background */
.reservation-page #mainHeader nav a[href="index.html#accueil"] {
  color: #b8860b !important;
  background: transparent !important;
}

  /* Remove the old large active background */
  #mainHeader nav a::before {
    display: none !important;
    content: none !important;
  }

  /* Clean gold underline */
  #mainHeader nav a {
    position: relative !important;
    padding: 10px 0 !important;
  }

  #mainHeader nav a::after {
    content: "" !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 2px !important;

    height: 2px !important;
    background: #d4a62a !important;

    transform: scaleX(0) !important;
    transform-origin: center !important;
  }

#mainHeader nav a.active::after,
#mainHeader nav li.active a::after,
#mainHeader nav a[aria-current="page"]::after,
.reservation-page #mainHeader nav a[href="index.html#accueil"]::after {
  transform: scaleX(1) !important;
}

  /* Move the city badge closer to the WhatsApp button */
  #accueil .hero-location {
    white-space: nowrap !important;
    transform: translate(-145px, 30px) !important;
  }
}

/* Wider desktop screens */
@media screen and (min-width: 1280px) {
  #accueil .hero-location {
    transform: translate(-220px, 30px) !important;
  }
}

/* =========================================
   DESKTOP 06 — MOBILE-STYLE BRAND LOGO
========================================= */

@media screen and (min-width: 1024px) {

  #mainHeader .premium-brand {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    flex-shrink: 0 !important;
    text-decoration: none !important;
    overflow: visible !important;
  }

  /* Gold crowned TF shield */
  #mainHeader .premium-brand-mark {
    position: relative !important;

    width: 62px !important;
    height: 70px !important;
    min-width: 62px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin-top: 10px !important;

    color: #b8891f !important;
    background: rgba(255, 251, 241, 0.97) !important;
    border: 3px solid #c49a2c !important;
    border-radius: 18px 18px 25px 25px !important;

    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 30px !important;
    font-weight: 700 !important;
    line-height: 1 !important;

    box-shadow: none !important;
    overflow: visible !important;
  }

  /* Crown above the shield */
  #mainHeader .premium-brand-mark::before {
    content: "♛" !important;

    position: absolute !important;
    top: -22px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;

    color: #c49a2c !important;
    font-size: 23px !important;
    line-height: 1 !important;
  }

  #mainHeader .premium-brand-text {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;

    width: 245px !important;
    text-align: center !important;
  }

  #mainHeader .premium-brand-text strong {
    display: block !important;

    color: #ffffff !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 23px !important;
    font-weight: 700 !important;
    line-height: 0.95 !important;
    letter-spacing: -0.3px !important;

    text-align: center !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
  }

  #mainHeader .brand-subtitle {
    display: block !important;

    margin-top: 7px !important;

    color: #d4a62a !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;

    text-align: center !important;
    text-transform: uppercase !important;
    white-space: nowrap !important;
  }
}

/* =========================================
   DESKTOP 06 FIX — COMPLETE MOBILE LOGO
========================================= */

@media screen and (min-width: 1024px) {

  #mainHeader.premium-header .premium-brand-mark {
    position: relative !important;








    color: transparent !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;

    clip-path: none !important;
    -webkit-clip-path: none !important;
    mask: none !important;
    -webkit-mask: none !important;

    transform: none !important;
    overflow: visible !important;
  }

  /* Cream shield with TF */
  #mainHeader.premium-header .premium-brand-mark::before {
    content: "TF" !important;

    position: absolute !important;

    left: 50% !important;
    transform: translateX(-50%) !important;




    display: flex !important;
    align-items: center !important;
    justify-content: center !important;






    font-family: Georgia, "Times New Roman", serif !important;

    font-weight: 700 !important;
    line-height: 1 !important;

    box-sizing: border-box !important;
    z-index: 1 !important;
  }

  /* Gold crown */
  #mainHeader.premium-header .premium-brand-mark::after {
    content: "♛" !important;

    position: absolute !important;

    left: 50% !important;
    transform: translateX(-50%) !important;

    color: #c49a2c !important;

    line-height: 1 !important;

    z-index: 2 !important;
  }



  #mainHeader.premium-header .premium-brand-text strong {
    font-family: Georgia, "Times New Roman", serif !important;

    line-height: 0.96 !important;

  }

  #mainHeader.premium-header .brand-subtitle {
    margin-top: 7px !important;


  }
}

/* =========================================
   DESKTOP 06B — ONLY THE TF LOGO IS CREAM
========================================= */

@media screen and (min-width: 1024px) {

  /* Remove the cream card behind the complete brand */
  #mainHeader.premium-header .premium-brand {
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    gap: 10px !important;
  }

  /* Smaller TF shield only */
  #mainHeader.premium-header .premium-brand-mark {
    width: 48px !important;
    height: 56px !important;
    min-width: 48px !important;
    flex: 0 0 48px !important;
    margin: 0 !important;
  }

  #mainHeader.premium-header .premium-brand-mark::before {
    top: 9px !important;
    width: 43px !important;
    height: 46px !important;


    border: 2px solid #c49a2c !important;
    border-radius: 12px 12px 17px 17px !important;

    color: #b8891f !important;
    font-size: 20px !important;
  }

  #mainHeader.premium-header .premium-brand-mark::after {
    top: -3px !important;
    font-size: 17px !important;
  }

  /* Company text stays directly on the dark header */
  #mainHeader.premium-header .premium-brand-text {
    width: 190px !important;
    align-items: flex-start !important;
    text-align: left !important;
  }

  #mainHeader.premium-header .premium-brand-text strong {

    font-size: 18px !important;
    text-align: left !important;
  }

  #mainHeader.premium-header .brand-subtitle {

    font-size: 8px !important;
    text-align: left !important;
  }
}

/* =========================================
   FINAL LOGO FIX — CREAM TF SHIELD ONLY
========================================= */

@media screen and (min-width: 1024px) {

  /* Remove the cream background from the complete logo area */
  #mainHeader.premium-header a.premium-brand,
  #mainHeader.premium-header .premium-brand {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;

    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;

    padding: 0 !important;
    overflow: visible !important;
  }

  /* Keep the company text directly on the dark header */
  #mainHeader.premium-header .premium-brand-text,
  #mainHeader.premium-header .premium-brand-text strong,
  #mainHeader.premium-header .brand-subtitle {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
  }

  #mainHeader.premium-header .premium-brand-text strong {
    color: #ffffff !important;
  }

  #mainHeader.premium-header .brand-subtitle {
    color: #d4a62a !important;
  }

  /* Only the TF shield receives the cream background */
  #mainHeader.premium-header .premium-brand-mark::before {
    background: #fffaf0 !important;
    background-color: #fffaf0 !important;
  }
}

/* DESKTOP STEP 3 — SPACE AFTER “À LILLE” */

@media screen and (min-width: 1024px) {
  section#accueil.hero-premium .hero-left .hero-description {
    margin-top: 64px !important;
  }
}

/* DESKTOP STEP 4 — MOVE DOWN ARROW UP */

@media screen and (min-width: 1024px) {
  section#accueil.hero-premium .hero-scroll-down {
    bottom: 70px !important;
  }
}

/* Show business card on desktop */
.vehicle-business-card-wrap {
  display: flex !important;
}

/* ==================================================
   DESKTOP — VTC SECTION + FLIPPING BUSINESS CARD
================================================== */

@media screen and (min-width: 1024px) {

  #vehicule .vehicle-desktop-layout {
    position: relative;
    z-index: 4;

    display: grid;
    grid-template-columns:
      minmax(0, 1.05fr)
      minmax(390px, 0.85fr);

    align-items: center;
    gap: 34px;

    padding: 38px 38px 125px;
  }


  /* LEFT SIDE */

  #vehicule .vehicle-service-column {
    min-width: 0;
  }

  #vehicule .vehicle-service-column .vehicle-experience-heading {
    padding: 0 15px 28px !important;
  }

  #vehicule .vehicle-service-column .vehicle-experience-heading p {
    font-size: 30px !important;
  }

  #vehicule .vehicle-service-column .vehicle-experience-heading h2 {
    font-size: 38px !important;
  }

  #vehicule .vehicle-service-column .vehicle-info-grid {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;

    display: grid !important;
    grid-template-columns:
      repeat(2, minmax(0, 1fr)) !important;

    gap: 13px !important;
  }

  #vehicule .vehicle-service-column .vehicle-info-item {
    min-height: 105px !important;
    padding: 17px !important;

    grid-template-columns: 55px 1fr !important;
    gap: 13px !important;

    border-radius: 16px !important;

    transition:
      transform 0.3s ease,
      border-color 0.3s ease,
      box-shadow 0.3s ease;
  }

  #vehicule .vehicle-service-column .vehicle-info-item:hover {
    transform: translateY(-5px);

    border-color:
      rgba(230, 179, 37, 0.65) !important;

    box-shadow:
      0 15px 28px rgba(0, 0, 0, 0.28),
      0 0 18px rgba(218, 166, 43, 0.12) !important;
  }

  #vehicule .vehicle-service-column .vehicle-info-icon {
    width: 52px !important;
    height: 52px !important;

    font-size: 21px !important;
  }

  #vehicule .vehicle-service-column .vehicle-info-item strong {
    font-size: 15px !important;
    line-height: 1.25 !important;
  }

  #vehicule .vehicle-service-column .vehicle-info-item span {
    margin-top: 5px !important;

    font-size: 12px !important;
    line-height: 1.4 !important;
  }


  /* RIGHT SIDE */

  #vehicule .vehicle-business-card-wrap {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    min-width: 0;
    transform: translateY(13px);
  }

  #vehicule .business-card-label {
    margin-bottom: 17px;

    color: #d9a72d;

    font-size: 12px;
    font-weight: 700;
    letter-spacing: 3px;
    text-align: center;
    text-transform: uppercase;
  }


  /* FLIP AREA */

  #vehicule .tf-business-card-scene {
    width: 100%;
    max-width: 490px;
    aspect-ratio: 1.55 / 1;

    perspective: 1500px;

  }

  #vehicule .tf-business-card {
    position: relative;

    width: 100%;
    height: 100%;

    transform-style: preserve-3d;


  }



  /* BOTH SIDES */

  #vehicule .tf-business-card-face {
    position: absolute;
    inset: 0;

    overflow: hidden;

    padding: 28px;

    border:
      1px solid rgba(230, 179, 37, 0.75);

    border-radius: 25px;

    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;

    background:
      radial-gradient(
        circle at 75% 30%,
        rgba(213, 160, 34, 0.14),
        transparent 38%
      ),
      linear-gradient(
        145deg,
        #171717,
        #080808
      );

    box-shadow:
      0 25px 45px rgba(0, 0, 0, 0.45),
      inset 0 1px 0 rgba(255, 255, 255, 0.05);
  }


  /* FRONT */

  #vehicule .tf-business-card-front {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    text-align: center;
  }

  #vehicule .business-card-logo {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  #vehicule .business-card-logo i {
    margin-bottom: -4px;

    color: #dfa92e;
    font-size: 20px;
  }

  #vehicule .business-card-logo span {
    width: 70px;
    height: 70px;

    display: grid;
    place-items: center;

    color: #bd8825;
    background: #fff7e7;

    border: 2px solid #bd8825;
    border-radius: 50%;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 29px;
  }

  #vehicule .tf-business-card-front h3 {
    margin: 19px 0 0;

    color: #ffffff;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 27px;
    text-transform: uppercase;
  }

  #vehicule .tf-business-card-front h4 {
    margin: 6px 0 0;

    color: #d9a72d;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 4px;
    text-transform: uppercase;
  }

  #vehicule .tf-business-card-front p {
    margin: 18px 0 0;

    color: #e7ddd0;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 14px;
    font-style: italic;
  }

  #vehicule .business-card-values {
    margin-top: 21px;

    color: #ddb145;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 13px;
  }


  /* BACK */

  #vehicule .tf-business-card-back {
    display: flex;
    flex-direction: column;

    transform: rotateY(180deg);

    text-align: left;
  }

  #vehicule .tf-business-card-back h3 {
    margin: 0;

    color: #ffffff;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 25px;
  }

  #vehicule .tf-business-card-back > p:first-of-type {
    margin: 4px 0 17px;

    color: #d7a62d;
    font-size: 12px;
  }

  #vehicule .tf-business-card-back a,
  #vehicule .tf-business-card-back > p:not(:first-of-type) {
    display: flex;
    align-items: center;
    gap: 11px;

    margin: 0;
    padding: 11px 0;

    color: #eee6dc;

    border-bottom:
      1px solid rgba(214, 166, 44, 0.22);

    font-size: 13px;
    text-decoration: none;
    overflow-wrap: anywhere;
  }

  #vehicule .tf-business-card-back a i,
  #vehicule .tf-business-card-back > p i {
    width: 34px;
    height: 34px;

    display: grid;
    place-items: center;
    flex: none;

    color: #dfa92d;

    border:
      1px solid rgba(223, 169, 45, 0.55);

    border-radius: 50%;
  }

  #vehicule .tf-business-card-back small {
    margin-top: auto;
    padding: 7px 0 10px;
line-height: 1.2;

    color: #d9a72d;

    border-top:
      1px solid rgba(214, 166, 44, 0.22);

    font-family: Georgia, "Times New Roman", serif;
    font-size: 12px;
    text-align: center;
  }

}
/* AUTOMATIC CONTINUOUS BUSINESS CARD FLIP */

@media screen and (min-width: 1024px) {

  #vehicule .tf-business-card {
    animation:
      tfBusinessCardAutomaticFlip
      10s
      ease-in-out
      infinite !important;

    transition: none !important;
  }

  #vehicule .tf-business-card-scene {
    cursor: default !important;
    pointer-events: none !important;
  }
}

@media screen and (min-width: 1024px) {

  #vehicule .business-card-contact-row {
    display: flex;
    align-items: center;
    gap: 11px;

    margin: 0;
    padding: 11px 0;

    color: #eee6dc;

    border-bottom:
      1px solid rgba(214, 166, 44, 0.22);

    font-size: 13px;
  }

  #vehicule .business-card-contact-row i {
    width: 34px;
    height: 34px;

    display: grid;
    place-items: center;
    flex: none;

    color: #dfa92d;

    border:
      1px solid rgba(223, 169, 45, 0.55);

    border-radius: 50%;
  }
}

/* BUSINESS CARD — MATCH THE HEADER TF LOGO EXACTLY */

@media screen and (min-width: 1024px) {

  #vehicule .business-card-logo .premium-brand-mark {
    position: relative !important;




    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    color: #c9972f !important;
    background: #fffaf0 !important;

    border: 2px solid #d4a33a !important;


    clip-path: none !important;

    font-family: Georgia, "Times New Roman", serif !important;

    font-weight: 500 !important;
    line-height: 1 !important;

    box-shadow:
      0 5px 14px rgba(0, 0, 0, 0.25),
      inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
  }

  #vehicule .business-card-logo .premium-brand-mark::before {
    content: "♛" !important;

    position: absolute !important;

    left: 50% !important;

    transform: translateX(-50%) !important;

    color: #d4a12f !important;
    background: transparent !important;


    line-height: 1 !important;
  }

  #vehicule .business-card-logo .premium-brand-mark::after {
    display: none !important;
    content: none !important;
  }
}

/* BUSINESS CARD — SAME SIZE AS HEADER LOGO */

@media screen and (min-width: 1024px) {

  #vehicule .business-card-logo .premium-brand-mark {
    width: 42px !important;
    height: 48px !important;
    min-width: 42px !important;
    min-height: 48px !important;

    border-radius: 9px 9px 19px 19px !important;

    font-size: 23px !important;
  }

  #vehicule .business-card-logo .premium-brand-mark::before {
    top: -18px !important;
    font-size: 19px !important;
  }
}

/* DESKTOP — SHOW THE FULL VEHICLE SECTION AFTER ARROW CLICK */

#vehicule {
  scroll-margin-top: 0 !important;
}
/* DESKTOP — PLACE UP ARROW ABOVE CONTACT BUTTONS */

@media screen and (min-width: 1024px) {

  #backToTop.back-to-top {
    right: 18px !important;
    bottom: 164px !important;
    z-index: 1600 !important;
  }

}

/* DESKTOP — MATCH “POURQUOI NOUS CHOISIR”
   WIDTH WITH THE VEHICLE SECTION */

@media screen and (min-width: 1024px) {

  section#services.why-premium {
    padding-left: 24px !important;
    padding-right: 24px !important;
    overflow: visible !important;
}

  section#services.why-premium .why-premium-inner {
    margin-left: auto !important;
    margin-right: auto !important;

    box-sizing: border-box !important;
}
section#services.why-premium .container {
  width: 100% !important;
  max-width: none !important;
  overflow: visible !important;
  overflow-x: visible !important;
}
}
/* DESKTOP — MATCH THE MOBILE “POURQUOI NOUS CHOISIR” DESIGN */

@media screen and (min-width: 1024px) {

  section#services .why-premium-inner {
    position: relative !important;

    display: grid !important;
    grid-template-columns:
        31% minmax(0, 1fr) !important;

    align-items: start !important;
    column-gap: 28px !important;

    min-height: 760px !important;

    padding:
        30px
        32px
        150px !important;

    overflow: hidden !important;

    /* SHRINK THE COMPLETE DESIGN TOGETHER */
    width: calc((100vw - 65px) / 0.88) !important;
max-width: none !important;
left: 50% !important;

transform: translateX(-50%) scale(0.88) !important;
transform-origin: top center !important;

    /* REMOVE THE EMPTY SPACE CREATED BY THE SHRINK */
    margin-bottom: -90px !important;
}


  /* GOLD ARC — ONLY THE CURVED RIGHT SIDE */

  section#services .why-premium-inner::before {
    content: "" !important;

    position: absolute !important;

    top: 78px !important;
    left: -300px !important;

    width: 670px !important;
    height: 560px !important;

    border: 0 !important;
    border-right:
      4px solid
      rgba(235, 188, 63, 0.98) !important;

    border-radius: 50% !important;

    transform: none !important;
    opacity: 1 !important;

    box-shadow:
      5px 0 9px rgba(255, 210, 76, 0.80),
      12px 0 28px rgba(225, 172, 45, 0.38) !important;

    pointer-events: none !important;
  }


  /* LEFT TITLE — POSITIONED LIKE MOBILE */

  section#services .why-premium-intro {
    position: relative !important;
    z-index: 3 !important;

    grid-column: 1 !important;
    grid-row: 1 !important;

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;

    padding:
      215px
      0
      0
      18px !important;

    text-align: left !important;
  }


  /* COMPANY CROWN */

  section#services .why-premium-crown {
    display: block !important;

    margin: 0 0 17px !important;

    text-align: left !important;
  }

  section#services .why-premium-crown i {
    display: none !important;
  }

  section#services .why-premium-crown::before {
    content: "♛" !important;

    display: block !important;

    color: #d4a12f !important;

    font-size: 21px !important;
    line-height: 1 !important;
  }


  /* “POURQUOI” */

  section#services .why-premium-intro > p {
    margin: 0 0 5px !important;

    color: #ffffff !important;

    font-family:
      Georgia,
      "Times New Roman",
      serif !important;

    font-size: 29px !important;
    line-height: 1.1 !important;
    text-align: left !important;
  }


  /* FORCE “NOUS” AND “CHOISIR” ON TWO LINES */

  section#services .why-premium-intro h2 {
    display: block !important;

    width: 170px !important;
    max-width: 170px !important;

    margin: 0 !important;

    color: #d9a52e !important;

    font-family:
      Georgia,
      "Times New Roman",
      serif !important;

    font-size: 38px !important;
    line-height: 1.06 !important;
    text-align: left !important;
    text-transform: uppercase !important;

    white-space: normal !important;
  }


  section#services .why-premium-line {
    width: 65px !important;

    margin:
      23px
      0
      22px !important;
  }


  section#services .why-premium-intro > span {
    display: block !important;

    width: 175px !important;
    max-width: 175px !important;

    color: #ffffff !important;

    font-size: 16px !important;
    line-height: 1.45 !important;
    text-align: left !important;
  }


  section#services .why-premium-diamond {
    margin:
      29px
      0
      0 !important;

    text-align: left !important;
  }


  /* RIGHT-SIDE CARDS */

  section#services .why-premium-list {
    position: relative !important;
    z-index: 3 !important;

    grid-column: 2 !important;
    grid-row: 1 !important;

    display: flex !important;
    flex-direction: column !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    gap: 13px !important;
  }


/* RIGHT CARDS — ICONS AND TEXT CORRECTLY SEPARATED */

section#services .why-premium-trigger {
  position: relative !important;

  width: 100% !important;
  min-height: 88px !important;

  padding: 14px 48px 14px 120px !important;

  display: flex !important;
  align-items: center !important;

  text-align: left !important;
}


section#services
.why-premium-trigger
.why-premium-icon {
  position: absolute !important;

  left: 16px !important;
  top: 50% !important;

  width: 56px !important;
  height: 56px !important;
  min-width: 56px !important;

  transform:
    translateY(-50%) !important;

  font-size: 20px !important;

  z-index: 2 !important;
}


section#services .why-premium-text {
  position: relative !important;

  display: block !important;

  width: 100% !important;
  min-width: 0 !important;

  z-index: 3 !important;
}


section#services .why-premium-text strong {
  display: block !important;

  font-size: 17px !important;
  line-height: 1.2 !important;
}


section#services .why-premium-text small {
  display: block !important;

  margin-top: 4px !important;

  font-size: 13px !important;
  line-height: 1.35 !important;
}


section#services .why-premium-arrow {
  right: 18px !important;
}

/* DESKTOP — MATCH TARIFS WIDTH WITH PREVIOUS SECTIONS */

@media screen and (min-width: 1024px) {

  section#tarifs.tarifs-premium {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }

  section#tarifs.tarifs-premium .tarifs-premium-inner {
    width: 100% !important;
    max-width: 1500px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    box-sizing: border-box !important;
  }

}

/* ==================================================
   DESKTOP — TARIFS COMPACT
   SAME WIDTH / SMALLER HEIGHT
   ================================================== */

@media screen and (min-width: 1024px) {

  /* KEEP THE OUTER WIDTH — ONLY REDUCE HEIGHT */
  section#tarifs.tarifs-premium {
    padding-top: 12px !important;
    padding-bottom: 14px !important;
  }

  section#tarifs.tarifs-premium .tarifs-premium-inner {
    padding-top: 18px !important;
    padding-bottom: 138px !important;
  }


  /* ===== TITLE ===== */

  #tarifs .tarifs-heading {
    position: relative !important;
    max-width: 1100px !important;

    margin-left: auto !important;
    margin-right: auto !important;
    margin-bottom: 16px !important;
  }

  #tarifs .tarifs-crown {
    margin-bottom: 4px !important;
    font-size: 19px !important;
  }

  #tarifs .tarifs-heading > p {
    font-size: 22px !important;
    line-height: 1 !important;
  }

  #tarifs .tarifs-heading > h2 {
    margin-top: 2px !important;
    font-size: 31px !important;
    line-height: 1 !important;
  }

  #tarifs .tarifs-heading-line {
    width: 58px !important;
    margin: 10px auto 8px !important;
  }

  #tarifs .tarifs-heading > span {
    font-size: 12px !important;
    line-height: 1.25 !important;
  }


  /* ===== TOP BADGES ===== */

  #tarifs .tarifs-heading-badge {
    display: flex !important;
    position: absolute !important;

    top: 26px !important;

    width: 220px !important;
    min-width: 220px !important;
    min-height: 56px !important;

    align-items: center !important;
    gap: 10px !important;

    padding: 9px 16px !important;

    color: #ffffff;

    background:
      linear-gradient(
        145deg,
        rgba(20, 20, 20, 0.92),
        rgba(8, 8, 8, 0.88)
      ) !important;

    border: 1px solid rgba(217, 165, 46, 0.75) !important;
    border-radius: 28px !important;

    box-shadow:
      0 8px 22px rgba(0, 0, 0, 0.28),
      0 0 15px rgba(217, 165, 46, 0.08) !important;

    z-index: 4 !important;
  }

  #tarifs .tarifs-badge-left {
    left: 0 !important;
  }

  #tarifs .tarifs-badge-right {
    right: 0 !important;
  }

  #tarifs .tarifs-heading-badge i {
    width: 36px !important;
    height: 36px !important;

    display: grid !important;
    place-items: center !important;
    flex: none !important;

    color: #d9a52e !important;

    border: 1px solid rgba(217, 165, 46, 0.65) !important;
    border-radius: 50% !important;

    font-size: 16px !important;
  }

  #tarifs .tarifs-heading-badge > span {
    min-width: 0 !important;
    flex: 1 1 auto !important;
  }

  #tarifs .tarifs-heading-badge strong {
    display: block !important;
    font-size: 13px !important;
    line-height: 1.08 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  #tarifs .tarifs-heading-badge small {
    display: block !important;
    margin-top: 2px !important;
    font-size: 9px !important;
    line-height: 1.08 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  #tarifs .tarifs-badge-left::after,
  #tarifs .tarifs-badge-right::before {
    content: "" !important;

    position: absolute !important;
    top: 50% !important;

    width: 95px !important;
    height: 1px !important;

    background:
      linear-gradient(
        90deg,
        rgba(217, 165, 46, 0.95),
        rgba(217, 165, 46, 0.25)
      ) !important;
  }

  #tarifs .tarifs-badge-left::after {
    right: -96px !important;
  }

  #tarifs .tarifs-badge-right::before {
    left: -96px !important;
    transform: rotate(180deg) !important;
  }


  /* ===== FIVE TARIF ROWS ===== */

  #tarifs .tarifs-list {
    gap: 7px !important;
  }

  #tarifs .tarif-service-card {
    min-height: 68px !important;

    padding:
      9px
      125px
      9px
      64px !important;

    border-radius: 11px !important;
  }

  #tarifs .tarif-service-icon {
    left: 11px !important;

    width: 42px !important;
    height: 42px !important;

    font-size: 16px !important;
  }

  #tarifs .tarif-service-content h3 {
    font-size: 13px !important;
    line-height: 1.1 !important;
  }

  #tarifs .tarif-service-content p {
    margin-top: 3px !important;

    font-size: 10px !important;
    line-height: 1.2 !important;
  }

  #tarifs .tarif-service-price {
    right: 10px !important;
    width: 100px !important;
  }

  #tarifs .tarif-service-price small {
    font-size: 7px !important;
  }

  #tarifs .tarif-service-price strong {
    font-size: 20px !important;
  }

  #tarifs .tarif-service-price span {
    margin-top: 3px !important;
    font-size: 8px !important;
  }

  #tarifs .tarif-service-price .tarif-quote {
    font-size: 13px !important;
  }


  /* ===== €30 MINIMUM CARD ===== */

  #tarifs .tarif-minimum-card {
    padding: 16px 12px !important;
    border-radius: 14px !important;
  }

  #tarifs .tarif-minimum-card i {
    margin-bottom: 9px !important;
    font-size: 21px !important;
  }

  #tarifs .tarif-minimum-card span {
    font-size: 16px !important;
  }

  #tarifs .tarif-minimum-card strong {
    margin: 8px 0 6px !important;
    font-size: 36px !important;
  }

  #tarifs .tarif-minimum-card p {
    font-size: 10px !important;
    line-height: 1.25 !important;
  }


  /* ===== PAYMENT AREA ===== */

  #tarifs .tarifs-payments {
    margin-top: 14px !important;
    padding-top: 11px !important;
  }

  #tarifs .tarifs-payments h3 {
    margin-bottom: 9px !important;
    font-size: 13px !important;
  }

  #tarifs .tarifs-payment-list {
    gap: 7px !important;
  }

  #tarifs .tarifs-payment-list div {
    min-height: 43px !important;
    padding: 6px 8px !important;
    gap: 7px !important;
  }

  #tarifs .tarifs-payment-list i {
    font-size: 16px !important;
  }

  #tarifs .tarifs-payment-list span {
    font-size: 10px !important;
  }


  /* ===== SMALLER SKYLINE ===== */

  #tarifs .tarifs-skyline {
    bottom: 82px !important;

    transform: scaleY(0.68) !important;
    transform-origin: bottom center !important;
  }


  /* ===== SMALLER BOOKING BUTTON ===== */

  #tarifs .tarifs-booking-btn {
    bottom: 42px !important;

    min-height: 40px !important;
    padding: 7px 14px !important;

    font-size: 11px !important;
  }


  /* ===== SMALLER BOTTOM NOTE ===== */

  #tarifs .tarifs-footer-note {
    bottom: 7px !important;

    min-height: 27px !important;
    padding: 5px 10px !important;

    font-size: 9px !important;
  }

}
/* DESKTOP — GARES & AÉROPORTS SAME WIDTH AS PREVIOUS SECTIONS */

@media screen and (min-width: 1024px) {

  section#destinations.destinations-premium {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }

  section#destinations.destinations-premium
  .destinations-premium-inner {
    width: 100% !important;
    max-width: 1500px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    box-sizing: border-box !important;
  }

}

/* DESKTOP — DESTINATIONS TOP BADGES */

@media screen and (min-width: 1024px) {

  #destinations .destinations-heading {
    position: relative !important;
    width: 100% !important;
    max-width: 1150px !important;
    margin-left: auto !important;
    margin-right: auto !important;

    background:
      linear-gradient(
        90deg,
        rgba(217, 165, 46, 0.85),
        rgba(217, 165, 46, 0.15)
      )
      left 255px top 70px / 115px 1px no-repeat,

      linear-gradient(
        270deg,
        rgba(217, 165, 46, 0.85),
        rgba(217, 165, 46, 0.15)
      )
      right 255px top 70px / 115px 1px no-repeat;
  }

#destinations .destinations-heading .destinations-flight-label,
#destinations .destinations-heading .destinationsStationPickupLabel {
  position: absolute !important;
  top: 38px !important;

  width: 240px !important;
  min-width: 240px !important;
  min-height: 64px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 12px 20px !important;

  color: #f1d58b !important;

  background:
    linear-gradient(
      145deg,
      rgba(20, 20, 20, 0.94),
      rgba(7, 7, 7, 0.9)
    ) !important;

  border: 1px solid rgba(217, 165, 46, 0.45) !important;
  border-radius: 32px !important;

  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 14px !important;
  line-height: 1.12 !important;
  text-align: center !important;
  white-space: normal !important;

  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.3),
    0 0 14px rgba(217, 165, 46, 0.12) !important;

  z-index: 4 !important;
}

#destinations .destinations-heading .destinations-flight-label > span,
#destinations .destinations-heading .destinationsStationPickupLabel > span {
  min-width: 0 !important;
  max-width: 100% !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

#destinations .destinations-heading .destinations-flight-label i,
#destinations .destinations-heading .destinationsStationPickupLabel i {
  flex: 0 0 auto !important;
  margin-right: 8px !important;
}

#destinations .destinations-heading .destinations-flight-label {
  left: 0 !important;
}

#destinations .destinations-heading .destinationsStationPickupLabel {
  right: 0 !important;
}

}
/* =========================================================
   DESKTOP ONLY — GARES & AÉROPORTS — EXTRA COMPACT
   Replace the complete old desktop destinations block with this.
   Mobile stays untouched.
   ========================================================= */

@media screen and (min-width: 1024px) {

  /* ---------- COMPLETE SECTION ---------- */

  #destinations.destinations-premium {
    padding: 8px 16px 12px !important;
  }

  #destinations .destinations-premium-inner {
    width: 100% !important;
    max-width: 1500px !important;
    margin: 0 auto !important;
    padding: 10px 18px 12px !important;
    box-sizing: border-box !important;
  }

  #destinations .destinations-heading {
    margin: 0 0 8px !important;
    padding: 0 !important;
     transform: translateX(8%) !important;
  }

  #destinations .destinations-heading h2 {
    margin: 0 !important;
    font-size: 30px !important;
    line-height: 1 !important;
  }

  #destinations .destinations-heading p {
    margin: 0 0 2px !important;
    font-size: 21px !important;
    line-height: 1.05 !important;
  }

  #destinations .destinations-heading > span {
    margin-top: 4px !important;
    font-size: 12px !important;
    line-height: 1.2 !important;
  }

  /* Keep the mobile design hidden only on desktop */
  #destinations .destinations-main-layout {
    display: none !important;
  }

  /* ---------- DESKTOP MAIN AREA ---------- */

  #destinations .destinations-desktop-redesign {
    display: grid !important;
    grid-template-columns:
      minmax(0, 1.22fr)
      minmax(330px, 0.78fr) !important;

    width: 100% !important;
    height: 430px !important;
    min-height: 430px !important;
    max-height: 430px !important;

    gap: 9px !important;
    align-items: stretch !important;
    margin: 0 !important;
  }

  #destinations .destinations-desktop-redesign,
  #destinations .destinations-desktop-redesign * {
    box-sizing: border-box !important;
  }

  /* =========================================================
     LEFT — TWO SMALL ROUTE PANELS
     ========================================================= */

  #destinations .destinations-desktop-maps {
    display: grid !important;
    grid-template-rows: repeat(2, minmax(0, 1fr)) !important;
    gap: 6px !important;
    min-width: 0 !important;
    height: 430px !important;
  }

  #destinations .desktop-route-panel {
    position: relative !important;
    min-height: 0 !important;
    overflow: hidden !important;

    border: 1px solid rgba(212, 175, 55, 0.58) !important;
    border-radius: 10px !important;

    background:
      radial-gradient(
        circle at 50% 55%,
        rgba(224, 171, 45, 0.14),
        transparent 24%
      ),
      linear-gradient(
        145deg,
        rgba(255, 255, 255, 0.018),
        rgba(0, 0, 0, 0.20)
      ) !important;

    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.025),
      0 5px 14px rgba(0, 0, 0, 0.18) !important;
  }

  /* Small panel titles */
  #destinations .desktop-route-panel-title {
    position: absolute !important;
    top: 7px !important;
    left: 10px !important;
    z-index: 6 !important;

    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
  }

  #destinations .desktop-route-panel-icon {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;

    display: grid !important;
    place-items: center !important;

    color: #e1ad32 !important;
    border: 1px solid rgba(222, 174, 48, 0.72) !important;
    border-radius: 50% !important;
    font-size: 13px !important;

    box-shadow: 0 0 8px rgba(222, 174, 48, 0.09) !important;
  }

  #destinations .desktop-route-panel-title h3 {
    margin: 0 !important;
    color: #e2b04a !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 14px !important;
    line-height: 1 !important;
    text-transform: uppercase !important;
  }

  #destinations .desktop-route-panel-title h3::after {
    content: "" !important;
    display: block !important;
    width: 27px !important;
    height: 1px !important;
    margin-top: 4px !important;

    background: linear-gradient(
      90deg,
      #e2ae35,
      rgba(226, 174, 53, 0.10)
    ) !important;
  }

  /* Smaller route canvas */
  #destinations .desktop-route-canvas {
    --hub-x: 50%;
    --hub-y: 55%;

    position: absolute !important;
    inset: 36px 10px 6px !important;
    overflow: hidden !important;
  }

  #destinations .airport-route-canvas {
    --hub-y: 55%;
  }

  /* All labels */
  #destinations .desktop-route-hub,
  #destinations .desktop-route-node {
    position: absolute !important;
    z-index: 5 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    color: #f2d487 !important;
    background: linear-gradient(
      145deg,
      rgba(36, 28, 13, 0.96),
      rgba(12, 11, 9, 0.95)
    ) !important;

    border: 1px solid rgba(225, 174, 48, 0.84) !important;
    border-radius: 14px !important;
    font-family: Georgia, "Times New Roman", serif !important;
    white-space: nowrap !important;
  }

  #destinations .desktop-route-hub {
    left: var(--hub-x) !important;
    top: var(--hub-y) !important;

    padding: 4px 9px !important;
    transform: translate(-50%, -50%) !important;

    color: #fff2c7 !important;
    font-size: 11px !important;
    font-weight: 700 !important;

    box-shadow:
      0 0 8px rgba(235, 181, 48, 0.62),
      0 0 18px rgba(235, 181, 48, 0.26) !important;
  }

  #destinations .desktop-route-node {
    padding: 3px 6px !important;
    font-size: 9px !important;
    line-height: 1.05 !important;
    box-shadow: 0 0 6px rgba(225, 174, 48, 0.08) !important;
  }

  /* Shorter golden routes */
  #destinations .desktop-route-line {
    position: absolute !important;
    left: var(--hub-x) !important;
    top: var(--hub-y) !important;
    z-index: 2 !important;

    height: 1.5px !important;
    transform-origin: left center !important;

    background: linear-gradient(
      90deg,
      rgba(241, 194, 76, 0.98),
      rgba(241, 194, 76, 0.60)
    ) !important;

    box-shadow:
      0 0 4px rgba(237, 184, 55, 0.70),
      0 0 8px rgba(237, 184, 55, 0.25) !important;
  }

  #destinations .desktop-route-line::after {
    content: "" !important;
    position: absolute !important;
    right: -2px !important;
    top: 50% !important;

    width: 5px !important;
    height: 5px !important;
    transform: translateY(-50%) !important;

    background: #f0c24c !important;
    border-radius: 50% !important;
    box-shadow: 0 0 5px rgba(240, 194, 76, 0.86) !important;
  }

  /* ---------- STATION LABELS CLOSER TO THE LINES ---------- */

  #destinations .station-node-flandres {
    left: 36% !important;
    top: 15% !important;
  }

  #destinations .station-node-europe {
    right: 36% !important;
    top: 15% !important;
  }

  #destinations .station-node-nord {
    left: 29.5% !important;
    bottom: 10% !important;
  }

  #destinations .station-node-midi {
    right: 23.5% !important;
    bottom: 7% !important;
  }

#destinations .station-line-flandres {
  width:10% !important;
  transform: rotate(-150deg) !important;
}

  #destinations .station-line-europe {
    width: 10% !important;
    transform: rotate(-35deg) !important;
  }

  #destinations .station-line-nord {
    width: 14% !important;
    transform: rotate(150deg) !important;
  }

  #destinations .station-line-midi {
    width: 19% !important;
    transform: rotate(21deg) !important;
  }

  /* ---------- AIRPORT LABELS CLOSER TO THE LINES ---------- */

  #destinations .airport-node-lesquin {
    left: 50% !important;
    top: 10.5% !important;
    transform: translateX(-50%) !important;
  }

  #destinations .airport-node-brussels {
    right: 29% !important;
    top: 8% !important;
  }

  #destinations .airport-node-charleroi {
    right: 24% !important;
    top: 50% !important;
  }

  #destinations .airport-node-beauvais {
    left: 53.5% !important;
    bottom: 4% !important;
  }

  #destinations .airport-node-orly {
    left: 35.5% !important;
    bottom: 8% !important;
  }

  #destinations .airport-node-cdg {
    left: 24% !important;
    top: 46% !important;
  }

  #destinations .airport-line-lesquin {
    width: 6% !important;
    transform: rotate(-90deg) !important;
  }

  #destinations .airport-line-brussels {
    width: 14% !important;
    transform: rotate(-35deg) !important;
  }

  #destinations .airport-line-charleroi {
    width: 20% !important;
    transform: rotate(0deg) !important;
  }

  #destinations .airport-line-beauvais {
    width: 8% !important;
    transform: rotate(66deg) !important;
  }

  #destinations .airport-line-orly {
    width: 10% !important;
    transform: rotate(145deg) !important;
  }

  #destinations .airport-line-cdg {
    width: 20% !important;
    transform: rotate(180deg) !important;
  }

  /* =========================================================
     RIGHT — SMALLER PHOTOS AND SMALLER ROWS
     ========================================================= */

  #destinations .destinations-desktop-list {
    display: grid !important;
    grid-template-rows: repeat(9, minmax(0, 1fr)) !important;
    gap: 4px !important;
    min-width: 0 !important;
    height: 430px !important;
  }

  #destinations .desktop-destination-row {
    min-width: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;

    display: grid !important;
    grid-template-columns:
      23%
      27px
      minmax(0, 1fr)
      12px !important;

    align-items: center !important;

    border: 1px solid rgba(212, 175, 55, 0.56) !important;
    border-radius: 8px !important;

    background: linear-gradient(
      100deg,
      rgba(255, 255, 255, 0.018),
      rgba(0, 0, 0, 0.18)
    ) !important;

    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.018) !important;
  }

  /* Smaller image area */
  #destinations .desktop-destination-thumb {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;

    border-right: 1px solid rgba(212, 175, 55, 0.24) !important;
  }

  #destinations .desktop-destination-thumb img {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
  }

  #destinations .desktop-destination-thumb--icon {
    display: grid !important;
    place-items: center !important;
    color: #dca72c !important;

    background: radial-gradient(
      circle,
      rgba(220, 167, 44, 0.14),
      rgba(11, 10, 8, 0.95) 66%
    ) !important;
  }

  #destinations .desktop-destination-thumb--icon i {
    font-size: 15px !important;
  }

  #destinations .desktop-destination-type {
    display: grid !important;
    place-items: center !important;
    color: #dfa92d !important;
    font-size: 13px !important;
  }

  #destinations .desktop-destination-copy {
    min-width: 0 !important;
    padding: 2px 6px !important;
  }

  #destinations .desktop-destination-copy h4 {
    margin: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;

    color: #e6bd62 !important;
    font-family: Georgia, "Times New Roman", serif !important;
    font-size: 11.5px !important;
    font-weight: 600 !important;
    line-height: 1.05 !important;
  }

  #destinations .desktop-destination-copy span {
    display: block !important;
    margin-top: 1px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;

    color: #eee7df !important;
    font-size: 8.5px !important;
    line-height: 1.05 !important;
  }

  #destinations .desktop-destination-arrow {
    color: #dba62c !important;
    font-size: 9px !important;
  }

  /* =========================================================
     BOTTOM AREA — ALSO COMPACT
     ========================================================= */

  #destinations .destinations-more {
    margin-top: 7px !important;
    padding-top: 6px !important;
  }

  #destinations .destinations-more h3 {
    margin: 0 0 5px !important;
    font-size: 12px !important;
    line-height: 1 !important;
  }

  #destinations .destinations-more-list {
    gap: 4px !important;
  }

  #destinations .destinations-more-list span {
    min-height: 25px !important;
    padding: 4px 8px !important;
    font-size: 8.5px !important;
  }

  #destinations .destinations-booking-btn {
    width: min(285px, 100%) !important;
    min-height: 35px !important;
    margin-top: 7px !important;
    padding: 6px 11px !important;
    font-size: 9.5px !important;
  }
}

/* ===== VEHICLE EXPERIENCE DESKTOP WIDTH ===== */
section#vehicule .vehicle-experience-inner {
    width: calc(100% - 50px) !important;
    max-width: 1500px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* ===== VEHICLE EXPERIENCE DESKTOP ALIGNMENT ===== */
section#vehicule.vehicle-experience {
    padding-left: 0 !important;
    padding-right: 0 !important;
}


/* ===== CONTACT SECTION – COMPACT DESKTOP CONTENT ===== */

#contact.luxury-contact .luxury-contact__top,
#contact.luxury-contact .luxury-contact__cards,
#contact.luxury-contact .luxury-contact__advantages {
    width: 90% !important;
    margin-left: auto !important;
    margin-right: auto !important;
}


/* STEP 1 – SMALLER CONTACT HEADING */

#contact .luxury-contact__crest {
    transform: scale(0.50) !important;
    transform-origin: center center !important;
}

#contact .luxury-contact__eyebrow {
    font-size: 12px !important;
}

#contact .luxury-contact__intro h2 {
    font-size: 38px !important;
    line-height: 1.05 !important;
}

#contact .luxury-contact__subtitle {
    font-size: 14px !important;
    line-height: 1.35 !important;
}


/* ===== STEP 2 – SMALLER CONTACT CARDS ===== */

#contact .luxury-contact__cards {
    gap: 12px !important;
}

#contact .luxury-contact__card {
    min-height: 210px !important;
    padding: 22px 14px !important;
}

#contact .luxury-contact__icon {
    width: 58px !important;
    height: 58px !important;
    margin-bottom: 14px !important;
}

#contact .luxury-contact__icon i {
    font-size: 24px !important;
}

#contact .luxury-contact__card h3 {
    font-size: 18px !important;
    line-height: 1.1 !important;
    margin-bottom: 9px !important;
}

#contact .luxury-contact__card p {
    font-size: 13px !important;
    line-height: 1.25 !important;
    margin-bottom: 8px !important;
}

#contact .luxury-contact__link {
    font-size: 13px !important;
}


/* ===== STEP 3 – SMALLER BOTTOM CONTACT BAR ===== */

#contact .luxury-contact__advantages {
    padding: 10px 16px !important;
    min-height: 44px !important;
}

#contact .luxury-contact__advantages span {
    font-size: 11px !important;
    line-height: 1 !important;
}

#contact .luxury-contact__advantages i {
    font-size: 12px !important;
    margin-right: 6px !important;
}


/* ===== STEP 4 – COMPACT SECTION SPACING ===== */

#contact.luxury-contact {
    padding-top: 24px !important;
    padding-bottom: 18px !important;
}


/* ===== REVIEWS – COMPACT UPPER DESKTOP ===== */

/* AVIS GOOGLE */
.premium-reviews .section-label {
    font-size: 9px !important;
    margin-bottom: 5px !important;
}

/* Ce que disent nos clients */
.premium-reviews > .container > h2 {
    font-size: 30px !important;
    line-height: 1.05 !important;
    margin-bottom: 7px !important;
}

/* Subtitle */
.premium-reviews .reviews-subtitle {
    font-size: 11px !important;
    line-height: 1.25 !important;
    margin-bottom: 14px !important;
}


/* WHOLE GOOGLE SUMMARY CARD */
.premium-reviews .luxury-reviews-summary {
    width: 70% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 12px 14px !important;
}


/* Google Reviews */
.premium-reviews .luxury-reviews-google {
    font-size: 15px !important;
    margin-bottom: 6px !important;
}


/* 5.0 */
.premium-reviews .luxury-reviews-score strong {
    font-size: 22px !important;
}


/* Stars */
.premium-reviews .luxury-reviews-stars i {
    font-size: 14px !important;
}


/* (46) and small text */
.premium-reviews .luxury-reviews-summary span {
    font-size: 10px !important;
}


/* Voir les avis Google */
.premium-reviews .luxury-reviews-summary a,
.premium-reviews .luxury-reviews-summary button {
    min-height: 30px !important;
    padding: 6px 10px !important;
    font-size: 10px !important;
}


/* Bottom statistics text */
.premium-reviews .luxury-reviews-summary p {
    font-size: 10px !important;
    line-height: 1.15 !important;
}

/* =========================================
   REVIEWS – 3 COMPACT CARDS DESKTOP ONLY
   ========================================= */

@media screen and (min-width: 1024px) {

    #reviewsCarousel {
        width: 88% !important;
        max-width: 1180px !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    #reviewsCarousel .reviews-viewport {
    width: 100% !important;
    overflow: hidden !important;

    -webkit-mask-image: none !important;
    mask-image: none !important;
}

    #reviewsCarousel .reviews-track {
    display: flex !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    gap: 14px !important;

    padding: 2px 6px !important;
    box-sizing: border-box !important;
}

    #reviewsCarousel .reviews-card {
        flex: 0 0 calc((100% - 28px) / 3) !important;
        width: calc((100% - 28px) / 3) !important;
        min-width: 0 !important;
        max-width: none !important;

        padding: 18px 16px !important;
        min-height: 285px !important;
       border: none !important;
outline: none !important;

        border-radius: 15px !important;
        box-sizing: border-box !important;
    }


   /* Keep the gold rectangle visible even at carousel edges */
#reviewsCarousel .reviews-card {
    position: relative !important;
}

#reviewsCarousel .reviews-card::after {
    content: "" !important;
    position: absolute !important;
    inset: 2px !important;

    border: 1px solid rgba(224, 174, 43, 0.72) !important;
    border-radius: 13px !important;

    pointer-events: none !important;
    z-index: 2 !important;
}
    #reviewsCarousel .reviews-avatar {
        width: 46px !important;
        height: 46px !important;
        font-size: 18px !important;
    }

    #reviewsCarousel .reviews-card h3 {
        font-size: 15px !important;
        line-height: 1.15 !important;
    }

    #reviewsCarousel .reviews-card p {
        font-size: 11px !important;
    }

    #reviewsCarousel .reviews-stars {
        margin: 10px 0 !important;
    }

    #reviewsCarousel .reviews-stars i {
        font-size: 14px !important;
    }

    #reviewsCarousel .reviews-card blockquote {
        font-size: 12px !important;
        line-height: 1.45 !important;
    }

    #reviewsCarousel .reviews-toggle {
        font-size: 11px !important;
        margin-top: 10px !important;
    }
}

/* ==================================================
   FOOTER – COMPACT DESKTOP LAYOUT
   CONTACT LEFT UNCHANGED / CONTENT RIGHT
   ================================================== */

@media screen and (min-width: 1024px) {

  /* Main footer layout */
  .luxury-footer {
    display: grid !important;
    grid-template-columns: 34% minmax(0, 1fr) !important;
    grid-template-rows: 1fr auto auto !important;

    column-gap: 34px !important;
    row-gap: 12px !important;

    align-items: stretch !important;
  }


  /* ==========================================
     LEFT SIDE – CONTACT
     DO NOT MODIFY ITS INTERNAL DESIGN
     ========================================== */

  .luxury-footer__contact {
    grid-column: 1 !important;
    grid-row: 1 / 3 !important;

    align-self: stretch !important;
    width: 100% !important;
  }


  /* ==========================================
     RIGHT SIDE – 4 SMALL CARDS
     ========================================== */

  .luxury-footer__qualities {
    grid-column: 2 !important;
    grid-row: 1 !important;

    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-template-rows: repeat(2, minmax(0, 1fr)) !important;

    gap: 12px !important;

    width: 100% !important;
    height: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    border: none !important;
    background: none !important;
    box-shadow: none !important;
  }


  /* EACH SMALL CARD */
  .luxury-footer__qualities > div {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 0 !important;

    padding: 12px 10px !important;
    margin: 0 !important;


    border-radius: 13px !important;

    background: rgba(255, 255, 255, 0.015) !important;
    box-sizing: border-box !important;
  }


  /* Smaller icons */
  .luxury-footer__qualities > div i {
    font-size: 27px !important;
    margin-bottom: 9px !important;
  }


  /* Smaller card titles */
  .luxury-footer__qualities > div span {
    font-size: 12px !important;
    line-height: 1.15 !important;
    font-weight: 700 !important;
    text-align: center !important;
  }


  /* ==========================================
     PAYMENT ROW – SAME BOTTOM LINE AS 7j/7
     ========================================== */

  .luxury-footer__payments {
    grid-column: 2 !important;
    grid-row: 2 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 9px !important;

    width: 100% !important;
    margin: 0 !important;
    padding: 7px 9px !important;

    border: 1px solid rgba(224, 174, 43, 0.45) !important;
    border-radius: 11px !important;

    background: rgba(255, 255, 255, 0.012) !important;
    box-sizing: border-box !important;
  }


  /* REMOVE "PAIEMENT SÉCURISÉ" TITLE */
  .luxury-footer__payments > h3 {
    display: none !important;
  }


  /* Visa / Mastercard / Amex / PayPal */
  .luxury-footer__payment-grid {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 7px !important;

    margin: 0 !important;
    padding: 0 !important;
  }


  .luxury-footer__payment-grid .payment-badge {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 68px !important;
    height: 38px !important;

    margin: 0 !important;
    padding: 4px 6px !important;

    box-sizing: border-box !important;
  }


  .luxury-footer__payment-grid .payment-badge img {
    display: block !important;

    max-width: 56px !important;
    max-height: 26px !important;

    width: auto !important;
    height: auto !important;

    object-fit: contain !important;
  }


  /* VIREMENT BANCAIRE */
  .luxury-footer__bank {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    gap: 7px !important;

    min-width: 170px !important;
    height: 38px !important;

    margin: 0 !important;
    padding: 0 12px !important;

    font-size: 11px !important;

    box-sizing: border-box !important;
  }


  .luxury-footer__bank i {
    font-size: 14px !important;
  }


  /* ==========================================
     COPYRIGHT / LEGAL AREA REMAINS UNDER BOTH
     ========================================== */

  .luxury-footer__bottom {
    grid-column: 1 / -1 !important;
    grid-row: 3 !important;
  }
}

/* ==========================================
   FOOTER – FINAL BORDER CLEANUP DESKTOP ONLY
   ========================================== */

@media screen and (min-width: 1024px) {

  /* 1. REMOVE THE SMALL EXTRA LINE UNDER 7j/7 */
  .luxury-footer__contact,
  .luxury-footer__contact-list {
    border-bottom: none !important;
    box-shadow: none !important;
  }

  .luxury-footer__contact::after,
  .luxury-footer__contact-list::after {
    content: none !important;
    display: none !important;
  }


  /* 2. REMOVE OLD CARD BORDERS COMPLETELY */
  .luxury-footer__qualities > div {
    position: relative !important;
    border: none !important;
    outline: none !important;
    overflow: visible !important;
  }


  /* DRAW ONE CLEAN COMPLETE GOLD BORDER INSIDE EACH CARD */
  .luxury-footer__qualities > div::after {
    content: "" !important;

    position: absolute !important;
    inset: 1px !important;

    border: 1px solid rgba(224, 174, 43, 0.62) !important;
    border-radius: 12px !important;

    pointer-events: none !important;
    z-index: 3 !important;
  }
}


/* ==================================================
   L'EXPÉRIENCE VTC – COMPACT DESKTOP VERSION
   MOBILE UNCHANGED
   ================================================== */

@media screen and (min-width: 1024px) {

  /* KEEP THE OUTER WIDTH WE ALREADY FIXED */
  section#vehicule.vehicle-experience {
    padding-top: 12px !important;
    padding-bottom: 16px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .vehicle-experience-inner {
    width: calc(100% - 50px) !important;
    max-width: 1500px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }


  /* ===== SMALLER TITLE ===== */

  .vehicle-experience-heading {
    padding: 18px 20px 10px !important;
  }

  .vehicle-experience-heading p {
    font-size: 23px !important;
    line-height: 1.05 !important;
    margin-bottom: 2px !important;
  }

  .vehicle-experience-heading h2 {
    font-size: 30px !important;
    line-height: 1.05 !important;
    margin-bottom: 8px !important;
  }


  /* ===== MAIN CONTENT – PUSH EVERYTHING UP ===== */

  .vehicle-experience-content {
    grid-template-columns: 1fr 0.78fr !important;
    gap: 24px !important;

    padding: 18px 30px 76px !important;
  }


  /* ===== FOUR LEFT CARDS ===== */

  .vehicle-info-grid {
    gap: 8px !important;
  }

  .vehicle-info-item {
    min-height: 80px !important;
    padding: 11px 13px !important;

    grid-template-columns: 44px 1fr !important;
    gap: 10px !important;

    border-radius: 11px !important;
  }

  .vehicle-info-item h3 {
    font-size: 14px !important;
    line-height: 1.1 !important;
    margin-bottom: 3px !important;
  }

  .vehicle-info-item p {
    font-size: 10.5px !important;
    line-height: 1.25 !important;
  }

  .vehicle-info-item > i,
  .vehicle-info-item .vehicle-info-icon {
    width: 44px !important;
    height: 44px !important;
    font-size: 17px !important;
  }


  /* ===== SMALLER FLIPPING BUSINESS CARD ===== */

  .vehicle-business-card-wrap {
    max-width: 430px !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;

    transform: translateY(3px) !important;
  }

  .business-card-label {
    font-size: 10px !important;
    letter-spacing: 2px !important;
    margin-bottom: 7px !important;
  }

  .tf-business-card-scene {
    width: 100% !important;
    max-width: 430px !important;
    aspect-ratio: 1.55 / 1 !important;
  }


  /* ===== SMALLER SKYLINE ===== */

  .vehicle-city-skyline {
    height: 68px !important;
  }


  /* ===== SMALLER GOLD BOTTOM BAR ===== */

  .vehicle-experience-footer {
    min-height: 46px !important;
    padding: 8px 16px !important;

    font-size: 13px !important;
    line-height: 1 !important;
  }

  .vehicle-experience-footer i {
    font-size: 13px !important;
  }
}


/* =========================================
   RESERVATION PAGE — COMPACT HERO DESKTOP
   ========================================= */

@media screen and (min-width: 1024px) {

  .reservation-page .reservation-hero {
    min-height: 430px !important;
    padding: 92px 0 24px !important;
  }

  .reservation-page .reservation-hero-content {
    min-height: auto !important;
    padding: 12px 20px 16px !important;
  }

  .reservation-page .reservation-eyebrow {
    margin: 0 0 7px !important;
    font-size: 13px !important;
    letter-spacing: 0.4px !important;
  }

  .reservation-page .reservation-hero h1 {
    margin: 0 !important;
    font-size: 40px !important;
    line-height: 1.02 !important;
    letter-spacing: -0.8px !important;
  }

  .reservation-page .reservation-hero-description {
    margin: 12px 0 10px !important;
    font-size: 15px !important;
    line-height: 1.35 !important;
  }

  .reservation-page .reservation-minimum-badge {
    min-height: 42px !important;
    padding: 7px 15px !important;
    gap: 8px !important;
    border-radius: 10px !important;
    font-size: 15px !important;
  }

  .reservation-page .reservation-minimum-badge i {
    font-size: 17px !important;
  }

   .reservation-page .reservation-form-section {
  margin-top: -150px !important;
   }

   .reservation-page .reservation-form {
  display: grid !important;
 grid-template-columns: repeat(20, minmax(0, 1fr)) !important;
  column-gap: 18px !important;
}

.reservation-page .reservation-form > * {
  grid-column: 1 / -1;
}
.reservation-page .reservation-form input,
.reservation-page .reservation-form select {
  font-size: 14px !important;
  font-weight: 400 !important;
}
/* NOM — 50% */
.reservation-page .reservation-field-name {
  grid-column: 1 / span 10 !important;
  width: 100% !important;
  min-width: 0 !important;
}

/* TÉLÉPHONE — 50% */
.reservation-page .reservation-field-phone {
  grid-column: 11 / span 10 !important;
  width: 100% !important;
  min-width: 0 !important;
}

.reservation-page .reservation-field-phone .iti {
  width: 100% !important;
}

   /* VOL / TRAIN — 50% */
.reservation-page .reservation-field-transport {
  grid-column: 1 / span 10 !important;
  width: 100% !important;
  min-width: 0 !important;
}

.reservation-page .reservation-field-triptype {
grid-column: 11 / span 10 !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 64px !important;
  min-height: 64px !important;
  padding: 0 !important;
}


.reservation-page .reservation-field-triptype select {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 44px 0 18px !important;
  font-size: 15px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
}

.reservation-page .reservation-field-baggage select {
  font-size: 14px !important;
}
   
   .reservation-page .reservation-field-passengers {
    grid-column: 1 / span 6 !important;
      grid-row: 7 !important;
  width: 100% !important;
  min-width: 0 !important;
}


   .reservation-page .reservation-field-passengers select {
  font-size: 14px !important;
   }
.reservation-page .reservation-field-baggage {
  grid-column: 14 / span 7 !important;
  grid-row: 7 !important;
  width: 100% !important;
  min-width: 0 !important;
}

.reservation-page .reservation-field-payment {
  grid-column: 7 / span 7 !important;
  grid-row: 7 !important;
  width: 100% !important;
  min-width: 0 !important;
}
.reservation-page .reservation-field-payment select {
  padding-right: 32px !important;
font-size: 14px !important;  
}
   .reservation-page .reservation-help-text p br {
  display: none !important;
}

.reservation-page .reservation-help-text p {
  white-space: nowrap !important;
}

   .reservation-page .reservation-direct-contact {
  width: fit-content !important;
  margin: 12px auto 0 !important;

  display: grid !important;
  grid-template-columns: repeat(4, 100px) !important;
  grid-template-rows: 58px !important;
  gap: 10px !important;

  justify-content: center !important;
  align-items: center !important;
}

.reservation-page .reservation-direct-contact .reservation-contact-option {
  width: 100px !important;
  height: 58px !important;
  min-height: 58px !important;
}

   .reservation-page .reservation-scroll-down {
  position: relative !important;
  z-index: 50 !important;

  display: flex !important;
  width: 48px !important;
  height: 48px !important;

  margin: 24px auto 20px !important;
top: -130px !important;
   }

   .reservation-page .reservation-form-card {
  width: min(96%, 1120px) !important;
  max-width: 1120px !important;
   }

/* INFORMATION PAGE — DOWN / UP ARROWS */

.information-page .information-scroll-down,
.information-page .information-scroll-top {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 64px;
  height: 64px;

  border-radius: 50%;
  background: #d9a441;

  color: #1f2937;
  font-size: 28px;

  text-decoration: none;
  cursor: pointer;

  transition:
    opacity 0.3s ease,
    visibility 0.3s ease,
    transform 0.3s ease;
}


/* DOWN ARROW */

.information-page .information-scroll-down {
  margin: 32px auto 0;
  opacity: 1;
  visibility: visible;
}


/* UP ARROW */

.information-page .information-scroll-top {
  position: fixed;
  right: 28px;
  bottom: 28px;
  z-index: 1000;

  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(10px);
}


/* AFTER SCROLLING */

.information-page .information-scroll-down.is-hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.information-page .information-scroll-top.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}


   /* =========================================
   INFORMATION PAGE — COMPACT DESKTOP FOOTER
   ========================================= */

.information-page .information-footer {
  margin-top: 16px !important;
  padding: 28px 40px 18px !important;
  text-align: left !important;
}





/* COLUMN 3 — CONTACT */

.information-page .information-footer__contact {
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.information-page .information-footer__item {
  display: flex;
  align-items: center;
  gap: 10px;
}

.information-page .information-footer__item i {
  width: 20px;
  text-align: center;
}

.information-page .information-footer__item a,
.information-page .information-footer__item span {
  color: #ffffff;
  text-decoration: none;
}


/* COLUMN 4 — VALUES */

.information-page .information-footer__benefits {


  border: 0 !important;
}

.information-page .information-footer__benefits p {
  margin: 0 0 8px !important;
  line-height: 1.5 !important;
  white-space: nowrap;
}

.information-page .information-footer__benefits p:last-child {
  margin-bottom: 0 !important;
}


/* COPYRIGHT */

.information-page .information-footer__bottom {
  width: min(100%, 1120px);

  padding-top: 14px !important;

  border-top: 1px solid rgba(255, 255, 255, 0.15);


}

.information-page .information-footer__bottom p {
  margin: 0;
}

   .information-page .footer-premium-brand {
  margin: 0 !important;
  padding: 0 !important;
}

.information-page .footer-premium-brand .premium-brand-mark {
  margin: 0 !important;
}





/* =========================================
   INFORMATION FOOTER — FINAL ALIGNMENT
   ========================================= */

.information-page .information-footer__content {
  width: min(100%, 960px) !important;
  max-width: 960px !important;
  margin: 0 auto !important;

  display: grid !important;
  grid-template-columns: 300px 300px 300px !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 30px !important;
}


/* BRAND — SAME STRUCTURE AS HEADER */

.information-page .information-footer__brand {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.information-page .information-footer__brand .premium-brand {


  justify-content: center !important;

  width: auto !important;


}



.information-page .information-footer__brand .premium-brand-text strong {

  white-space: nowrap !important;
}


/* CONTACT */

.information-page .information-footer__contact {
  width: fit-content !important;
  margin: 0 auto !important;
}


/* VALUES */

.information-page .information-footer__benefits {
  width: fit-content !important;
  margin: 0 auto !important;
  padding: 0 !important;
}


/* COPYRIGHT */

.information-page .information-footer__bottom {
  max-width: 960px !important;
  margin: 20px auto 0 !important;
  text-align: center !important;
}


   /* =========================================
   INFORMATION FOOTER — EXACT HEADER BRAND
   ========================================= */

.information-page .information-footer__brand .premium-brand {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;

  margin: 0 !important;
  padding: 0 !important;

  background: transparent !important;
  border: none !important;
  box-shadow: none !important;

  text-decoration: none !important;
  overflow: visible !important;
}


/* EXACT TF LOGO */

.information-page .information-footer__brand .premium-brand-mark {
  position: relative !important;

  width: 48px !important;
  height: 56px !important;
  min-width: 48px !important;
  flex: 0 0 48px !important;

  margin: 0 !important;

  color: transparent !important;
  background: transparent !important;

  border: none !important;
  border-radius: 0 !important;

  clip-path: none !important;
  -webkit-clip-path: none !important;

  overflow: visible !important;
}


/* CREAM TF BOX */

.information-page .information-footer__brand .premium-brand-mark::before {
  content: "TF" !important;

  position: absolute !important;
  top: 9px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;

  width: 43px !important;
  height: 46px !important;

  display: flex !important;
  align-items: center !important;
  justify-content: center !important;

  color: #b8891f !important;
  background: #fffaf0 !important;

  border: 2px solid #c49a2c !important;
  border-radius: 12px 12px 17px 17px !important;

  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 1 !important;

  z-index: 1 !important;
}


/* EXACT GOLD CROWN */

.information-page .information-footer__brand .premium-brand-mark::after {
  content: "♛" !important;

  position: absolute !important;
  top: -3px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;

  color: #c49a2c !important;
  font-size: 17px !important;
  line-height: 1 !important;

  z-index: 2 !important;
}


/* SHOW TWINS FAB CAB SERVICE VTC */

.information-page .information-footer__brand .premium-brand-text {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;

  width: 190px !important;
  opacity: 1 !important;
  visibility: visible !important;

  text-align: left !important;
}

.information-page .information-footer__brand .premium-brand-text strong {
  display: block !important;

  color: #ffffff !important;

  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 0.96 !important;

  text-align: left !important;
  text-transform: uppercase !important;

  opacity: 1 !important;
  visibility: visible !important;
}

/* =========================================================
   FINAL DESKTOP POLISH — HOMEPAGE HEADER + HERO
   Added 2026-08-22
   Desktop only; mobile remains untouched.
   ========================================================= */
@media screen and (min-width: 1024px) {

  /* Keep the brand, navigation and language selector in the
     same desktop slots on Home, Reservation and Information. */






  #mainHeader nav ul {
    width: 100% !important;
    justify-content: flex-start !important;
    gap: 18px !important;
  }

  #mainHeader .desktop-language-switcher,
  .information-page #mainHeader .desktop-language-switcher {



    gap: 14px !important;
  }

  /* Homepage title: match the Reservation title size. */
  #accueil .hero-left h1 {
    font-size: 40px !important;
    line-height: 1.02 !important;
    letter-spacing: -0.8px !important;
  }

  /* Lille remains highlighted, but slightly smaller. */
  #accueil .hero-left h1 span {
    font-size: 34px !important;
    line-height: 1.05 !important;
  }

  /* Smaller, cleaner homepage supporting copy. */
  section#accueil.hero-premium .hero-left .hero-description {
    font-size: 16px !important;
    line-height: 1.45 !important;
  }
}

/* Slightly tighter desktop header spacing on narrower laptops
   while preserving the same three fixed header slots. */
@media screen and (min-width: 1024px) and (max-width: 1179px) {
  #mainHeader.premium-header .header-inner {
    grid-template-columns: 245px minmax(0, 1fr) 170px !important;

  }

  #mainHeader nav ul {
    gap: 11px !important;
  }

  #mainHeader nav a {
    font-size: 11px !important;
  }

  #mainHeader .desktop-language-switcher,
  .information-page #mainHeader .desktop-language-switcher {
    gap: 9px !important;
  }
}

/* =========================================================
   HOMEPAGE — FINAL DESKTOP SECTION SPACING
   Added 2026-08-22
   Desktop only. Mobile remains untouched.
   ========================================================= */
@media screen and (min-width: 1024px) {

  /* Remove the large empty area below the hero buttons.
     Keep the background/car composition, but let the next
     section begin much sooner. */
  section#accueil.hero-premium {
    min-height: 0 !important;
    padding-bottom: 16px !important;
  }

  section#accueil.hero-premium .hero-premium-inner {
    min-height: 500px !important;
  }

  /* Keep the down arrow as an overlay near the lower edge,
     rather than reserving a large empty area for it. */
  section#accueil.hero-premium .hero-scroll-down {
    bottom: 12px !important;
  }

  /* Use one compact, consistent card-to-card gap throughout
     the main homepage sections. */
  section#vehicule.vehicle-experience {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }

  section#services.why-premium {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }

  section#tarifs.tarifs-premium {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }

  section#destinations.destinations-premium {
    padding-top: 6px !important;
    padding-bottom: 6px !important;
  }
}

/* =========================================================
   FINAL DESKTOP HEADER ALIGNMENT + INFORMATION COMPACTNESS
   Added 2026-08-22
   ========================================================= */
@media screen and (min-width: 1024px) {

  /* Brand | centered navigation | language selector.
     The navigation sits in the exact middle of the available
     space between the brand and the language group. */






  #mainHeader nav ul,
  .information-page #mainHeader nav ul {

    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;





  }







  #mainHeader .mobile-language-switcher {
    display: none !important;
  }

  /* Information page: keep every major card group close together. */
  .information-page section.information-links {
    gap: 6px !important;
    padding-top: 4px !important;
    padding-bottom: 4px !important;
  }

  .information-page .information-custom-destination {
    padding-top: 4px !important;
    padding-bottom: 4px !important;
  }

  .information-page .information-custom-card {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  .information-page .information-footer {
    margin-top: 6px !important;
  }
}

@media screen and (min-width: 1024px) and (max-width: 1179px) {



}

/* =========================================================
   FINAL DESKTOP MENU SPACING FIX
   Equal spacing between every navigation item.
   Desktop only — mobile remains untouched.
   ========================================================= */
@media screen and (min-width: 1024px) {

  /* Keep brand, nav and language group in fixed desktop slots. */
  #mainHeader.premium-header .header-inner {
    display: grid !important;
    grid-template-columns: max-content minmax(0, 1fr) max-content !important;
    column-gap: 24px !important;
    align-items: center !important;
  }

  #mainHeader .premium-brand {
    grid-column: 1 !important;
    justify-self: start !important;
  }

  #mainHeader nav,
  .information-page #mainHeader nav {
    grid-column: 2 !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    justify-self: stretch !important;
  }

  /* IMPORTANT: use flex, not six equal grid cells.
     Equal grid cells were causing TRAJETS POPULAIRES and
     NOTRE VÉHICULE to overlap. */
  #mainHeader nav ul,
  .information-page #mainHeader nav ul {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: 18px !important;
  }

  #mainHeader nav li,
  .information-page #mainHeader nav li {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 0 !important;
    text-align: center !important;
  }

  #mainHeader nav a,
  .information-page #mainHeader nav a {
    display: inline-block !important;
    width: auto !important;
    max-width: none !important;
    font-size: 11px !important;
    letter-spacing: 0 !important;
    text-align: center !important;
    white-space: nowrap !important;
  }

  #mainHeader .desktop-language-switcher,
  .information-page #mainHeader .desktop-language-switcher {
    grid-column: 3 !important;
    justify-self: end !important;
    margin: 0 !important;
  }
}

/* Slightly tighter type/gaps on smaller desktop/laptop widths,
   while preserving the same equal menu spacing behavior. */
@media screen and (min-width: 1024px) and (max-width: 1179px) {
  #mainHeader.premium-header .header-inner {
    width: min(98%, 1420px) !important;
    column-gap: 14px !important;
  }

  #mainHeader nav ul,
  .information-page #mainHeader nav ul {
    gap: 10px !important;
  }

  #mainHeader nav a,
  .information-page #mainHeader nav a {
    font-size: 9px !important;
    letter-spacing: -0.1px !important;
  }
}

/* ==========================================================
   TABLET LANDSCAPE — APPROVED GOLD CROWN ARTWORK
   Touch tablets only. Keep desktop and all portrait modes unchanged.
========================================================== */
@media screen and (orientation: landscape) and (min-width: 1024px) and (hover: none) and (pointer: coarse) {

  /* 1. Header TF logo crown */
  #mainHeader.premium-header .premium-brand-mark::after {
    content: "\f521" !important;
    color: #c99a2e !important;
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
    line-height: 1 !important;
  }

  /* 2. VTC Experience heading crown */
  #vehicule .vehicle-experience-heading::before {
    content: "\f521" !important;
    color: #d6a62c !important;
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
    line-height: 1 !important;
  }

  /* 3. Animated business-card TF logo crown */
  #vehicule .business-card-logo .premium-brand-mark::before {
    content: "\f521" !important;
    color: #d4a12f !important;
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
    line-height: 1 !important;
  }

  /* 4. Why Choose Us crown */
  section#services .why-premium-crown::before {
    content: "\f521" !important;
    color: #d4a12f !important;
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
    line-height: 1 !important;
  }

  /* 5. Our Rates crown */
  #tarifs .tarifs-crown {
    font-size: 0 !important;
  }

  #tarifs .tarifs-crown::before {
    content: "\f521" !important;
    display: inline-block !important;
    color: #d6a62c !important;
    font-family: "Font Awesome 6 Free" !important;
    font-size: 19px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
  }

  /* 6. Train Stations & Airports Served crown */
  #destinations .destinations-crown {
    font-size: 0 !important;
  }

  #destinations .destinations-crown::before {
    content: "\f521" !important;
    display: inline-block !important;
    color: #d6a62c !important;
    font-family: "Font Awesome 6 Free" !important;
    font-size: 19px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
  }

  /* 7. Quick Contact TF logo crown */
  #contact .luxury-contact__crest::before {
    content: "\f521" !important;
    color: #e4b532 !important;
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
    line-height: 1 !important;
  }

  /* 8. Information footer TF logo crown */
  .information-page .information-footer__brand .premium-brand-mark::after {
    content: "\f521" !important;
    color: #c99a2e !important;
    font-family: "Font Awesome 6 Free" !important;
    font-size: 18px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
  }

  /* Reservation page: tablet landscape uses the arrow that already sits
     between the title and the reservation requirement text. The normal
     post-hero arrow stays hidden in this viewing mode. */
  .reservation-page .reservation-scroll-down--default {
    display: none !important;
  }

  .reservation-page .reservation-scroll-down--landscape {
    position: relative !important;
    top: auto !important;
    display: flex !important;
    width: 48px !important;
    height: 48px !important;
    flex: 0 0 48px !important;
    margin: 10px auto 10px !important;
  }

  /* The normal arrow below the hero is hidden in tablet landscape, so its
     former layout space must not be subtracted a second time. Keeping only
     the intended overlap prevents the form card from covering the hero
     description and minimum-fare badge. */
  .reservation-page .reservation-form-section {
    margin-top: -58px !important;
  }
}