/* ═══════════════════════════════════════════════════════════
   Suivi maritime (Lot 8.1) — charte AEZ navy/blanc/orange. Scopé .vt-*.
   ═══════════════════════════════════════════════════════════ */
.vt-page{
  --navy:#0b1e3b; --navy-2:#12315c; --navy-deep:#081428;
  --orange:#ff5630; --orange-dk:#c2410c;
  --ink:#0f172a; --muted:#5b6b82; --line:#e6ecf5; --tint:#f5f8fd; --surface:#fff;
  color:var(--ink); background:var(--tint); font-family:inherit;
}
.vt-container{ max-width:960px; margin:0 auto; padding:0 20px; }

/* Hero */
.vt-hero{ background:linear-gradient(135deg,var(--navy-2) 0%,var(--navy) 60%,var(--navy-deep) 100%); color:#fff; padding:40px 0 46px; }
.vt-crumb{ font-size:.82rem; color:#9fb4d4; display:flex; gap:8px; flex-wrap:wrap; margin-bottom:16px; }
.vt-crumb a{ color:#9fb4d4; text-decoration:none; } .vt-crumb a:hover{ color:#fff; }
.vt-eyebrow{ display:inline-flex; align-items:center; gap:8px; font-size:.8rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase;
  color:#ffb9a6; background:rgba(255,86,48,.14); padding:6px 13px; border-radius:999px; margin-bottom:14px; }
.vt-hero h1{ font-size:clamp(1.8rem,4.5vw,2.6rem); font-weight:800; letter-spacing:-.02em; margin:0 0 12px; }
.vt-lead{ font-size:1.06rem; color:#cbd8ee; line-height:1.6; max-width:62ch; margin:0; }

/* Cartes */
.vt-main{ padding:28px 20px 56px; display:flex; flex-direction:column; gap:22px; }
.vt-card{ background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:26px 26px; }
.vt-h2{ font-size:1.35rem; font-weight:800; color:var(--navy); margin:0 0 6px; }
.vt-sub{ color:var(--muted); margin:0 0 18px; }

/* Formulaire */
.vt-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.vt-grid--opt{ grid-template-columns:repeat(2,1fr); margin-top:14px; }
.vt-field{ display:flex; flex-direction:column; gap:5px; }
.vt-field label{ font-weight:700; font-size:.86rem; color:var(--navy); }
.vt-input{ width:100%; padding:11px 13px; border:1px solid #d8e0ec; border-radius:10px; font-size:.95rem; font-family:inherit; color:var(--ink); background:#fff; }
.vt-input:focus{ outline:none; border-color:var(--orange); box-shadow:0 0 0 3px rgba(255,86,48,.14); }
.vt-help{ font-size:.78rem; color:#64748b; }
.vt-err{ font-size:.82rem; color:#b91c1c; font-weight:600; display:inline-flex; align-items:center; gap:6px; }
.vt-optional{ margin:20px 0 4px; border-top:1px solid var(--line); padding-top:14px; }
.vt-optional > summary{ cursor:pointer; font-weight:700; color:var(--navy); font-size:.95rem; list-style:none; display:inline-flex; align-items:center; gap:8px; }
.vt-optional > summary span{ color:var(--muted); font-weight:500; }
.vt-optional > summary::before{ content:"+"; color:var(--orange); font-weight:800; }
.vt-optional[open] > summary::before{ content:"\2212"; }
.vt-example{ margin:18px 0 0; font-size:.86rem; color:#64748b; background:var(--tint); border-left:3px solid var(--orange); border-radius:8px; padding:10px 12px; line-height:1.5; }

/* Boutons */
.vt-btn{ display:inline-flex; align-items:center; justify-content:center; gap:9px; font-weight:700; font-size:.95rem;
  text-decoration:none; border:1px solid transparent; border-radius:12px; padding:13px 22px; cursor:pointer; transition:.15s ease; }
.vt-btn--primary{ background:var(--orange); color:#fff; margin-top:20px; box-shadow:0 8px 22px rgba(255,86,48,.26); }
.vt-btn--primary:hover{ background:var(--orange-dk); transform:translateY(-1px); }
.vt-btn--marinetraffic{ background:var(--navy); color:#fff; width:100%; }
.vt-btn--vesselfinder{ background:var(--navy-2); color:#fff; width:100%; }
.vt-btn--marinetraffic:hover,.vt-btn--vesselfinder:hover{ filter:brightness(1.12); color:#fff; }
.vt-btn:focus-visible{ outline:3px solid var(--navy); outline-offset:2px; }

/* Résultats */
.vt-results{ border-color:#cfe0ff; }
.vt-declared{ background:var(--tint); border:1px solid var(--line); border-radius:12px; padding:14px 16px; margin-bottom:18px; }
.vt-declared-title{ font-weight:800; color:var(--navy); font-size:.85rem; text-transform:uppercase; letter-spacing:.03em; }
.vt-declared ul{ list-style:none; margin:10px 0 0; padding:0; display:grid; grid-template-columns:repeat(2,1fr); gap:6px 18px; }
.vt-declared li{ font-size:.9rem; color:var(--ink); } .vt-declared li span{ color:var(--muted); }
.vt-providers{ display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.vt-provider{ border:1px solid var(--line); border-radius:14px; padding:18px; display:flex; flex-direction:column; gap:12px; }
.vt-provider-head{ display:flex; align-items:center; justify-content:space-between; }
.vt-provider-name{ font-weight:800; color:var(--navy); font-size:1.05rem; }
.vt-provider-mode{ font-size:.72rem; font-weight:700; color:var(--orange-dk); background:rgba(255,86,48,.1); padding:3px 9px; border-radius:999px; white-space:nowrap; }
.vt-provider-mode--direct{ color:#0f7a3d; background:rgba(16,163,74,.12); }
.vt-provider-note{ font-size:.82rem; color:var(--muted); margin:0; display:flex; gap:7px; align-items:flex-start; line-height:1.45; }
.vt-provider-note .fa-circle-check{ color:#12a34a; }
.vt-provider-note .fa-circle-info{ color:var(--navy-2); }
.vt-copy{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.vt-copy-label{ font-size:.75rem; color:var(--muted); flex-basis:100%; }
.vt-copy-val{ font-family:ui-monospace,Menlo,Consolas,monospace; background:var(--tint); border:1px solid var(--line); border-radius:8px; padding:5px 10px; color:var(--navy); font-weight:700; }
.vt-copy-btn{ border:1px solid #d8e0ec; background:#fff; color:var(--navy); border-radius:8px; padding:5px 10px; font-size:.82rem; font-weight:600; cursor:pointer; }
.vt-copy-btn:hover{ background:var(--tint); }

/* Avertissement */
.vt-warn{ display:flex; gap:12px; margin-top:20px; background:#fff7ed; border:1px solid #fed7aa; border-radius:12px; padding:14px 16px; color:#9a3412; }
.vt-warn i{ font-size:1.2rem; flex:none; margin-top:2px; }
.vt-warn strong{ display:block; margin-bottom:4px; }
.vt-warn ul{ margin:0; padding-left:18px; font-size:.9rem; line-height:1.55; color:#7c2d12; }

/* Définitions */
.vt-defs{ display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.vt-def{ background:var(--tint); border:1px solid var(--line); border-radius:12px; padding:14px 16px; }
.vt-def-t{ font-weight:800; color:var(--navy); display:block; margin-bottom:4px; }
.vt-def p{ margin:0; font-size:.9rem; color:var(--muted); line-height:1.55; }

/* FAQ */
.vt-q{ border:1px solid var(--line); border-radius:12px; margin-bottom:10px; overflow:hidden; }
.vt-q summary{ cursor:pointer; padding:14px 16px; font-weight:700; color:var(--navy); font-size:.98rem; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:12px; }
.vt-q summary::-webkit-details-marker{ display:none; }
.vt-q summary::after{ content:"+"; color:var(--orange); font-weight:800; font-size:1.2rem; }
.vt-q[open] summary::after{ content:"\2212"; }
.vt-q p{ margin:0; padding:0 16px 14px; color:var(--muted); font-size:.92rem; line-height:1.6; }

/* Responsive */
@media (max-width:760px){
  .vt-grid, .vt-grid--opt, .vt-providers, .vt-defs, .vt-declared ul{ grid-template-columns:1fr; }
  .vt-btn--primary{ width:100%; }
}