/* ── Bandeau livraison gratuite ───────────────── */
    .free-banner {
      background: linear-gradient(90deg, var(--color-sage) 0%, #5a8560 100%);
      color: #fff;
      text-align: center;
      padding: .8rem 1rem;
      font-size: .9rem;
      font-weight: 600;
      position: sticky;
      top: 72px;
      z-index: 100;
      box-shadow: 0 3px 12px rgba(0,0,0,.12);
    }
    .free-banner .pill {
      display: inline-block;
      background: rgba(255,255,255,.2);
      border-radius: 20px;
      padding: .12rem .7rem;
      font-size: .78rem;
      margin-left: .4rem;
    }

    /* ── Cartes mode livraison ────────────────────── */
    .mode-card {
      background: #fff;
      border-radius: var(--radius-card);
      box-shadow: var(--shadow-card);
      overflow: hidden;
      height: 100%;
      transition: transform var(--transition), box-shadow var(--transition);
      position: relative;
    }
    .mode-card:hover {
      transform: translateY(-6px);
      box-shadow: 0 14px 40px rgba(0,0,0,.13);
    }
    .mode-card.recommended::after {
      content: '⭐ Recommandé';
      position: absolute;
      top: 1.1rem; right: -2.2rem;
      background: var(--color-terra);
      color: #fff;
      font-size: .68rem;
      font-weight: 700;
      padding: .28rem 2.8rem;
      transform: rotate(40deg);
      z-index: 2;
      letter-spacing: .3px;
    }
    .mode-header {
      padding: 2rem 1.5rem 1.25rem;
      text-align: center;
    }
    .carrier-logo {
      width: 68px; height: 68px;
      border-radius: 18px;
      display: flex; align-items: center; justify-content: center;
      font-size: 2rem;
      margin: 0 auto .9rem;
      box-shadow: 0 4px 14px rgba(0,0,0,.1);
    }
    .logo-coli  { background: #003082; color: #fff; }
    .logo-chro  { background: #f7a800; color: #fff; }
    .logo-relay { background: #e2001a; color: #fff; }

    .mode-name {
      font-family: 'Playfair Display', serif;
      font-size: 1.2rem; font-weight: 700;
      margin-bottom: .2rem;
    }
    .mode-carrier { font-size: .75rem; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; color: var(--color-muted); }
    .mode-delay {
      display: inline-flex; align-items: center; gap: .3rem;
      margin-top: .65rem;
      background: var(--color-beige);
      border-radius: 20px; padding: .25rem .85rem;
      font-size: .8rem; font-weight: 600;
      color: var(--color-dark);
    }
    .mode-price-block {
      margin: 0 1.5rem 1.25rem;
      border-radius: 12px;
      padding: .9rem 1rem;
      text-align: center;
      color: #fff;
    }
    .mode-price-block .big-price {
      font-family: 'Playfair Display', serif;
      font-size: 1.9rem; font-weight: 700; line-height: 1;
    }
    .mode-price-block .price-sub { font-size: .73rem; opacity: .85; margin-top: .2rem; }

    .mode-features { list-style: none; padding: 0 1.5rem 1.5rem; margin: 0; }
    .mode-features li {
      display: flex; align-items: flex-start; gap: .6rem;
      padding: .45rem 0;
      font-size: .86rem;
      border-bottom: 1px solid #f5f5f5;
    }
    .mode-features li:last-child { border-bottom: none; }
    .ck { color: var(--color-sage); font-weight: 700; flex-shrink: 0; }
    .xk { color: #ccc; flex-shrink: 0; }

    /* ── Tableau tarifaire ────────────────────────── */
    .tarif-wrap {
      background: #fff;
      border-radius: var(--radius-card);
      box-shadow: var(--shadow-card);
      overflow: hidden;
    }
    .tarif-table { width: 100%; border-collapse: collapse; }
    .tarif-table thead tr { background: var(--color-dark); color: #fff; }
    .tarif-table thead th {
      padding: 1rem 1.25rem;
      font-size: .75rem; font-weight: 700;
      text-transform: uppercase; letter-spacing: .5px;
      border: none; white-space: nowrap;
    }
    .tarif-table tbody tr { border-bottom: 1px solid #f0f0f0; transition: background .15s; }
    .tarif-table tbody tr:last-child { border-bottom: none; }
    .tarif-table tbody tr:hover { background: var(--color-beige); }
    .tarif-table tbody tr.hl { background: #f6fbf7; }
    .tarif-table tbody tr.hl td:first-child { border-left: 3px solid var(--color-sage); }
    .tarif-table td { padding: .95rem 1.25rem; font-size: .88rem; vertical-align: middle; }

    .carrier-pill {
      display: inline-flex; align-items: center; gap: .4rem;
      background: var(--color-beige); border-radius: 20px;
      padding: .2rem .7rem; font-size: .75rem; font-weight: 700;
    }
    .c-coli  { color: #003082; }
    .c-chro  { color: #c48000; }
    .c-relay { color: #e2001a; }

    .price-cell      { font-weight: 700; font-size: .95rem; }
    .price-cell.free { color: var(--color-sage); }
    .delay-pill {
      background: var(--color-beige); border-radius: 10px;
      padding: .18rem .6rem; font-size: .75rem; font-weight: 600;
    }
    .tarif-foot {
      background: var(--color-beige);
      border-top: 1px solid #e8e8e8;
      padding: .75rem 1.25rem;
      font-size: .75rem; color: var(--color-muted);
    }

    /* ── Simulateur ───────────────────────────────── */
    .sim-card {
      background: #fff;
      border-radius: var(--radius-card);
      box-shadow: var(--shadow-card);
      padding: 1.5rem 1.75rem;
    }
    .sim-card .form-control {
      border-radius: 12px 0 0 12px;
      border-color: #e5e5e5;
      font-size: .9rem; padding: .65rem 1rem;
    }
    .sim-card .form-control:focus {
      border-color: var(--color-sage);
      box-shadow: 0 0 0 3px rgba(122,158,126,.15);
    }

    /* ── Timeline suivi ───────────────────────────── */
    .track-wrap { display: flex; gap: 0; }
    .track-step {
      flex: 1; text-align: center;
      display: flex; flex-direction: column; align-items: center;
      position: relative;
    }
    .track-step::after {
      content: '';
      position: absolute;
      top: 28px; left: 50%;
      width: 100%; height: 2px;
      background: linear-gradient(90deg, var(--color-sage), #ddd);
      z-index: 0;
    }
    .track-step:last-child::after { display: none; }
    .track-dot {
      width: 56px; height: 56px; border-radius: 50%;
      background: #fff; border: 2px solid var(--color-beige);
      display: flex; align-items: center; justify-content: center;
      font-size: 1.4rem; position: relative; z-index: 1;
      box-shadow: 0 3px 12px rgba(0,0,0,.08);
      transition: transform .2s;
    }
    .track-step:hover .track-dot { transform: scale(1.08); }
    .track-dot.done  { background: var(--color-sage); border-color: var(--color-sage); }
    .track-dot.final { background: var(--color-terra); border-color: var(--color-terra); }
    .track-lbl   { font-weight: 700; font-size: .82rem; margin-top: .6rem; }
    .track-sub   { font-size: .72rem; color: var(--color-muted); max-width: 100px; line-height: 1.4; margin-top: .2rem; }

    /* ── Widget Mondial Relay ─────────────────────── */
    .wr-card {
      background: #fff;
      border-radius: var(--radius-card);
      box-shadow: var(--shadow-card);
      overflow: hidden;
    }
    .wr-header {
      background: #e2001a; color: #fff;
      padding: 1.1rem 1.5rem;
      display: flex; align-items: center; gap: .85rem;
    }
    .wr-logo-badge {
      width: 42px; height: 42px; border-radius: 10px;
      background: rgba(255,255,255,.2);
      display: flex; align-items: center; justify-content: center;
      font-size: 1.3rem; flex-shrink: 0;
    }
    .wr-header-title { font-family: 'Playfair Display', serif; font-size: 1.1rem; font-weight: 700; }
    .wr-header-sub   { font-size: .78rem; opacity: .85; margin-top: .1rem; }

    .relay-search-bar {
      background: var(--color-beige);
      border-radius: 12px; padding: 1.1rem 1.25rem;
      margin-bottom: 1.25rem;
    }
    .relay-search-bar label { font-size: .82rem; font-weight: 600; margin-bottom: .3rem; }
    .relay-search-bar .form-control,
    .relay-search-bar .form-select {
      border-radius: 10px; border-color: #ddd;
      font-size: .88rem; padding: .55rem .9rem;
    }
    .relay-search-bar .form-control:focus,
    .relay-search-bar .form-select:focus {
      border-color: #e2001a;
      box-shadow: 0 0 0 3px rgba(226,0,26,.12);
    }
    .btn-wr {
      background: #e2001a; border: none; color: #fff;
      border-radius: 10px; padding: .55rem 1.1rem;
      font-weight: 600; font-size: .86rem;
      transition: background .2s; white-space: nowrap;
    }
    .btn-wr:hover { background: #b8001a; }

    /* Placeholder widget */
    #mondial-relay-widget {
      min-height: 440px; border-radius: 12px;
      border: 2px dashed #ddd; background: #f9f9f9;
      display: flex; flex-direction: column;
      align-items: center; justify-content: center;
      text-align: center; padding: 2rem;
      position: relative; overflow: hidden;
    }
    #mondial-relay-widget .map-bg {
      position: absolute; inset: 0; width: 100%; height: 100%;
      object-fit: cover; opacity: .07;
    }
    #mondial-relay-widget .ph-content { position: relative; z-index: 1; }
    #mondial-relay-widget .ph-icon { font-size: 3rem; margin-bottom: .75rem; }
    #mondial-relay-widget .ph-title {
      font-family: 'Playfair Display', serif;
      font-size: 1.1rem; font-weight: 700;
      margin-bottom: .5rem;
    }
    #mondial-relay-widget .ph-desc {
      font-size: .83rem; color: var(--color-muted);
      max-width: 340px; line-height: 1.6; margin: 0 auto .75rem;
    }
    #mondial-relay-widget .ph-code {
      background: var(--color-beige); border-radius: 10px;
      padding: .6rem 1.1rem; font-family: monospace;
      font-size: .78rem; color: var(--color-muted);
      display: inline-block;
    }

    /* Résultats relais */
    .relay-result {
      border: 1.5px solid #eee; border-radius: 12px;
      padding: 1rem 1.1rem; margin-bottom: .6rem;
      cursor: pointer; display: flex; align-items: center; gap: .85rem;
      transition: border-color .18s, background .18s;
    }
    .relay-result:hover, .relay-result.selected {
      border-color: #e2001a; background: #fff5f5;
    }
    .relay-pin {
      width: 38px; height: 38px; border-radius: 50%;
      background: #e2001a; color: #fff;
      display: flex; align-items: center; justify-content: center;
      font-size: 1rem; flex-shrink: 0;
    }
    .relay-name  { font-weight: 700; font-size: .88rem; }
    .relay-addr  { font-size: .77rem; color: var(--color-muted); }
    .relay-dist  { font-size: .74rem; font-weight: 600; color: var(--color-sage); margin-top: .15rem; }
    .relay-hours { font-size: .72rem; color: var(--color-muted); margin-top: .1rem; }
    .relay-price-col { margin-left: auto; text-align: right; flex-shrink: 0; }
    .rp-val   { font-weight: 700; font-size: .9rem; }
    .rp-delay { font-size: .7rem; color: var(--color-muted); }
    .check-mark { color: #e2001a; font-size: 1.1rem; display: none; margin-left: .4rem; }
    .relay-result.selected .check-mark { display: block; }

    /* ── Étapes retour ────────────────────────────── */
    .return-step {
      background: var(--color-beige);
      border-radius: 14px; padding: 1.5rem;
      text-align: center; height: 100%;
    }
    .rs-num {
      width: 44px; height: 44px; border-radius: 50%;
      background: var(--color-sage); color: #fff;
      font-family: 'Playfair Display', serif;
      font-size: 1.1rem; font-weight: 700;
      display: flex; align-items: center; justify-content: center;
      margin: 0 auto .8rem;
    }
    .rs-title { font-weight: 700; font-size: .92rem; margin-bottom: .35rem; }
    .rs-desc  { font-size: .82rem; color: var(--color-muted); line-height: 1.6; }

    /* ── Accordéon FAQ (override Bootstrap léger) ─── */
    .accordion-button:not(.collapsed) { color: var(--color-sage) !important; }
    .accordion-button::after { filter: hue-rotate(130deg); }