/* ==========================================================================
   NavAir — pages publiques intérieures (services, FAQ, contact, suivi,
   conteneur, blog, pages légales). S'appuie sur les jetons de css/home.css.
   ========================================================================== */
body.pg { background: var(--hm-slab); }

/* ---------- En-tête de page ---------- */
.pg-head { padding: calc(var(--nav-h, 72px) + 40px) 0 46px; background-color: var(--hm-slab); background-image: repeating-linear-gradient(90deg, transparent 0 119px, rgba(11, 31, 58, .045) 119px 120px); border-bottom: 2px solid var(--hm-ink); }
.pg-head-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .85fr); gap: 44px; align-items: end; }
.pg-head-grid.solo { grid-template-columns: minmax(0, 1fr); }
.pg-crumb { font-family: var(--hm-mono); font-size: .74rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--hm-steel); margin-bottom: 16px; }
.pg-crumb a { color: var(--hm-steel); text-decoration: underline; text-underline-offset: 3px; }
.pg-title { font-family: var(--hm-display); font-weight: 900; text-transform: uppercase; line-height: .86; font-size: clamp(3rem, 7.4vw, 6.2rem); color: var(--hm-ink); margin: 0 0 22px; }
.pg-title em { font-style: normal; color: var(--hm-signal); }
.pg-lead { margin: 0; max-width: 38em; font-size: 1.06rem; line-height: 1.65; color: #2c3b52; }
.pg-visual { display: block; height: 280px; border-radius: 6px; overflow: hidden; border: 1.5px solid var(--hm-line); background: #e7ebef; }
.pg-visual img, .pg-visual svg { width: 100%; height: 100%; object-fit: cover; display: block; }

/* ---------- Harmonisation des sections existantes ---------- */
body.pg .section { background: transparent; }
body.pg .eyebrow { font-family: var(--hm-mono); font-size: .72rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--hm-signal); background: none; padding: 0; border: 0; }
body.pg .eyebrow::before { display: none; }
body.pg .section-title { font-family: var(--hm-display); font-weight: 900; text-transform: uppercase; line-height: .92; letter-spacing: 0; color: var(--hm-ink); }
body.pg .section-lead { color: var(--hm-steel); }
body.pg .btn { border-radius: 6px; }
body.pg .btn-primary { background: var(--hm-signal); }

/* ---------- Bloc de contenu générique ---------- */
.pg-sec { padding: 64px 0; }
.pg-sec + .pg-sec { padding-top: 0; }
.pg-narrow { max-width: 860px; }

/* ---------- Services ---------- */
.sv-block { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); background: #fff; border: 2px solid var(--hm-ink); border-radius: 6px; overflow: hidden; }
.sv-block + .sv-block { margin-top: 28px; }
.sv-block.rev .sv-img { order: 2; }
.sv-img { min-height: 340px; position: relative; }
.sv-img picture, .sv-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.sv-txt { padding: 32px 32px 30px; display: flex; flex-direction: column; gap: 14px; }
.sv-txt .hm-h2 { font-size: clamp(2.2rem, 4vw, 3.2rem); }
.sv-txt > p { margin: 0; color: #2c3b52; line-height: 1.65; }
.sv-facts { margin: 6px 0 0; display: grid; grid-template-columns: 1fr 1fr; border-top: 1.5px solid var(--hm-ink); }
.sv-facts div { padding: 12px 12px 12px 0; border-bottom: 1px solid var(--hm-line); }
.sv-facts div:nth-child(even) { padding-left: 14px; border-left: 1px solid var(--hm-line); }
.sv-facts dt { font-family: var(--hm-mono); font-size: .66rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--hm-steel); }
.sv-facts dd { margin: 5px 0 0; font-weight: 800; color: var(--hm-ink); }
/* Une exception à la valeur annoncée juste au-dessus — un délai plus court sur
   une destination. En orange de marque et non en gris : c'est une information
   que le client doit voir, pas une mention qu'on relègue. */
.sv-facts dd .sv-precision { display: block; margin-top: 4px; font-family: var(--hm-mono); font-size: .68rem; font-weight: 600; letter-spacing: .03em; color: var(--hm-signal); }
.sv-txt .hm-btn { align-self: flex-start; margin-top: 6px; }
.sv-incl { background: var(--hm-ink); color: #fff; padding: 72px 0; }
.sv-incl .hm-h2 { color: #fff; }
.sv-incl .hm-head p { color: #aab7c9; }
.sv-incl-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; }
.sv-incl-grid figure { margin: 0 0 14px; border-radius: 6px; overflow: hidden; }
.sv-incl-grid svg { display: block; width: 100%; height: auto; }
.sv-incl-grid h3 { font-family: var(--hm-display); font-weight: 900; text-transform: uppercase; font-size: 1.6rem; line-height: .95; margin: 0 0 8px; color: #fff; }
.sv-incl-grid p { margin: 0; color: #c3cedd; line-height: 1.6; font-size: .94rem; }

/* ---------- FAQ ---------- */
.pg-faq { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 48px; align-items: start; }
.pg-search input { width: 100%; min-height: 52px; border: 2px solid var(--hm-ink); border-radius: 6px; padding: 0 16px; font: 600 1rem 'Montserrat', sans-serif; color: var(--hm-ink); background: #fff; margin-bottom: 26px; }
.pg-search input:focus { outline: none; box-shadow: 0 0 0 3px rgba(234, 91, 12, .25); }
body.pg .faq-wrap { max-width: none; margin: 0; }
body.pg .faq-cat-label { font-family: var(--hm-mono); font-size: .72rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--hm-signal); margin: 30px 0 8px; padding: 0; }
body.pg .faq-cat-label:first-child { margin-top: 0; }
body.pg .faq-item { background: none; border: 0; border-top: 1.5px solid var(--hm-ink); border-radius: 0; box-shadow: none; margin: 0; }
body.pg .faq-item:last-of-type { border-bottom: 1.5px solid var(--hm-ink); }
body.pg .faq-q { padding: 18px 2px; font-weight: 800; font-size: 1.04rem; color: var(--hm-ink); background: none; }
body.pg .faq-q:focus-visible { outline: 3px solid var(--hm-signal); outline-offset: 2px; }
body.pg .faq-q .chev { color: var(--hm-signal); }
body.pg .faq-a-inner { padding: 0 2px 20px; color: #2c3b52; line-height: 1.65; }
.pg-aside { position: sticky; top: calc(var(--nav-h, 72px) + var(--navair-dep-h, 0px) + 20px); background: var(--hm-ink); color: #fff; border-radius: 6px; padding: 24px; display: grid; gap: 14px; }
.pg-aside h3 { font-family: var(--hm-display); font-weight: 900; text-transform: uppercase; font-size: 1.8rem; line-height: .95; margin: 0; }
.pg-aside p { margin: 0; color: #c3cedd; line-height: 1.55; font-size: .92rem; }
.pg-aside .ft-wa { width: 100%; }

/* ---------- Contact ---------- */
body.pg .contact-grid { gap: 0; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); background: #fff; border: 2px solid var(--hm-ink); border-radius: 6px; overflow: hidden; }
body.pg .contact-info { background: var(--hm-ink); color: #fff; padding: 30px; display: grid; gap: 0; align-content: start; }
body.pg .contact-item { display: grid; grid-template-columns: 1fr; gap: 4px; padding: 14px 0; border-bottom: 1px solid rgba(255, 255, 255, .14); background: none; box-shadow: none; border-radius: 0; }
body.pg .contact-item .ic { display: none; }
body.pg .contact-item h4 { font-family: var(--hm-mono); font-size: .68rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: #fdba8c; margin: 0; }
body.pg .contact-item p, body.pg .contact-item a { color: #fff; font-weight: 700; margin: 0; overflow-wrap: anywhere; }
body.pg .contact-item a:hover { color: #fdba8c; }
body.pg .contact-form { padding: 30px; border: 0; box-shadow: none; border-radius: 0; background: #fff; }
body.pg .contact-form h3 { font-family: var(--hm-display); font-weight: 900; text-transform: uppercase; font-size: 2.2rem; line-height: .95; }
body.pg .contact-form .track-input, body.pg .contact-form textarea { border: 1.5px solid var(--hm-line); border-radius: 6px; background: #fff; font-family: 'Montserrat', sans-serif; }
body.pg .contact-form .track-input:focus, body.pg .contact-form textarea:focus { border-color: var(--hm-ink); box-shadow: 0 0 0 3px rgba(234, 91, 12, .2); outline: none; }
body.pg .contact-form .field-label { font-family: var(--hm-mono) !important; font-weight: 600 !important; font-size: .68rem !important; letter-spacing: .06em !important; }

/* ---------- Suivi ---------- */
body.pg .track-page { max-width: 860px; }
body.pg .track-search { background: #fff; border: 2px solid var(--hm-ink); border-radius: 6px; box-shadow: none; padding: 28px; }
body.pg .track-search h3 { font-family: var(--hm-display); font-weight: 900; text-transform: uppercase; font-size: 2rem; line-height: .95; }
body.pg .track-field { border: 2px solid var(--hm-ink); border-radius: 6px; background: #fff; box-shadow: none; overflow: hidden; }
body.pg .track-field .track-input { font-family: var(--hm-mono); font-size: 1.15rem; font-weight: 600; letter-spacing: .04em; border: 0; }
body.pg .track-btn { background: var(--hm-signal); border-radius: 0; }
body.pg .track-result { border: 2px solid var(--hm-ink); border-radius: 6px; box-shadow: none; }
body.pg .track-result .result-head { background: var(--hm-ink); }
body.pg .track-result .result-head h3 { font-family: var(--hm-mono); letter-spacing: .04em; }
body.pg .meta-box { border-radius: 4px; }
body.pg .meta-box .k { font-family: var(--hm-mono); font-size: .66rem; letter-spacing: .06em; }
body.pg .tl-step.done .tl-dot, body.pg .tl-step.current .tl-dot { background: var(--hm-signal); border-color: var(--hm-signal); }
body.pg .track-empty { border: 2px dashed var(--hm-line); border-radius: 6px; background: #fff; }

/* ---------- Pages légales ---------- */
body.pg .legal-content { background: #fff; border: 2px solid var(--hm-ink); border-radius: 6px; padding: 36px 40px; box-shadow: none; line-height: 1.7; color: #2c3b52; }
body.pg .legal-content h2 { font-family: var(--hm-display); font-weight: 900; text-transform: uppercase; font-size: 1.9rem; line-height: .95; color: var(--hm-ink); margin: 34px 0 12px; padding-top: 20px; border-top: 1.5px solid var(--hm-line); }
body.pg .legal-content h2:first-of-type { border-top: 0; padding-top: 0; margin-top: 10px; }
body.pg .legal-content h3 { color: var(--hm-ink); }
body.pg .legal-meta { font-family: var(--hm-mono); font-size: .74rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--hm-steel); }
body.pg .legal-content a { color: var(--hm-signal); }

/* ---------- Blog ---------- */
body.pg .blog-grid { padding: 48px 0 72px; }
body.pg .bcard { background: #fff; border: 2px solid var(--hm-ink); border-radius: 6px; box-shadow: none; overflow: hidden; }
body.pg .bcard:hover { transform: translateY(-2px); box-shadow: 0 12px 24px -16px rgba(11, 31, 58, .45); }
body.pg .art-wrap { padding-top: calc(var(--nav-h, 72px) + 36px); }
body.pg .art-back { font-family: var(--hm-mono); font-size: .76rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--hm-steel); }
body.pg .art-wrap .art-title { font-family: var(--hm-display); font-weight: 900; text-transform: uppercase; line-height: .95; font-size: clamp(2.2rem, 6vw, 3.4rem); white-space: normal; overflow: visible; text-overflow: clip; }

/* ---------- Responsive ---------- */
@media (max-width: 960px) {
  .pg-head-grid { grid-template-columns: 1fr; gap: 26px; }
  .pg-visual { height: 210px; }
  .sv-block, .sv-block.rev { grid-template-columns: 1fr; }
  .sv-block.rev .sv-img { order: 0; }
  .sv-img { min-height: 220px; }
  .sv-incl-grid { grid-template-columns: 1fr 1fr; }
  .pg-faq { grid-template-columns: 1fr; }
  .pg-aside { position: static; }
  body.pg .contact-grid { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .pg-head { padding-top: calc(var(--nav-h, 72px) + 26px); padding-bottom: 34px; }
  .sv-txt { padding: 24px 18px; }
  .sv-facts { grid-template-columns: 1fr; }
  .sv-facts div:nth-child(even) { padding-left: 0; border-left: 0; }
  .sv-incl-grid { grid-template-columns: 1fr; }
  body.pg .legal-content { padding: 24px 18px; }
  body.pg .contact-info, body.pg .contact-form, body.pg .track-search { padding: 22px 18px; }
}
.pg-aside h3 { color: #fff; }
body.pg .contact-item { border: 0; border-bottom: 1px solid rgba(255, 255, 255, .14); padding: 14px 0; }
body.pg .contact-item:last-child { border-bottom: 0; }
body.pg .contact-item > div { padding: 0; }
/* Sections alternées des anciennes pages : blanc franc sur le béton, comme ailleurs */
body.pg .section[style*="bg-soft"] { background: #fff !important; border-top: 2px solid var(--hm-ink); border-bottom: 2px solid var(--hm-ink); }

/* Article : le texte justifié creuse des trous sur petit écran */
@media (max-width: 700px) { body.pg .art-content, body.pg .art-content p, body.pg .art-content li { text-align: left !important; hyphens: auto; } }

/* ---------- Suivi : résultat (fiche de colis) ---------- */
body.pg .track-result { background: #fff; overflow: hidden; margin-top: 22px; }
body.pg .track-result .result-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; padding: 24px 26px; background: var(--hm-ink); color: #fff; border-radius: 0; }
body.pg .tr-k { display: block; font-family: var(--hm-mono); font-size: .66rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #8193ab; margin-bottom: 6px; }
body.pg .track-result .result-head h3 { font-family: var(--hm-mono); font-weight: 600; font-size: clamp(1.4rem, 4.6vw, 2rem); letter-spacing: .04em; color: #fff; margin: 0; line-height: 1.1; overflow-wrap: anywhere; }
body.pg .track-result .result-head .sub { margin-top: 6px; font-weight: 700; color: #c3cedd; font-size: .95rem; }
body.pg .tr-step { margin-top: 16px; font-family: var(--hm-mono); font-size: .72rem; font-weight: 600; letter-spacing: .04em; color: #fdba8c; display: grid; gap: 7px; max-width: 260px; }
body.pg .tr-bar { display: block; height: 4px; background: rgba(255, 255, 255, .16); border-radius: 2px; overflow: hidden; }
body.pg .tr-bar i { display: block; height: 100%; background: var(--hm-signal); border-radius: 2px; }
body.pg .status-badge { display: inline-block; font-family: var(--hm-display); font-weight: 900; font-size: 1.15rem; text-transform: uppercase; letter-spacing: .03em; color: var(--hm-signal); background: transparent; border: 2.5px solid var(--hm-signal); border-radius: 5px; padding: 5px 12px 4px; transform: rotate(-4deg); white-space: nowrap; }
body.pg .btn-share { background: rgba(255, 255, 255, .08); color: #fff; border: 1px solid rgba(255, 255, 255, .3); border-radius: 6px; }
body.pg .btn-share:hover { background: rgba(255, 255, 255, .16); }
body.pg .track-result .result-body { padding: 0; }
body.pg .track-result .result-meta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; margin: 0; border-bottom: 2px solid var(--hm-ink); }
body.pg .track-result .meta-box { background: none; border: 0; border-radius: 0; padding: 16px 20px; }
body.pg .track-result .meta-box + .meta-box { border-left: 1px solid var(--hm-line); }
body.pg .track-result .meta-box .k { font-family: var(--hm-mono); font-size: .64rem; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--hm-steel); margin: 0 0 6px; }
body.pg .track-result .meta-box .v { font-family: var(--hm-mono); font-weight: 600; font-size: 1.02rem; color: var(--hm-ink); }

/* Frise */
body.pg .track-result .timeline { position: relative; padding: 22px 26px 8px; margin: 0; }
body.pg .track-result .timeline::before { left: 41px; top: 34px; bottom: 34px; width: 2px; background: var(--hm-line); }
body.pg .track-result .tl-step { position: relative; padding: 0 0 22px 46px; }
body.pg .track-result .tl-dot { position: absolute; left: 0; top: 0; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: #fff; border: 2px solid var(--hm-line); color: var(--hm-line); }
body.pg .track-result .tl-step.done .tl-dot { background: var(--hm-ink); border-color: var(--hm-ink); color: #fff; }
body.pg .track-result .tl-step.current .tl-dot { background: var(--hm-signal); border-color: var(--hm-signal); color: #fff; box-shadow: 0 0 0 6px rgba(234, 91, 12, .18); }
body.pg .track-result .tl-step h4 { margin: 4px 0 3px; font-size: 1rem; font-weight: 800; color: var(--hm-ink); }
body.pg .track-result .tl-step.current h4 { color: var(--hm-signal); }
body.pg .track-result .tl-step.pending h4 { color: #9aa6b6; font-weight: 700; }
body.pg .track-result .tl-step p { margin: 0; font-size: .88rem; color: var(--hm-steel); line-height: 1.5; }
body.pg .track-result .tl-step.pending p { color: #b0bac7; }
@media (max-width: 600px) {
  body.pg .track-result .result-head { padding: 20px 18px; flex-direction: column; }
  body.pg .track-result .result-head > div:last-child { flex-direction: row !important; align-items: center !important; width: 100%; justify-content: space-between; }
  body.pg .track-result .meta-box { padding: 12px 10px; }
  body.pg .track-result .meta-box .v { font-size: .86rem; }
  body.pg .track-result .timeline { padding: 20px 18px 6px; }
  body.pg .track-result .timeline::before { left: 33px; }
}