/* Offres : styles propres à la page (préfixe off-) */

/* ---------- Héros ---------- */
.off-hero.page-hero.simple{padding-bottom:40px}
.off-hero .reassure{justify-content:flex-start;margin-top:24px}
@media (max-width:759px){.off-hero .reassure{justify-content:center}}

/* ---------- Les 4 formules ---------- */
.off-plans{padding-top:44px}
.off-legend{display:flex;flex-wrap:wrap;gap:10px 22px;justify-content:center;font-size:14.5px;color:var(--t2)}
.off-legend span{display:inline-flex;align-items:center;gap:8px}
.off-legend i{width:14px;height:14px;border-radius:5px;background:#FFFAF3;border:1px solid var(--line-2)}
.off-legend i.p{background:#17414A;border-color:#17414A}
.off-plans .plans4{margin-top:28px}
.off-plans .p4{transition:translate .35s cubic-bezier(.34,1.56,.64,1)}
.off-plans .p4:hover{translate:0 -6px}
.off-plans .p4.star{animation:offGlow 3.2s ease-in-out infinite}
@keyframes offGlow{0%,100%{box-shadow:0 0 0 2px #FF6B2C,0 34px 70px -30px rgba(255,107,44,.55)}50%{box-shadow:0 0 0 2px #FF6B2C,0 0 0 8px rgba(255,107,44,.16),0 34px 70px -30px rgba(255,107,44,.7)}}
.off-setup{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 14px;margin:28px auto 0;max-width:760px;padding:14px 20px;border-radius:999px;background:var(--card);border:1px solid var(--line);font-size:15px;color:var(--t2);text-align:center}
.off-setup b{color:var(--t1);font-weight:600}
.off-setup .tag{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:999px;background:#8C3B22;color:#F6F4EE;font-weight:600;font-size:13px}
@media (max-width:640px){.off-setup{border-radius:20px}}

/* ---------- Tableau comparatif (brume) ---------- */
.off-cmp{background:var(--mist);border-top:0}
.off-tw{margin-top:44px;border-radius:22px;background:#FFFAF3;border:1px solid var(--mist-line);overflow-x:auto;box-shadow:0 30px 70px -40px rgba(15,49,56,.35)}
.off-t{width:100%;min-width:600px;border-collapse:collapse;font-size:15px}
.off-t th,.off-t td{padding:15px 14px;border-top:1px solid #E7E2D8;text-align:center;vertical-align:middle}
.off-t thead th{border-top:0;padding:20px 14px 16px;font-family:var(--f-d);font-weight:600;font-size:17px;letter-spacing:-.02em;color:var(--t1);line-height:1.15}
.off-t thead th small{display:block;margin-top:4px;font-family:var(--f-b);font-weight:600;font-size:13px;letter-spacing:0;color:#93452A}
.off-t thead th.ph small{color:#1E5560}
.off-t tbody th{text-align:left;font-weight:500;color:var(--t1);width:32%}
.off-t td{color:var(--t1);font-weight:600}
.off-t .ph{background:#EAF0EE}
.off-t .star{background:#DCE7E4}
.off-t thead .star{background:#17414A;color:#F3EDE4}
.off-t thead th.star small{color:#FFB020}
.off-t tr.off-pr td{font-family:var(--f-d);font-size:22px;letter-spacing:-.03em}
.off-t tr.off-pr th{font-weight:600}
.off-t tr.grp th{padding:20px 14px 8px;border-top:0;font-family:var(--f-m);font-size:11.5px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:#1E5560}
.off-t .y{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:rgba(200,97,59,.14);color:#93452A}
.off-t .ph .y,.off-t .star .y{background:#17414A;color:#FFB020}
.off-t .n{color:#5E5650;font-weight:500}
.off-t .txt{font-size:13.5px;font-weight:600;line-height:1.3}
.off-t .sr{position:absolute;left:-9999px}
.off-t .shl{display:none}
.off-t tbody tr{transition:background .2s}
.off-t tbody tr:hover{background:rgba(255,176,32,.08)}
.off-note{margin-top:14px;font-size:13.5px;color:var(--t2)}
@media (max-width:640px){
  .off-tw{border-radius:16px}
  .off-t{font-size:13px;min-width:0;table-layout:fixed}
  .off-t th,.off-t td{padding:11px 3px}
  .off-t thead th:first-child{width:37%}
  .off-t tbody th{padding-left:10px;font-size:13px;line-height:1.3}
  .off-t .lgl{display:none}
  .off-t .shl{display:inline}
  .off-t thead th{font-size:13.5px;padding:14px 3px 12px}
  .off-t thead th small{font-size:10.5px}
  .off-t tr.off-pr td{font-size:16px}
  .off-t tr.grp th{padding-left:10px}
  .off-t .txt{font-size:11.5px}
  .off-t .y{width:22px;height:22px}
}
/* coches qui apparaissent */
.off-tw.js-anim .off-t .y{transform:scale(0)}
.off-tw.js-anim.go .off-t .y{animation:offPop .5s cubic-bezier(.34,1.8,.64,1) forwards;animation-delay:calc(var(--i,0) * 45ms)}
@keyframes offPop{to{transform:scale(1)}}

/* ---------- Toujours inclus (bande pétrole) ---------- */
.off-inc{background:var(--pet);border-top:0}
.off-inc h2{color:var(--pet-fg)}
.off-inc .mute,.off-inc .lead,.off-inc .label{color:var(--pet-mute)}
.off-inc .eyebrow i{background:#FFB020}
.off-why.why2{display:block;margin-top:44px}
@media (min-width:980px){.off-why .adv{grid-template-columns:repeat(3,1fr)}}
.off-why .adv b{color:var(--pet-fg)}
.off-why .adv p{color:#D4E0DE}
.off-why .adv li.hot b{color:#2A1308}
.off-why .adv li.hot p{color:#5A3E2E}

/* ---------- FAQ ---------- */
.off-faq .faq{margin-top:36px}
@media (prefers-reduced-motion:reduce){.off-plans .p4.star{animation:none}.off-plans .p4:hover{translate:none}}
