.tr-header, .tr-header * , .tr-header *::before, .tr-header *::after { box-sizing: border-box; }
  .tr-header :is(svg,img){ display:block; max-width:100%; height:auto; }

  .tr-header{
    /* Tokens tricolores */
    --tr-deep:#10367A;          /* bleu marine fond */
    --tr-blue:#10367A;          /* bleu primaire */
    --tr-blue-2:#FE5716;        /* bleu secondaire */
    --tr-blue-3:#93c5fd;        /* bleu pastel */
    --tr-red:#FE5716;           /* rouge moderne */
    --tr-white:#FFFFFF;
    --tr-ink:#000000;           /* texte clair */
    --tr-muted:#6B7280;         /* texte secondaire */
    --tr-line:#10367A;          /* traits sur fond dark */
    --tr-line-light:#D3D3D3;    /* traits sur fond blanc */
    --tr-shadow:0 24px 60px rgba(16, 54, 122,.35);
    --tr-r:20px;

    color:var(--tr-ink);
    background:
      radial-gradient(140% 120% at 15% -10%, rgba(16,54,122,.25) 0%, transparent 60%),
      radial-gradient(120% 100% at 100% 0%, rgba(254,87,22,.18) 0%, transparent 60%),
      var(--tr-deep);
    font:15px/1.6 ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial;
    position:relative; isolation:isolate; overflow:hidden;
  }

  /* ===== Fond vagues (SVG + animation) ===== */
  .tr-waves{ position:absolute; inset:0; z-index:0; pointer-events:none; }
  .tr-wave{ position:absolute; left:0; right:0; }
  .tr-wave--top{ top:-8%; opacity:.7; }
  .tr-wave--mid{ top:10%; opacity:.5; }
  .tr-wave--bot{ top:22%; opacity:.35; }
  .tr-wave svg{ width:160%; min-width:1200px; height:180px; }
  .tr-wave path{ transform: translateX(0); animation: trWave 26s linear infinite; }
  .tr-wave--mid path{ animation-duration: 34s; animation-direction: reverse; }
  .tr-wave--bot path{ animation-duration: 46s; }
  @keyframes trWave { to { transform: translateX(-25%); } }

  .tr-wrap{ max-width:1200px; margin:0 auto; padding: clamp(16px,3vw,28px) 18px; position:relative; z-index:1; }

  /* ===== NAV — pilule blanche ===== */
  .tr-nav{
    display:flex; align-items:center; justify-content:space-between; gap:10px;
    background:var(--tr-white); border:1.5px solid var(--tr-line-light);
    border-radius:calc(var(--tr-r) + 6px);
    box-shadow: 0 14px 36px rgba(16,54,122,.18);
    padding:10px 12px;
  }
  .tr-brand{ display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--tr-deep); font-weight:900; letter-spacing:.2px; }
  .tr-mark{
    width:34px; height:34px; border-radius:12px; display:grid; place-items:center;
    background: conic-gradient(from 0deg, var(--tr-blue), var(--tr-blue-2), var(--tr-red), var(--tr-blue));
    box-shadow: 0 0 0 2px #fff, 0 8px 24px rgba(16,54,122,.28);
  }
  .tr-menu{ display:flex; align-items:center; gap:8px; }
  .tr-link{
    color:var(--tr-deep); text-decoration:none; padding:.55rem .8rem; border-radius:999px; border:1px solid transparent;
    transition: background .15s ease, transform .15s ease, color .15s ease;
  }
  .tr-link:hover{ background:var(--tr-line-light); transform: translateY(-1px); color:var(--tr-blue); }

  .tr-cta{
    display:inline-flex; align-items:center; gap:.55rem; text-decoration:none; font-weight:900;
    padding:.65rem .9rem; border-radius:999px; border:1px solid var(--tr-line-light);
    background: linear-gradient(90deg, var(--tr-red), var(--tr-blue));
    color:#fff; box-shadow: 0 10px 24px rgba(254,87,22,.25);
    transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
  }
  .tr-cta:hover{ transform: translateY(-1px); filter:saturate(1.06); box-shadow: var(--tr-shadow); }

  /* burger mobile */
  .tr-burger{ display:none; background:#fff; border:1px solid var(--tr-line-light); border-radius:10px; padding:8px; }
  .tr-burger svg{ width:20px; height:20px; }
  @media (max-width: 920px){
    .tr-menu{ display:none; }
    .tr-burger{ display:grid; place-items:center; }
    .tr-nav.is-open .tr-menu{
      display:flex; position:absolute; left:18px; right:18px; top:calc(100% + 8px);
      background:#fff; border:1px solid var(--tr-line-light); border-radius:16px; padding:10px; gap:6px; flex-direction:column;
      box-shadow: 0 16px 40px rgba(16,54,122,.22);
    }
  }

  /* ===== HERO ===== */
  .tr-hero{
    display:grid; gap:24px; align-items:center;
    grid-template-columns: 1.1fr .9fr;
    padding: clamp(26px,6vw,66px) 4px 4px;
  }
  @media (max-width: 980px){ .tr-hero{ grid-template-columns: 1fr; } }

  .tr-eyebrow{
    display:inline-flex; gap:.5rem; align-items:center; font-weight:800; letter-spacing:.14em; text-transform:uppercase; font-size:.78rem;
    color: var(--tr-white); background: rgba(254,87,22,.16);
    border:1px solid rgba(254,87,22,.35); border-radius:999px; padding:.35rem .6rem;
  }
  .tr-title{
    margin:.6rem 0 .2rem; font-weight:900; line-height:1.04; letter-spacing:.2px;
    font-size: clamp(2rem, 1rem + 3.2vw, 3.3rem);
    color:transparent; background: linear-gradient(90deg, var(--tr-blue), var(--tr-blue-2), var(--tr-red));
    -webkit-background-clip:text; background-clip:text; position:relative;
  }
  .tr-title::after{
    content:""; position:absolute; inset:-12% -6% -20% -6%; filter:blur(22px); z-index:-1;
    background: radial-gradient(60% 60% at 40% 30%, rgba(16,54,122,.25), transparent 60%),
                radial-gradient(60% 60% at 70% 60%, rgba(254,87,22,.22), transparent 60%);
    animation: trGlow 9s ease-in-out infinite alternate;
  }
  @keyframes trGlow { 0%{ transform: translate3d(0,0,0) scale(1);} 100%{ transform: translate3d(2px,-4px,0) scale(1.02);} }

  .tr-sub{ color:var(--tr-muted); max-width:68ch; }

  .tr-actions{ display:flex; flex-wrap:wrap; gap:10px; margin-top:10px; }
  .tr-btn{
    appearance:none; -webkit-appearance:none; cursor:pointer;
    display:inline-flex; align-items:center; gap:.55rem; text-decoration:none; font-weight:900;
    padding:.9rem 1.1rem; border-radius:14px; border:1.5px solid var(--tr-line-light);
    background: linear-gradient(90deg, var(--tr-red), var(--tr-blue)); color:#fff;
    box-shadow: 0 10px 24px rgba(254,87,22,.24); transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
  }
  .tr-btn:hover{ transform: translateY(-1px); filter:saturate(1.06); box-shadow: var(--tr-shadow); }
  .tr-btn--ghost{ background:transparent; color:var(--tr-ink); border-color:var(--tr-line); }
  .tr-btn--ghost:hover{ background: rgba(255,255,255,.08); }

  /* ===== Orbe 3D (bleu/rouge, sans images) ===== */
  .tr-orb{ justify-self:end; width:min(520px, 100%); aspect-ratio: 1/1; position:relative; display:grid; place-items:center; }
  @media (max-width: 980px){ .tr-orb{ justify-self:stretch; } }

  .tr-orb__halo{
    position:absolute; inset:8%; border-radius:50%;
    background: conic-gradient(from 0deg, var(--tr-blue), var(--tr-blue-2), var(--tr-red), var(--tr-blue));
    filter: blur(22px); opacity:.35; animation: spin 28s linear infinite;
  }
  @keyframes spin{ to{ transform: rotate(1turn);} }

  .tr-orb__ring{
    position:absolute; inset:0; border-radius:50%;
    background:
      radial-gradient(closest-side, rgba(255,255,255,.9) 0%, rgba(255,255,255,.65) 60%, rgba(255,255,255,.0) 61%),
      conic-gradient(from 0deg, rgba(16,54,122,.25), rgba(254,87,22,.25), rgba(16,54,122,.25));
    box-shadow: inset 0 0 0 1.5px rgba(255,255,255,.35), 0 30px 60px rgba(16,54,122,.28);
    border:1px solid rgba(255,255,255,.08);
  }
  .tr-orb__core{
    width:62%; aspect-ratio:1/1; border-radius:50%;
    background: radial-gradient(120% 90% at 30% 20%, #ffffff 0%, #eaf0ff 60%, #e3ebff 100%);
    border:1.5px solid rgba(255,255,255,.18); box-shadow: var(--tr-shadow);
  }
  .tr-orb__ticker{
    position:absolute; bottom:10%; left:50%; transform:translateX(-50%);
    background:rgba(255,255,255,.95); color:#0b2a66;
    border:1px solid var(--tr-line-light); border-radius:999px; padding:8px 12px;
    display:inline-flex; align-items:center; gap:8px; box-shadow: 0 10px 30px rgba(16,54,122,.25);
    font-weight:800;
  }
  .tr-tick{ width:8px; height:8px; border-radius:50%; background: var(--tr-red); box-shadow: 0 0 16px rgba(254,87,22,.55); }

  /* Accessibilité focus + reduce motion */
  .tr-header :is(a,button,input){ outline:none; }
  .tr-header :is(a,button,input):focus-visible{ outline:2px solid var(--tr-blue-2); outline-offset:3px; border-radius:12px; }
  @media (prefers-reduced-motion: reduce){
    .tr-title::after, .tr-wave path, .tr-orb__halo{ animation: none; }
    .tr-btn, .tr-cta, .tr-link{ transition:none; }
  }